万科：万科在线家

2016-09-23 H5案例分享 H5案例分享

案例：万科在线家

出品：万科

亮点：

策划上，游戏类；① 在首屏的纸张内上画一个小人，画完后，点击确定完成；② 以自己画的小人为主人翁，开启寻宝之旅；③ 在寻宝的过程中，玩家需要画线作为道路、画线做绳索，帮助小人顺利到达朋友圈；④在朋友圈里被怪兽追赶，慌不择路的来到朋友圈万科在线家购房券消息旁，十分好奇，就点击拿券，结果被更多怪物追赶，点击万券齐发，打败怪兽拿到钥匙寻到宝藏，原来宝藏就是万科在线家9.12全网首发的好消息
设计上，采用红色作为主色调掉，淡黄色作为辅色调，前半部分，采用手绘漫画风格；后半部分模仿微信朋友圈，故事性很强，且生动有趣
交互上，需要用手指在提示的指定区域内画出所需物件，其他交互点多为点击
技术上，此支H5主要采用的是Canvas+JavaScript

技术实现： jQuery + Canvas

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

识别图中二维码

万科在线家-查阅二维码

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

标签