天猫：色彩能量值检测报告

2019-03-25 H5案例分享 H5案例分享

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

识别图中二维码

色彩能量值检测报告-查阅二维码

完整欣赏此案例大约需要20秒

案例：色彩能量值检测报告

品牌：天猫

亮点：

创意定位：天猫推出的一支测试类的H5，在3.8日女王节之际，测试女孩子可能都不知道自己的隐藏属性——色彩能量值。
策划上，①首页有天猫的logo品牌，点击“测测我的色彩能量值”按钮。②从下面10件商品中选择3件（只能选3件）加入购物车，点击“购物车”图标结账，③最后生成一张我的色彩能量报告，蓝红黄各占百分之多少，还有多少K的能量值，有两个按钮分别是：“再测一次”和“点击此处截图保存（生成二维码，‘再测一次’按钮消失）”。
设计上，浅蓝色为主色调，最后的人物形象极度饱满的彩色构图，色彩反差的搭配。
体验上，每个女孩子心里都隐藏着一份色彩能量值，只要将喜欢的东西放入购物车，就能生成你的色彩能量报告哦~

技术实现： Egret tween jQuery

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

标签