致敬每一个努力的平凡人

案例赏析链接：https://h5.whalesgeek.net/cp/rrd/index.html

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

案例：我昨天失眠了

出品：人人贷

亮点：

1. 创意策划上，讲述每一个努力的人，以“我昨天失眠了”引出，从凌晨3点到晚上11点。当凌晨3点醒来，发现原来每日送奶的人，是这么早就来送奶；做煎饼的张氏夫妻，早4点起床，6点出摊，全年无休；开公交车的刘师傅；公司白领Tina，9点上班，从不迟到，年度全勤员工；送餐员小王；搞卫生的陈姐；追求音乐梦想的街头艺人赵哥；就像H5案例中叙述的，还要有多少的努力，才能完整我们这“平凡的一天”。

2. 设计上，唯美颗粒度画风，每一屏都可以做明信片。

3. 技术上，动画基于pixi.js实现，调用PIXI.Application生成一个舞台对象，而后把用户滑动屏幕的事件touchstart、touchmove、touchend绑定到舞台对象，获取用户滑动屏幕纵轴Y方向的距离。根据Y方向的数值，加载动画效果和播放对应的音频文件。

4. 体验上，充满正能量的H5，通过普通的一天，因为失眠，了解到从凌晨3点到晚上11点，每一个努力的平凡人。原来我们的生活中，每一个平凡人都在做着不平凡的事儿。

技术实现： pixi.js

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