招商银行：测一测谁是色彩大师

2019-07-29 H5案例分享 H5案例分享

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

识别图中二维码

测一测谁是色彩大师-查阅二维码

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

案例：测一测谁是色彩大师

品牌：招商银行

亮点：

1.创意定位

由招商银行银联卡制作的名画上色小游戏H5。

2.策划逻辑

整个H5大致分为三部分：

①Loading部分：深紫色的背景，亮色的卡通的银联卡标志在画面中央，下方是加载数据。加载完成后自动进入一段动画：一夜之间很多名画都失去了它们的色彩，群众都很惊恐，主持人和采访记者均为名画里的人物，所以现在全球寻找“色彩大师”拯救艺术瑰宝。点击“前往拯救”进入游戏。

②上色部分：左右滑动选择喜欢的名画，点击“给TA上色”进入一段“战场清扫中”的Loading，最右边的上色栏里有八个颜色。可收缩，还有“随机上色”选项。点击颜色再点击画面，会自动上色。上好色后点击“完成涂色”。

③落地页部分：由刚刚绘制的名画生成一张银联卡，右边会分析出各种画派和注解，点击“长按保存分享”分享给好友，点击“评估价值”进入银联官网。

3.设计上

八个颜色的搭配选色已经经过了筛选，不官怎么上色都很舒服，自动调整饱和度。

4.体验上

新奇的上色方式，还有动画前情。左上角可关闭音乐。

技术实现： HTML5

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

标签