如果H5不火了，微信死了，活下來的會是什么？
來源：Social Talent
“我覺得技術型的H5，就到年底吧，Say Goodbye了?！?W創始人三水這么評價H5的發展，他說他是來砸飯碗的。
這是上周STC分享會上三水先生讓人印象深刻的一句話。當然，三水所表達的，似乎不是H5已經不行了，只是在探討——一種技術在營銷中應用的根本，除了技術本身，我們還應該關注什么？
接下來的內容，節選自STC分享會上幾位重量級嘉賓的精彩分享，他們的作品很多都是百萬級、千萬級UV的神級案例。或許一千萬只是一個數字，但數字背后，他們的思考是什么，他們做了哪些工作，有哪些值得分享的經驗？以下，可能對你有所啟發：
關于H5的幾個創新應用和實戰經驗分享
未來應用 CEO 陳鴻
1、雙屏互動
下面是我們做的一個雙屏互動的H5，從一部手機向另一部手機“倒水”：
多屏互動可能會是接下來H5應用的熱點，通過引入好友的參與，更容易引起傳播。
2、能掙錢的H5
接下來介紹的H5是在電商方面的應用，一天賣500到2000單左右，這是淘寶后臺的截圖，基本可以看到每秒鐘都有定單產生， 700個定單，時間不到一個小時。
怎么通過H5來賣東西？
首先，H5它是非常棒的流量轉化和流量獲取工具。平時我們發一篇圖文，由于微信的限制你無法設置商品的跳轉鏈接，可能一萬個人看到了也沒有人會產生直接的購買，有了H5之后，通過豐富的展示和靈活的布局能大大的提高商品購買的點擊率，這是流量的轉化。還有一個是流量的獲取。因為H5它的表現形式是非常豐富的，有各種各樣的形式都可以跟商品結合，最重要的是，消費者在移動端手機這么小的屏幕內，根本不在乎你是不是大賣家，他們只是看到這個畫面讓人感動，這個畫面是不是令他們喜歡就夠了，可以說我們現在營銷的難度被降低了，降得很低。
上面的H5就是一個例子，通常情況下賣花生，很多人都是普通的賣花生，但我們把花生的故事拿出來“賣”，消費者可能被故事打動了，同時覺得9.9包郵也不貴，他除了購買可能還會幫你傳播，但是讓他傳播的動機往往不是花生，而是花生的故事。
這里我再分享一點實用的經驗。通常來說H5賣貨有兩個方法，一個是去淘寶，但微信是屏蔽淘寶的，如果我們可以在中間做一個過渡頁，短期內從微信進淘寶的通路是很暢通的。還有就是去微店或者京東，但是去京東有一個小問題，如果趕上京東促銷的時候可能就過不去。
3、H5如何推廣
我們有這些推廣方式可以做：APP客戶端，QQ群，論壇，搖一搖，線下海報，微博，朋友圈，還有H5的自帶流量，H5還是有流量的，哪怕有一個還是兩個，把H5的鏈接指向新的活動，新的H5，比如說我們服務了一百個客戶，我們有選擇性的跟互聯網公司互相之間打流量，比如說看過優酷的可以去支付寶，我們也有這個系統，也可以免費的分享給大家。（有需要的朋友請在Social Talent公眾號留言）有時候H5在推廣之前需要做一些前期的測試，確保H5傳播的效果。這里分享一個H5的傳播竅門：找一個微信群扔進去，看一看微信群里面的分享情況。做完H5的時候，不急于傳播，先扔到自己的好友群里面看一看，看看他們愿不愿意轉發，如果不愿意，就及時止損和調整，基本我們所有的H5都會這么來試一試。
另外，有時候我們會遇到被微信屏蔽或者舉報的問題，有兩個小技巧供大家參考：
第一個是注冊多個域名。因為很多人屏蔽只屏蔽你的一個域名，當我們有很多域名的時候，他屏蔽也來不及，如果我們注冊一百個域名呢，按照現在25塊錢一個域名來算，一百個才是2500，但給你帶來的可能是100萬UV，非常劃算的。
第二個是頁面的舉報。其實我們可以在H5頁面上面做一個假的舉報按紐，用戶一點就到我們這里來了，還可以順便跟用戶聊聊天。我們也建了一個微信規則研究團隊，專注舉報50年，測試一下微信能不能屏蔽H5。（有興趣入群的可以在Social Talent公眾號后臺留言）
4、各種級別H5的團隊配比
下面是針對不同級別的H5對應的團隊構成，一般頂配為幾十萬預算的級別，標配為幾萬的級別，低配就是幾千的級別了。
H5創作三步曲
NPLUS CMO 王正新
以下簡單分享幾點H5創作的經驗總結，希望對大家有幫助：
Step 1：定基調
試不爽的包括：逗比無節操范，煽情雞湯魂，酷炫未來風，文藝復古流，萌萌噠掐出水。下面是一些案例：
Step 2：編故事
定了基調，大家知道接下來要編故事，無論是任何形式的傳播，內容都是非常重要的，好的內容會自傳播，所以一開始我們都要編一個故事，一開始要想，你的故事線是什么？這是我們給OPPO做的一個項目，是當時第一批朋友圈廣告，我們將家庭、孩子、妻子、父母、成長、影像這些元素串成一條感情線，通過故事來述說產品和人的故事。24小時之內2.24億人看到了朋友圈這個內容，給OPPO帶來了26萬的粉絲：
Step 3：細節處理
主線差不多有了，接下來要做一些細節的東西，主要有兩塊，一個是交互，一個是選音樂。適當的音樂能夠渲染情緒，方法就是不斷的試聽和感受。交互性質的東西可能體驗來得直接一些，大家可以看看下面不同類型的例子：
總結一下，抓眼，享聽，走心，暗爽，還有易參與，這是做好H5非常關鍵的幾點。要做到影響人心有非常重要的兩點，一個是表現層面的創意和技術，還有一個方面，把握用戶的情感，情趣，情欲。這里面你最起碼要做到有情感，一個H5沒有情感是挺難傳播的，這是我給大家的一些建議。
低成本、零技術H5開發指南
Epub360 創始人 陳建峰
綜合來講，完成一款H5場景應用的交付，基本上有以下兩種實現方式：
1、 交給專業開發團隊
優點：高自由度定制、最優的代碼運行效率。缺點：開發周期長，高昂的人員成本、溝通成本，如果是外包，還會帶來較高的管理成本.
2、選用H5設計工具
優點：低成本、周期短、可由設計師獨立完成交付，溝通成本低、改版快。缺點：自由度受限，不能完全達到編代碼的自由度、代碼有冗余，運行效率降低，不過隨著工具產品的發展以及手機性能的提升，這些逐漸會得到改善。
當然，目前的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家品牌的跟進，從百度開始，到麥當勞、漢堡王、寶潔、國家大劇院、霍比特人等等，生命力延續到半年以上，至今仍有品牌按照W的模板去創造內容。
在這里給大家秀一下，我們堅持一個原則，都是自己的原創。創意無標本，無可判斷，但創造的標本沒有那么虛，看你在作品里面敢不敢投入時間和成本。
基于內容上面，接下來有條路子走得比較偏的，我給大家看一個成功的反例——“誰先住進你新房”。
點擊查看數英網案例：蘇泊爾：誰先住進你新房？ 首個H5大型粘土動畫
這是給蘇泊爾做的案例，刷爆了所有技術男和IT業的論壇。這個案例有幾大突破：第一我們創造了一個APP級別的H5。第二個是三維動畫。第三個，我們完成了一個幾乎不可能實現的任務，把300M壓縮到不到7M。
大家肯定打了很多問號？就是帶著這個問號，我們在所有的技術問題上刷爆了朋友圈，之后我去介紹這個程序是怎么來的？壓縮軟件是什么？但是后來我發現H5的道路走偏了。
大家可以來看它的精度。到達什么樣的程度呢？這里面所有的臉譜動畫都是我們公司自己搭棚做的，我們把微縮景觀做到極致，你點擊小柜子都可以打開，比如說電話機下面有兩個小蟑螂盯著你看，你的目的是找到它，并且把它吸走。游戲入鏡是傻瓜式的，但是游戲的制作非常復雜。我是不是在做一件在朋友圈里面可以搖頭擺尾，但是卻是在技術大師門前班門弄斧的事情，我們表面上給客戶輸出的是一個H5，但是實際上輸出的是三個動畫片，一個游戲，再加上一個H5。
這樣一個超量級的內容傳播效果好不好，非常好，在哪兒？技術男都轉了，技術男的女朋友們都轉了，他們拼命地研究，但這樣百萬級的傳播讓我覺得心里怪怪的，如果我的技術走到這個程度的話，我就在反思，我是不是把所有的力量用錯了地方。
之后開始意識到內容的回歸和技術的平衡可能是H5發展的方向之一，接下來我們就越來越往這個方向義無反顧地走了。
點擊查看數英網案例：New Balance：青春是什么顏色？ 微信活動
這是NB的案例。當時作為國際化的客戶他來找到我們，提出了很多要求和想法，在多次溝通之后，我們走了一個極簡的手法：去除動畫，就是用純粹的創意，純粹的文字去跟消費者去溝通，青春是什么。
大家可能沒有看這個字，比如我隨便舉個例子“青春是黑與白，不是你說走就走，而是要選擇一條路，用這種方式來進行還原”，這是消費者心里面想的內容。這套作品最大的成功不是數字，因為我拿上來的作品都是百萬級的，數字不是我們真正想夸耀的，而是我們發現有消費者在抄襲我們的文案，超過我們做《失孤》父與子那個，那個案例很多人也在模仿。
另外一個，基本上案板級的案例，我把技術降到零點，也是實現了百萬以上級別的傳播效果，但這里面只是一個小聰明，相信大家已經有看到，其實無非就是利用人的最簡單的洞察，就是這樣一個小聰明，實現了一個H5簡單非技術流的高回報。
點擊查看數英網案例：大眾點評：這個陌生來電你敢接嗎？ 移動網站
其實整個后臺程序是非常簡單的，可能你去地鐵站門口，買一本H5入門手冊，4塊8就可以買得到，當晚就可以學到怎么上后臺把程序模板下下來，然后做一個一模一樣的出來。之后我們也欣喜的看到，這個模板在大行其效，有的人做了BABY的來電，有的做了范冰冰來電，總之各種各樣的創意跟隨而來。
H5的本意不在于秀技術上，也不只是簡單的把傳統性的廣告內容，盲目移植在一個底板上。但這一點講白了還是需要一定的沉淀，這個沉淀真的不是說前端技術和所謂的動畫表現，而是在于你是否足夠了解你的客戶，也了解你的市場敏感性在什么地方。
我用最后五分鐘時間，總結一下我想講的內容。其實我覺得H5是一點都不難，好像大家會看到不過就是一個鍵生成 H5 PPT嗎？有一句話說過，我們來看，H5就是一個關于時間的游戲，大部分H5等于這個東西的，本質上不過就是一個PPT，在別的場合你不愿意讀的長文案，或者你不愿意看的那些細節的文字，他如何把商品通過最有效的方式，在對的時間推給對的人。
如果大家非常地強調技術，甚至于是技巧，怎么樣H5才能紅，H5才能被更多人轉載，才能讓整個技術越發達的話，我要是一開始走這條路的話，我第一個選擇就是W集體打包投入騰訊。
我們不等于H5，我不看好它，因為我覺得技術型的H5，就到年底吧。H5也同樣不等于未來，我不敢說現在H5是不是以前的BB機，但是現在的H5一定是存在技術性缺陷和多動性障礙的，譬如說它加載的程度，像一個最簡單的事情，容量不能超過3兆，還不能超過3秒，不是說技術上達不到，而是這種條件不讓你持久，最好用的工具是可以超越時間的。
不管是H5，還是我們的未來，如果真的能夠讓他有效果的話，只有一個歸宿，我們創造的原則，是可以讓H5進入我們所有人的收藏夾，而不是朋友圈，本著這樣的原則進行創造的時候，可能思維方法的轉變會帶來你所有行為路徑的轉變，進入你朋友的收藏夾，用這個標準去考量自己，這就是我們的理念。
本文系作者授權數英發表，內容為作者獨立觀點，不代表數英立場。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
本文系作者授權數英發表，內容為作者獨立觀點，不代表數英立場。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本內容為作者獨立觀點，不代表數英立場。
本文禁止轉載，侵權必究。
本文禁止轉載，侵權必究。
本文系數英原創，未經允許不得轉載。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
![[下載] H5手機移動項目，3月份截屏下載 ——設計師資源 04](https://file.digitaling.com/eImg/cover/20150603/20150603222245_65981.jpg)
評論
評論
推薦評論
全部評論（5條）