果酱音乐：2018年你还会被这些“病”困扰吗？

2018-01-18 H5案例分享 H5案例分享

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

识别图中二维码

2018年你还会被这些“病”困扰吗？-查阅二维码

完整欣赏此案例大约需要38秒

案例：2018年你还会被这些“病”困扰吗？

出品：果酱音乐

亮点：

策划上，测试答题类，① 焦虑症、强迫症、抑郁症…，在快节奏的生活中，我们很多人都被这些问题困扰，现在来测测你“病”的有多重吧，点击首页按钮开始诊断。② 而后静下来，听6段音乐，每段音乐跟着四个选项，根据你内心的第一直觉，进行选择，，勿躲勿藏。③ 全部答完后，名医根据答题情况分析得出你的“病”症，想治病的点击尾屏“快来看病”按钮，对症下药医好你的病。
设计上，漫画风格，采用蓝色作为主色调，画风相对来说简单简洁一些，loading页的“药丸”与“要完”谐音，使整支H5在一开始就走起了娱乐化的戏谑路线。里面的图片背景是医院，再加上护士、病号和名医，构造了一个被病症困扰的场景，符合标题。
技术上，图片预加载采用的是PxLoader（基于JavaScript的HTML5应用程序预加载库），测试结果页是采用Canvas生成的图片。

技术实现： jQuery + PxLoader

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

标签