广告也爱看！细数腾讯出品的10个最佳Html 5广告

@大明白儿：在Html5广告大行其道的今天，作为互联网行业巨头之一的腾讯，在这段时间里，产出了大量创意与视觉都极其优秀的作品，领域横跨游戏、节日活动甚至新闻报道。今天我们挑选了10个堪称教材级的案例，特舒服的互动体验和新颖的表现形式，绝对不枉你进来一趟。

本文为作者授权优设发布，未经作者本人授权请勿转载，谢谢 ：）

作者微信公众号：H5广告资讯站，欢迎关注唷。

友情提示：建议所有案例都要搭配音乐欣赏。

1. 《生命之上，想象之下》   腾讯UP大会宣传广告

起初，我是被模仿埃舍尔画面的封面吸引的，虽然这支H5整体画面没有能够传承埃舍尔的绘画精髓，但是他还是打破了传统幻灯片式的呈现方式，塑造出了一种宽广、素雅、幽静的整体感受，而在互动方面有些略显单一了...

2. 《全民主公H5广告》 腾讯三国手游推送广告

一款逗逼味十足的H5推送广告，而选它上榜就是因为该广告别具一格的互动体验，先不谈题材是否匹配，单奔着这种将日本爱情动作片特征植入广告的互动精神，众网友就值得为之点赞！

整个H5画面执行出色，气氛渲染到位，在搭配擦掉动作片马赛克的互动体验！

我想大声的呼喊：腾讯～我想告诉你，你不是一个人在奔跑！你身后，至少还有一大票动作片粉丝在支持着你！

3. 《梦想童年》 \ 《你的创意还活着么？》 微信游戏推送

这是两支风格极为类似，格调走心的H5,（看管要搭配音乐观看呀～）它让我直接联想到了2013年腾讯qq的年中贺岁广告大片《弹指间 心无间》系列，  简单而到位...

我突然会有这样的感触：试着把这些喜欢的H5放进收藏夹，在睡前细细品味，他就像是我们小时候，妈妈讲的睡前故事...我们是躲在钢筋混泥土背后那一群群在衣衫里的寂寞高手，我们每个人的信念依然需要童话，不管你已是为人父母还是年事已高...而这些走心的H5广告也许就是我们这些当代都市人的美丽童话！

4. 《发现平行宇宙之美》 游戏推送广告

我不确定，这是一个会让人人都喜欢的作品，但是这种类似版画风格的格调却是让设计同仁们津津乐道的，从体验来分析，我认为这支H5在选择环节缺乏一定的粘性，很可能，每选择一次都会有不少的用户流失，选项也略显过多，利用慢节奏的画面来引导选择，内容还是需要有足够的吸引力的！慢节奏再加上多选，我不知道是不是一种能带来较高转化的好方法...

在风格上，有 《生命之上，想象之下》的延续之意 ，而整体感受还是能打动我这个行业同仁的～所以选择上榜！

5. 《你，错过了多少次暴富机会》 腾讯YE游节推送广告

推选它上榜，是因为该作品的文案和出色的美术执行，这支h5的风格很像是w的《一步一步看清韩寒》，一个是在打字，一个是在碎纸～，而在文字的处理上算是特别下心思了，不管是正文还是标题，都可以算得上插入的巧妙，应用的有考究～

6. 《一个红包看尽中国人的情与利》 活动推送广告

这是一支出品于2015年新年的微信宣传广告，作为从业者，当时瞬间就被它的创意给吸引了！我估计这支广告在当时的转化率不一定很高，而且和后来的活动宣传也不够配套，但是，我觉得这支广告达到了每个创意人所追求的那种状态，那就是——人人心中之所有，而人人笔下之所无...  在情理之中，而意料之外的感受。

7. 《这一幕你期待已久》美剧推送/ 《为什么你还单身？》节目推送广告

这两支广告均来自腾讯视频，第一支因形势特殊，和呆板的幻灯片式样的H5拉开了距离，第二支则是因为它比较好的声画同步展示，可以很快抓住用户的注意力，这两支H5我觉得在美术和执行上会逊色于上面的作品，但是在互动体验上确更为出色～

8. 《移动页面用户行为报告》—— 腾讯娱乐 市场部出品

实际针对H5的相关数据行为报告远远不止这些，但是，我估计这应该是第一支被大范围传播开来，并且具有可信度的H5数据报告的H5！

虽然内容量有限，但是对于广大基础领域的开发者来说，它绝对有着非常重要的参考价值，想更了解究竟什么是H5，那就赶紧来看看吧～

9. 《这是马航MH370客机消失的第365天》 新闻推送广告

相信各位看官都看累了，但是这最后一支案例一定不要错过，在观看了大量同质化的案例时，我还是被这支H5给吸引住了，因为我从来没有想象到新闻事件原来也可以和H5结合到这种程度，完全改变了我对以前新闻传播的固有意识，或者换句话说，也许H5就是未来几年新媒体新闻投放的努力方向！也许，这也将是对新闻传播方式革命的开始～

大腾讯的H5案例远远不止这些，而一篇日志的承载力又是有限的，我非常希望能把自己看到的，听到的更多的好的案例推送给诸位，也一直在估计如何分享内容，分享多少内容才能达到更好的用户体验。

在这些案例中，我尽量权衡到了差异化和品质感这两个属性，这些带有腾讯烙印的H5案例，我相信在不同程度都会为我们带来启示，作为一个传统行业转战互联网的跨界设计师来说，面对H5时，我的心境是复杂的，数码设计在不断的消灭我从小对设计养成的固有意识，我和王受之老师的心境是一样的！或者说，我和当时新艺术运动时期的手工设计师们的心情是一样的！

H5广告是我看到过的第一种能够大范围传播并且能实现超媒体感念的设计途径，它是数码设计新浪潮的先行军，是数码设计社会化的开始！

【走在时代前列的腾讯HTML 5精品好文】

DNF实战总结好文！
《腾讯游戏实战！DNF浴火新生H5项目总结》

优化HMTL 5页面的6个技巧！
《腾讯精品文！六大奇招带你优化HTML5移动页面》

H5页面设计实战总结！
《春雨先知！腾讯移动端H5页面设计实战分享》

作者：苏杭SH

【优设网 原创文章 投稿邮箱：2650232288@qq.com】

================关于优设网================
"优设网uisdc.com"是国内人气最高的网页设计师学习平台，专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：http://hao.uisdc.com/book/。
设计微博：拥有粉丝量98万的人气微博@优秀网页设计 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的"福利"吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加：