网易：孤独师执业考试

2018-03-21 H5案例分享 H5案例分享

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

识别图中二维码

孤独师执业考试-查阅二维码

完整欣赏此案例大约需要3分钟

案例：孤独师执业考试

出品：网易

亮点：

策划上，测试类，这是对网易旗下的网易新闻和网易直播的宣传，首页点击进入，引出晚上10点时用户还在加班的剧情，用户可以选择继续加班或现在回家，若回家则赶上最后一班地铁，可选择眯一会或是坚持一下，坚持一下则有路过便利店进去逛逛与直接回家两种情况，若进入便利店，会引出店员少找了用户5角钱的剧情，可以选择回去找店员要回或是默默回家，此一种情况结束，引出两个结果；若不进入便利店，则默默回家，发现冰箱里什么都没有，饿着肚子睡着了，此一种情况结束，引出一个结果；若选择在地铁上眯一下，则会有坐过站的情况，可选择下车原地睡下或是走路回家，若原地睡下则会引出一只流浪猫，可选择吸猫或者不理它，此一种情况结束，引出两个结果；若选择走路回家会引出一对情侣吵架的剧情，可选择劝架或是在一旁观看，此一种情况结束，引出两个结果；如此进行，共有11种测试结果，即用户的孤独指数的11种不同情况。测试结束引导用户重新测试或是分享给朋友。
设计上，以墨蓝色为颜色主调，并且以插画的形式展现整个剧情。
体验上，加载流畅，测试题目简明扼要，3-4个题目即可完成测试。

技术实现： Zepto.js + canvas

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

标签