网易云课堂：解锁生成你的世界杯原力

2018-06-15 H5案例分享 H5案例分享

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

识别图中二维码

解锁生成你的世界杯原力-查阅二维码

完整欣赏此案例大约需要1分30秒

案例：解锁生成你的世界杯原力

出品：网易云课堂

亮点：

策划上，这则案例以铁杆球迷在世界杯期间与工作产生冲突而展开。以漫画的形式，勾画出工作中一个个的冲突场景，并弹出选择框与用户产生交互。根据用户所选项，生成一张球星卡。
技术上，采用 zepto 操作 dom，连接场景切换和交互行为。
体验上，用定格漫画的方式，加上足球比赛中的哨子音效，给人紧凑的感觉。又在末尾变换节奏，使其舒缓起来。在节奏变幻间，让用户能更好的融入案例中，提升参与程度。

技术实现： Zepto + Howler

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

标签