我觉得技术型的H5，就到年底吧，Say Goodbye了。” W创始人三水这么评价H5的发展，他说他是来砸饭碗的。

这是上周STC分享会上三水先生让人印象深刻的一句话。当然，三水所表达的，似乎不是H5已经不行了，只是在探讨——一种技术在营销中应用的根本，除了技术本身，我们还应该关注什么？

接下来的内容，节选自STC分享会上几位重量级嘉宾的精彩分享，他们的作品很多都是百万级、千万级UV的神级案例。或许一千万只是一个数字，但数字背后，他们的思考是什么，他们做了哪些工作，有哪些值得分享的经验？以下，可能对你有所启发：

关于H5的几个创新应用和实战

未来应用 CEO 陈鸿

▌1.双屏互动

下面是我们做的一个双屏互动的H5，从一部手机向另一部手机“倒水”：

这是我们研究H5重力感应的应用实验，有很多好玩的东西。我们把H5做成水，两个手机之间，A手机往B手机里面倒水。水是可以倒的，意味着A手机往B手机送玫瑰花也可以，如果我手一滑，旁边的同事就可以收到一朵玫瑰花。这种互动方式，能让大家在分享当中感受到快乐，感受到非常不同的东西。

多屏互动可能会是接下来H5应用的热点,通过引入好友的参与,更容易引起传播。

▌2.能挣钱的H5

接下来介绍的H5是在电商方面的应用，一天卖500到2000单左右，这是淘宝后台的截图，基本可以看到每秒钟都有定单产生， 700个定单，时间不到一个小时。

怎么通过H5来卖东西？

首先，H5它是非常棒的流量转化和流量获取工具。平时我们发一篇图文，由于微信的限制你无法设置商品的跳转链接，可能一万个人看到了也没有人会产生直接的购买，有了H5之后，通过丰富的展示和灵活的布局能大大的提高商品购买的点击率，这是流量的转化。

还有一个是流量的获取。因为H5它的表现形式是非常丰富的，有各种各样的形式都可以跟商品结合，最重要的是，消费者在移动端手机这么小的屏幕内，根本不在乎你是不是大卖家，他们只是看到这个画面让人感动，这个画面是不是令他们喜欢就够了，可以说我们现在营销的难度被降低了，降得很低。

上面的H5就是一个例子，通常情况下卖花生，很多人都是普通的卖花生，但我们把花生的故事拿出来“卖”，消费者可能被故事打动了，同时觉得9.9包邮也不贵，他除了购买可能还会帮你传播，但是让他传播的动机往往不是花生，而是花生的故事。

这里我再分享一点实用的经验。通常来说H5卖货有两个方法，一个是去淘宝，但微信是屏蔽淘宝的，如果我们可以在中间做一个过渡页，短期内从微信进淘宝的通路是很畅通的。还有就是去微店或者京东，但是去京东有一个小问题，如果赶上京东促销的时候可能就过不去。

▌3、H5如何推广

我们有这些推广方式可以做：APP客户端，QQ群，论坛，摇一摇，线下海报，微博，朋友圈，还有H5的自带流量，H5还是有流量的，哪怕有一个还是两个，把H5的链接指向新的活动，新的H5，比如说我们服务了一百个客户，我们有选择性的跟互联网公司互相之间打流量，比如说看过优酷的可以去支付宝，我们也有这个系统，也可以免费的分享给大家。

有时候H5在推广之前需要做一些前期的测试，确保H5传播的效果。这里分享一个H5的传播窍门：找一个微信群扔进去，看一看微信群里面的分享情况。做完H5的时候，不急于传播，先扔到自己的好友群里面看一看，看看他们愿不愿意转发，如果不愿意，就及时止损和调整，基本我们所有的H5都会这么来试一试。

另外，有时候我们会遇到被微信屏蔽或者举报的问题，有两个小技巧供大家参考：

第一个是注册多个域名。因为很多人屏蔽只屏蔽你的一个域名，当我们有很多域名的时候，他屏蔽也来不及，如果我们注册一百个域名呢，按照现在25块钱一个域名来算，一百个才是2500，但给你带来的可能是100万UV，非常划算的。

