|
案例链接 http://h1.whalesgeek.net/campaign/2017/Html5_B_jd_battery/index.html 完整欣赏此案例大约需要3分 案例：京东救援队 出品：JD.com 京东 亮点： 策划上，视频类H5。加载完毕，出现“Start”按钮，点击开始播放视频。视频长2分46秒，大小约5Mb。视频内容前半部分讲述“女配角”去电影院看电影，不料遇到丧失，尝试逃跑却失败，躲进车里却打不着车，危急时刻看到“京东救援队”广告，于是按下了“一键救援”按钮。按下按钮后的0.6秒，也就是眨眼之间，女配脱离危险并成功打着火，但她并不知道这0.6秒间发生了什么。此时视频暂停，出现进度条，用户需要放大那0.6秒来查看真相。后半部分则是主角京东救援队长出现，来告诉你这0.6秒到底发生了什么，原来救援队长在眨眼之间几经波折，最终打败僵尸，修好汽车并救下女配。结尾页露出slogan“买蓄电池就上京东”以及促销信息，底部点击按钮“一键救援”可以跳转至京东活动页，点击“奔走相告”提示分享。 设计上，美漫风格，混杂了僵尸与超级英雄题材，故事背景在晚上，整体色调为暗色。虽然这些因素让故事看上去很重，但波澜起伏的剧情设计，配合逗比搞笑的对话&独白，整体调调还是很轻松愉快。救援队长身着红色盔甲，又符合红色代表正义，力量等典型的中国式思维，也符合京东品牌的主色调。 体验上，哈哈哈哈哈哈真的笑出猪声，感觉能给人留下深刻印象的地方很多，女配逃跑失败，以卸妆来调侃僵尸，僵尸调戏队长…尤其是僵尸在门外时女配从容自拍的那段，哈哈哈哈哈哈简直是小五本五没错了，也恰好呼应了“2017，再遇上什么事我都不觉得惊奇”。逗比的故事，加上结尾处霸屏slogan，小五反正记住了“买蓄电池就上京东”。 技术实现： Video(视频) + Zepto
以上为“H5案例分享”团队原创文章，转载请注明出处！ |
