剑侠情缘：忘忧镇

2017-11-10 H5案例分享 H5案例分享

案例：忘忧镇

出品：剑侠情缘

亮点：

策划上，武侠江湖视频类，林更新与赵丽颖继《忘忧酒馆》后，再度携手演绎一段跌宕起伏的江湖情缘。全程以第一视角进行呈现演绎，具有极强的参与感和真实感。这部交互微电影共计8种不同剧情走向，另附一则彩蛋。每一种抉择将带来全然不同的故事结局引人止不住想要彻底一探究竟。江湖之上的恩怨情仇，如何割舍？又如何携手忘忧？漫步江湖路遇情缘，大侠不妨也来忘忧镇看看吧。
设计上，武侠风，采用金色作为主色调，宝剑、古镇、公子、小姐等在不知不觉中就把人带入了江湖里，不同的选择产生不同的故事走向，很有趣味性。
技术上，这支H5中的微电影画面主要是采用带有x-webkit-airplay，airplay，webkit-playsinline，playsinline 等属性的武侠风创意Video视频来实现的；选择不同故事走向的界面的实现方式用的是Canvas。

技术实现： Video + Canvas + CreateJs

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

识别图中二维码

忘忧镇-查阅二维码

完整欣赏此案例大约需要3分钟

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

标签