东风标致4008：我们的距离，2730刚刚好

2016-12-29 H5案例分享 H5案例分享

案例：我们的距离，2730刚刚好

出品：东风标致4008

亮点：

策划上，图文展示类，2730一个数字，但不同人却可能阐释为不同的含义；在这个案例中，它没有将其给予一个完整的定义，而是通过不同的计量单位来展示，宇宙间两颗行星的距离，东海的深度，埃菲尔铁塔的高度等进行衡量；由此引出东风标致4008的2730同级最长轴距，从而自然而然的过渡到东风标致4008全球首发成都车展。
设计上，采用带有金属质感的黑色作为主色调，蓝色和橘色作为辅色调，宇宙星空、浩瀚海洋有一种魔幻神秘风，埃菲尔铁塔的风景很优美，后面的东风标致4008介绍页很有科技感。
技术上，第二页画一条直线，采用的是canvas，动画主要采用的是CSS3的animation。

技术实现： jQuery + Canvas

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

识别图中二维码

我们的距离，2730刚刚好-查阅二维码

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

标签