第二个是页面的举报。其实我们可以在H5页面上面做一个假的举报按纽，用户一点就到我们这里来了，还可以顺便跟用户聊聊天。我们也建了一个微信规则研究团队，专注举报50年，测试一下微信能不能屏蔽H5。

▌4、各种级别H5团队配比

下面是针对不同级别的H5对应的团队构成，一般顶配为几十万预算的级别，标配为几万的级别，低配就是几千的级别了。

H5创作三步曲

NPLUS CMO 王正新

以下简单分享几点H5创作的经验总结，希望对大家有帮助：

▌Step 1定基调

试不爽的包括:逗比无节操范，煽情鸡汤魂，酷炫未来风，文艺复古流，萌萌哒掐出水。下面是一些案例：

▌Step 2编故事

定了基调，大家知道接下来要编故事，无论是任何形式的传播，内容都是非常重要的，好的内容会自传播，所以一开始我们都要编一个故事，一开始要想，你的故事线是什么？

这是我们给OPPO做的一个项目，是当时第一批朋友圈广告，我们将家庭、孩子、妻子、父母、成长、影像这些元素串成一条感情线，通过故事来述说产品和人的故事。24小时之内2.24亿人看到了朋友圈这个内容，给OPPO带来了26万的粉丝：

▌Step 3细节处理

主线差不多有了，接下来要做一些细节的东西，主要有两块，一个是交互，一个是选音乐。适当的音乐能够渲染情绪，方法就是不断的试听和感受。交互性质的东西可能体验来得直接一些，大家可以看看下面不同类型的例子：

总结一下，抓眼，享听，走心，暗爽，还有易参与，这是做好H5非常关键的几点。要做到影响人心有非常重要的两点，一个是表现层面的创意和技术，还有一个方面，把握用户的情感，情趣，情欲。这里面你最起码要做到有情感，一个H5没有情感是挺难传播的，这是我给大家的一些建议。

低成本、零技术H5开发指南

Epub360 创始人 陈建峰

一年前，要实现一个简单的H5场景应用，还不是件轻松地事，涉及到前端动效及交互开发、微信接口开发、服务端开发，现在，大量的优秀H5场景应用快速推出，这与H5开发团队的逐渐成熟以及多款H5可视化设计工具推出有直接的关系。

综合来讲，完成一款H5场景应用的交付，基本上有以下两种实现方式：

1、 交给专业开发团队

优点：高自由度定制、最优的代码运行效率。

缺点：开发周期长，高昂的人员成本、沟通成本，如果是外包，还会带来较高的管理成本.

2、选用H5设计工具

优点：低成本、周期短、可由设计师独立完成交付，沟通成本低、改版快。

缺点：自由度受限年会ppt策划，不能完全达到编代码的自由度、代码有冗余，运行效率降低，不过随着工具产品的发展以及手机性能的提升，这些逐渐会得到改善。

当然，目前的H5设计工具已经能满足大部分企业的需求，以下通过四种类型的H5分享低成本制作的一些经验。以下列举的案例均为Epub360工具制作，零技术。

▌1、动态展示

展示级的H5场景应用是目前用的最多的类型，主要实现动态的内容展示，类似于PPT的动态效果，展示类H5一般以设计和文案为重中之重，动态效果服务于内容。制作难度不大，一个比较简便的方法就是先做好静态设计，之后再考虑画面元素的动态展示。

案例：

▌2、交互式动画

交互级的H5场景应用除了支持动画外，还需要支持手势触发和设备触发行为（摇一摇、重力感应等），它通过用户的触发行为进行内容的交互呈现，同时通过触发反馈来增强用户的交互体验。交互式动画典型的代表就是游戏，通过动作触发、参数变量设置、逻辑判断和记忆存储实现复杂的交互。

案例：

▌3、互动&用户参与

互动级的H5，需要支持用户的参与、提升游戏性，读者不仅仅只是内容的阅读者和转发者，还能够参与内容的个性化修改，形成读者自己的内容，满足读者的社交需求。

案例：

探索H5交互技术的边界

VXPLO CEO 孟智平

H5能做什么？或者确切来说，不用任何代码的H5工具能做到何种地步？这是我们从2008年就在探索的。

