浦发信用卡：千古奇画的前世今生

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

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

识别图中二维码

千古奇画的前世今生-查阅二维码

完整欣赏此案例大约需要2分12秒

案例：千古奇画的前世今生

出品：浦发信用卡

亮点：

策划上，本则案例以时间的顺序，将画卷千里江山图坎坷的一生娓娓道来。采用与千里江山图同风格的绘画风格，以文字渐进的方式，向用户展示这幅画卷颠沛流离的经历。无论从艺术上，还是交互上都给人一种浑然一体的感觉。最后引出改主题的信用卡产品，过渡自然。
技术上，采用 zepto 操作 DOM，howler.js 处理案例的音效，提高兼容度。
体验上，采用中国传统的水墨画形式，通过时间的推移和渐进文字的阐述，向用户传达信息，配以舒缓的音乐，给人一种十分放松，十分享受的感觉。随着故事的推移，画风和音乐也随剧情变化，节奏变化间，使用户对画卷的悲惨经历感同身受。

技术实现： Zepto + Howler.js

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

标签