腾讯英雄联盟：天呐，周杰伦竟然会读心术！

2017-09-01 H5案例分享 H5案例分享

案例：天呐，周杰伦竟然会读心术！

出品：腾讯英雄联盟

亮点：

策划上,周年庆+视频+测试答题类；① 在充满悬疑神秘气氛的场景下，电竞男神周杰伦化身中单英雄“卡牌”，通过一副牌去猜测你心中所想之牌，前提是玩家需要根据给出的选项回答周董的三个问题；② 而后检测周董是否能够看出你的内心，最后在尾页爆出英雄联盟六周年狂欢盛典的时间和地点，想知道卡牌秘密的，请来英雄联盟六周年狂欢盛典，一起秀出6！
设计上，盗墓风，设计者通过英雄联盟中的经典中单英雄人物卡牌作为主角，并以当今电竞男神周杰伦作为扮演者，极大地吸引了广大用户的注意力，接着以周董“读心”与用户进行互动，很好的宣传了这次活动。
技术上，①以带有x-webkit-airplay，airplay，webkit-playsinline，playsinline等属性的Video作为周董演示卡牌的展现形式；② 测试答题的实现是采用Canvas来实现的。

技术实现： Video + Canvas

案例演示，请长按/扫描以下二维码 ->

识别图中二维码

天呐，周杰伦竟然会读心术！-查阅二维码

以上为“H5案例分享”团队原创文章，转载请注明出处！

标签