网易新闻 X URBAN REVIVO：我的人生BUG报告

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

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

识别图中二维码

我的人生BUG报告-查阅二维码

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

案例：我的人生BUG报告

品牌：网易新闻 X URBAN REVIVO

技术实现： PixiJS

亮点：

1.创意定位

网易新闻联手 URBAN REVIVO出品，通过对大多数人来说，2020发生很多很糟心的事情这个点切入，引起用户共鸣，借势传播。

2.策划逻辑

作品大致分为四部分：

①开始界面

loading到开始界面，有个小人不停跑步中摔倒，爬起来又继续奔跑，点明BUG主题，画面自动播完跳转下一页；

②姓名栏界面

用户输入姓名；

③选择题界面

h5共九道题，每一题对应一个结果，关联后面结果页；

④结果页

显示你的2020BUG报告人设结果，作品二维码，用户可在此界面点击商品跳转客户页面，分享，或重新测试。

3.设计上

h5整体的调性是轻松诙谐的，整体配色会比较明亮、跳跃。每个画面还配有局部动画，整体画面显得生动、饱满。

4.交互上

H5的主线是BUG，在交互上，会添加与BUG有关联的元素。例如用户点击有BUG的按钮，会听到哭声音效，烘托、升华h5氛围。在姓名栏界面以及选择题的画面切换都运用到了故障效果去呼应BUG主题。

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

标签