H5现在被广泛用于品牌产品的推广当中，下面蓝橙互动为大家做一个电商H5案例分析，看看H5作为推广工具的具体效果如何。

案例：京东救援队

类型：视频展示型

内容策划：

首先是加载页面，有“start”按钮，点击按钮后开始播放。

H5分为了两个部分，第一个部分主要叙述女主角跟闺蜜约电影，迟到6分钟赶到电影院，下车被丧尸围堵。由于被电线杆挂住了于是躲进车中，奈何车怎么也启动不了，经过一阵女主的“意淫”与“开脑洞”，还是于事无补，正当丧尸不耐烦砸玻璃的时候，一道光亮后，女主得救了。

正当大家以为H5结束的时候，女主回忆到“刚刚发生了什么”，紧接着出现了一个进度条，拉动进度条进入第二部分。

第二部分是H5男主的登场。主要叙述了男主大战丧尸的几个回合，最终女主得救。而后又回到了第一部分，女主再想刚刚是怎么得救的时候。在男主大战丧尸的过程中，植入京东蓄电池的广告，这时会让人想到，因为女主始终无法启动车所以才引出后续的一系列问题。

交互设计

H5设计中交互很少，最重要的一个就是第一部分播放完后视频停止，出站的进度条，用户想要知道那0.6s女主是如何得救的，就需要缩放进度条来看，形式不老套。

视觉设计

H5整体是欧美的漫画风格，故事发生在晚上，又结合了丧尸的情节，所以画面较暗，但是也足够有视觉冲击力。同时，红色也符合京东自身的调性。

优点：

整个H5的画面配上配音，故事情节有发展，设置悬念与跌宕起伏，使得观看时紧跟着H5的节奏走，让人难以走神。

文案的设计上，也幽默风趣。与当下的一些槽点结合，比如：卸妆的反差巨大，遇到事情第一时间想到的是发朋友圈，脑洞大开，碰瓷等都是生活中经常碰到的现象，放在文案策划中很诙谐。

缺点：

广告有点牵强，车打不着火就一定是电瓶没电了么？广告出来的有点突兀，第一部分中应该巧妙的将女主为什么打不着火的原因与广告的出现衔接起来。

通过对这个经典H5案例的分析，相信大家已经知道H5是如何进行企业产品的推广了，如果你有这个H5的开发需求，欢迎咨询蓝橙网站客服，获取最新H5定制开发服务。