几乎涵盖了H5所能实现的各种交互应用，其中有几个是比较值得一提的：第一是多屏互动。第二是多点触摸。第三是视频购物。多屏互动刚才已经有嘉宾讲过了，我重点说一下多点触摸和视频购物的应用。

首先是多点触摸的应用。实际上除了手机端的应用，H5还可以做PC端的应用，所有交互场景，包括大型的博物馆，展厅，车展都可以用到交互技术，以前要花很多人很长的时间，完成代码去实现，但是现在只要大家有了素材就能非常容易地把它做出来了。

视频中的例子是可以多人多点触摸的，12块屏幕拼接，8m长。我们也是第一个在H5应用里面实现多人多点的技术，这是全球直接可以使用的一个案子。

接下来重点强调一下视频购物。我们可以点视频里的任何东西，任何时候，管它停还是不停，我们都可以购买，这是一种全新的商业模式。

对于视频的支持，其实在下一个H5的应用里面应该是一个非常重要的一点，这里面用到了交互技术，另外还有时间的逻辑，可以把视频中的时间给独立出来，进行单独的编辑。大家可以想象视频的每一帧都变成可交互的H5网页元素，是什么效果。

其实基于交互视频，我们还可以有很多丰富的应用，比如结合多屏互动，我们可以通过手机在看电视的时候购物，不需要下载App这种繁琐的过程，只需要扫一扫或者摇一摇就可以实现。

大家可能很难想象上面的例子都是用我们的工具VXPLO做的，看起来异常复杂的技术，已经可以用零代码的手段实现。

不管大家是否认可这个事，H5它一定是发生了，而且除非是有H6来取代H5，实际上除了这种情况之外，其实我想不出有其他的什么情况，可以让H5突然的就死掉。它就是承载内容的一种形式，像以前的网页一样，现在就是大家打开手机，或者网站以后越来越多的都是H5的内容，仅此而已。

H5还能火多久？

W创造者 三水

我不看好H5的发展，这是我一直对外宣称的，也不是叫嚣，真是发自内心的感悟。为什么不看好H5呢？我通过四个案例来分享自己的一些思考。

第一个案例大家可能都看过，“我们之间就一个字”。

这套作品实际上刚产生的时候，是有H5的规律和规则的，比如说主题信息要明确，产品信息要放到第一位，甚至LOGO往前放，但是最后我们所有的东西都是逆向而行，最后只呈现了一个大众点评就餐的信息，而且LOGO非常小。

你会发现这个案例破了三大障碍：

☆小字没有人读。

☆主题不清晰，你想讲什么，我只是一个大桌餐，叫大家来聚餐的，给那么多字。

☆我的LOGO在哪里？

全部逆向而行的案例，但最终的结果实现了第一次的200多万级的刷屏，而后引起超过70家品牌的跟进，从百度开始，到麦当劳、汉堡王、宝洁、国家大剧院、霍比特人等等年会ppt策划，生命力延续到半年以上，至今仍有品牌按照W的模板去创造内容。

在这里给大家秀一下，我们坚持一个原则，都是自己的原创。创意无标本，无可判断，但创造的标本没有那么虚，看你在作品里面敢不敢投入时间和成本。

基于内容上面，接下来有条路子走得比较偏的，我给大家看一个成功的反例——“谁先住进你新房”。

这是给苏泊尔做的案例，刷爆了所有技术男和IT业的论坛。这个案例有几大突破：第一我们创造了一个APP级别的H5。第二个是三维动画。第三个，我们完成了一个几乎不可能实现的任务，把300M压缩到不到7M。

大家肯定打了很多问号？就是带着这个问号，我们在所有的技术问题上刷爆了朋友圈，之后我去介绍这个程序是怎么来的？压缩软件是什么？但是后来我发现H5的道路走偏了。

大家可以来看它的精度。到达什么样的程度呢？这里面所有的脸谱动画都是我们公司自己搭棚做的，我们把微缩景观做到极致，你点击小柜子都可以打开，比如说电话机下面有两个小蟑螂盯着你看，你的目的是找到它，并且把它吸走。游戏入镜是傻瓜式的，但是游戏的制作

来源【写作训练营】自媒体，更多内容/合作请关注「辉声辉语」公众号，送10G营销资料！