喜马拉雅FM：你有多孤独？这个H5比你更了解
甲方爸爸喜马拉雅市场部，希望做一个H5推广新课程，《范景中讲西方艺术史》，于是有了这个H5需求。
正赶上网易的人格测试H5刷了一波，于是决定做一个在博物馆答题测试的H5，致敬网易，把刷屏H5做出了新高度。网易测人格，咱测一测孤独指数。
扫描二维码，测试你的孤独！
（数英网 App 用户需点击放大二维码后，长按识别）
策划先行，设计跟上。
团队讨论后，希望能够造出一种沉浸式的氛围，让用户更加有带入感。一个好的视觉体验需要有一个双重人格的设计，不断的自我否定。
附上头图进化史，说实话摆出来一看，第一版是有点辣眼睛的。最终给到客户爸爸的版本，无论是高级感还是精细度都要高很多。
市面上测试类的H5同质化还是很严重的，都说画面不够动效来凑。为了做出些区别，后期大哥花心思做了很多动效。
这里用到的动画制作工具，flash和ae。
loading动画
看魔法小樱长大的孩子
答题页的触发小动画
结果…技术复现后资源巨大…不得不佩服，技术妹子删减动画的能力。
删减多余帧数，合并雪碧图，再加上分段加载终于（偷偷跑你流量），控制住了loading时间。技术部分主要使用白鹭引擎，H5开发万用神器。
最后整个方案纠结最多的就是生成海报了，改了n版，附上我最喜欢的一版本，最终效果如何，客官自己扫描体验一下吧。
专业评分
专业评分已截止
评论
评论
推荐评论
全部评论（9条）