H5能做什么，有哪些玩法？接下來我將列舉一些典型的例子和大家探討：
1、幻燈片式玩法
以下這個特斯拉的例子相信很多人都看過，精美的圖片設(shè)計+簡單的翻頁效果，在我的印象中大概3、4月份看到特斯拉這個H5的時候，大家還不知道原來微信營銷可以這么玩，記得那時候我們看到之后就在一周內(nèi)做了一個類似的H5，用于STC的品牌展示。當(dāng)然，在這之后H5就千樹萬樹梨花開了。
這是H5最早期也是最典型的玩法，因為簡單、實用，所以至今還很流行。其效果就是簡單的圖片展示&翻頁交互，最終整體的表現(xiàn)很像幻燈片展示。
其實幻燈片式的H5現(xiàn)在已經(jīng)出現(xiàn)了很多在線制作軟件供大家使用，所以制作成本在現(xiàn)在看來幾乎是等于零的，而在之前這樣一個應(yīng)用的開發(fā)可能要將近一萬（再一次見證了互聯(lián)網(wǎng)思維的破壞力）。當(dāng)然啦，這對于品牌主來說是一個好事，因為很多時候這種簡單的展示已經(jīng)能滿足需求了，不需要花不必要的錢。
★ 應(yīng)用場景
由于制作簡單，周期短，這種H5展現(xiàn)形式適用于頻繁、小型的需求。用在線編輯器的話，不需要任何開發(fā)，你只需要要配備一名設(shè)計和文案。
總結(jié)得不全，幻燈片式H5可能有以下的應(yīng)用場景：
1、定期發(fā)布的內(nèi)容，幾乎零預(yù)算。這些內(nèi)容相對而言比較常規(guī)，但是有時微信圖文又無法達(dá)到理想的效果，通過H5的形式會更易于傳播，當(dāng)然前提是要有好的設(shè)計。比如數(shù)據(jù)報告、頻繁上線的新產(chǎn)品或功能、小型線下活動邀請、活動相冊等等。
2、結(jié)合熱點(diǎn)的營銷，周期極短。這種情況下，時效性是非常重要的，如果開發(fā)一個H5用了半個月，熱點(diǎn)想必也結(jié)冰了。所以，應(yīng)該以最快的速度推出才是明智的選擇，而這時候引起廣泛傳播的關(guān)鍵就在于文案和設(shè)計。
此外，大家不要輕視這種短頻快的傳播，有時候它要比很多大投入的傳播來得有效。沒有人能完全掌握受眾的興趣點(diǎn)，所以一次大投入的傳播不一定就能出效果，但是多次熱點(diǎn)傳播出效果的概率從統(tǒng)計學(xué)的角度也要高一些。如上文所述，我們可以實現(xiàn)用戶在H5中所有交互行為的監(jiān)測，因此，如果短頻快的傳播能配合有效的數(shù)據(jù)監(jiān)測，便可以進(jìn)行持續(xù)優(yōu)化，降低不確定性。
2、交互式動畫
可口可樂這個案例在之前的風(fēng)云榜中推薦過，是運(yùn)用H5繪圖功能的典型例子。當(dāng)然這里面的交互還是比較簡單的，只不過它基本體現(xiàn)了交互式動畫的感覺。整個可口可樂的時間軸是隨著用戶向上滑動頁面「繪制」出來的。
其實除了這種敘事型的H5動畫，我們能看到的大多數(shù)H5游戲也都都屬于這一類，比如神經(jīng)貓、打企鵝、2048等等。最近也有一個比較火的H5游戲叫「財務(wù)包子鋪」，在這個游戲中用戶扮演包子鋪的創(chuàng)業(yè)老板，在事業(yè)發(fā)展的不同階段做出經(jīng)營決策，最終登上人生巔峰。雖然游戲中植入了*裸的產(chǎn)品推廣（知乎的一本新書），但最后還是取得了3天破300萬PV的成績。
這些類型各異的H5應(yīng)用，本質(zhì)上都是基于H5的動畫技術(shù)做的。它們所涉及的相關(guān)動畫技術(shù)主要有H5的Canvas/SVG，以及JS、CSS3，目前大部分H5的動畫效果還是用JS實現(xiàn)的，實現(xiàn)的效果類似PPT中的動畫功能，只能實現(xiàn)元素的平移、旋轉(zhuǎn)、隱現(xiàn)等等。事實上通過JS+Canvas/SVG+CSS3可以實現(xiàn)非常復(fù)雜的交互式動畫，最直觀的就是H5游戲，比如神經(jīng)貓，還有上文提到的3D版坦克大戰(zhàn)。
那么，H5到底能實現(xiàn)什么樣的動畫效果呢？我想這應(yīng)該是大家在做H5時最頭疼的問題，因為不知道能做成什么樣，你也就不知道從何下手。所以下面我給大家介紹一個網(wǎng)站：http://fff.cmiscm.com/，在這個網(wǎng)站中，你幾乎能看到所有H5能夠?qū)崿F(xiàn)的動畫效果，下次如果需要做H5的時候就可以跟開發(fā)說「你看，就是這個效果」。
以下是該網(wǎng)站上幾個示例的截圖：
抓綿羊：你可以在奔跑的羊群中隨意抓取并放到任意位置。
種樹：在屏幕任意地方點(diǎn)擊都會在相應(yīng)的地方種一顆樹，你可以看到樹的生長過程。
3D罐頭：CSS3 3D的完美展示，你可以看到三維罐頭的任意角度。
照片處理：你可以把照片藝術(shù)化，圖示為處理過程截圖。
★ 應(yīng)用場景
交互式動畫類型的H5制作周期和成本比較高，需要提前規(guī)劃。除了創(chuàng)意、文案、設(shè)計這些以外，開發(fā)周期較長，優(yōu)質(zhì)的H5大約在兩周到4周左右，也有可能更長。
這種類型的H5要找靠譜的供應(yīng)商，因為復(fù)雜交互做出來的效果，在用戶看來只有完美和垃圾兩種層次，所以慎重。當(dāng)然如果你自己要花血本自建團(tuán)隊也不是不行——產(chǎn)品經(jīng)理、設(shè)計師、前端工程師、PHP工程師（涉及表單、登錄、評論等元素的時候需要），各一枚就夠了。
以下是總結(jié)的應(yīng)用場景：
1、中小型活動/品牌事件的傳播，預(yù)算不多、周期較短。這種情況一般就是某些新品發(fā)布、企業(yè)招聘、公關(guān)事件、中型會議等的傳播。此時你需要權(quán)衡周期和成本的因素。
一般來說一周以內(nèi)的時間不太可能做出優(yōu)質(zhì)的H5，這時候你可能要考慮幻燈片式的簡易開發(fā)或者參考已有的作品，然后著重從設(shè)計和文案上下功夫。如果有一到兩周的時間可以嘗試做一些輕交互的H5，除了常見的那些平移、縮放、淡入淡出的動效以外，在這里我比較建議大家嘗試一下CSS3 3D的效果，這是一個趨勢，當(dāng)然成本也會相應(yīng)的上升一個量級。
2、大型活動/品牌事件的傳播，預(yù)算充足、計劃性強(qiáng)、周期較長。一般大家看到的那些美輪美奐并且極具傳播性的H5基本上都屬于這一類，比如上文提到的可口可樂「分享快樂128年」，以及我們之前分享過的潘婷「一封來自1947年的明信片」。像這一類在美學(xué)、交互和故事性上都表現(xiàn)突出的案例，都不是一兩周的功夫能做出來的，不計算創(chuàng)意、設(shè)計和文案的時間，光是開發(fā)和調(diào)試也要小一個月。
因此大家看到好的作品要理性看待，不能覺得很?；蛘呃习逭f好就想著也做一個，其實像這種交互與故事一體的應(yīng)用，如果時間不夠只完成一半，整個H5基本是沒法用的，也就是所有之前的投入都是無用功。這也是為什么有很多供應(yīng)商無法在指定時間交付的原因，可能一開始就在做一個完不成的任務(wù)。
3、功能型H5
看一下以下的兩個例子，第一個是百度針對地鐵漲價做的H5，它可以計算你每天坐地鐵要多少錢并且實時顯示大家的評論；第二個是STC的社交移動風(fēng)云榜，很簡單，就是精品H5的展示：
這兩個H5都有一個特點(diǎn)，除了針對受眾的熱點(diǎn)內(nèi)容傳播以外，它們很像一個「供用戶重復(fù)使用」的產(chǎn)品，這就是所謂的功能型H5。其實大家看到風(fēng)云榜可能會覺得它只是一個再簡單不過的網(wǎng)頁，但如果從它滿足用戶需求并產(chǎn)生重復(fù)「使用」行為的角度，它其實是一個產(chǎn)品，事實上我們從一開始就是把它當(dāng)產(chǎn)品來運(yùn)營的，關(guān)注Social Talent的朋友可能會有所感受——每周更新、定期群發(fā)推薦H5的圖文、欄目更新通知等等。
功能型H5的獨(dú)特價值在于，除了具備傳播性以外，它通過用戶的重復(fù)使用行為使得H5的傳播是一個持續(xù)不斷的過程，這一點(diǎn)是一般的H5所不具備的。風(fēng)云榜首次發(fā)布時轉(zhuǎn)發(fā)6w+ 多，目前每月的訪問量都在10w左右，不算多，但是給我們帶來的流量轉(zhuǎn)化都是精準(zhǔn)的，關(guān)注我們的大多還是從事營銷相關(guān)職業(yè)的朋友。
個人覺得web應(yīng)用肯定是未來發(fā)展的方向，就像上文所說的，很有可能未來的操作系統(tǒng)將被瀏覽器所取代，服務(wù)和應(yīng)用將進(jìn)入完全的云世界。當(dāng)然距離這種假設(shè)還比較遠(yuǎn)，但唯一大家可以放心遵守的原則，就是聚焦于用戶需求。
我所說的功能型H5，是同時聚焦于用戶需求并且注重傳播性的H5輕應(yīng)用，也就是在設(shè)計H5的時候除了考慮傳播的問題以外，也要思考如何把它變成一個持續(xù)運(yùn)營的產(chǎn)品。這里面其實是思考角度的問題，從「我要傳播什么」到「我希望用戶傳播什么」的轉(zhuǎn)變。
★ 應(yīng)用場景
輕交互重功能的功能型H5制作周期較短、成本也不高，成功的關(guān)鍵不在于酷炫的交互，而在于用戶需求的把握以及后續(xù)的運(yùn)營。
因此，這一類H5需要的是一名高水平的的產(chǎn)品經(jīng)理，而以設(shè)計、開發(fā)為輔。功能型H5目前沒有太多成熟的例子，不過我認(rèn)為離線存儲的技術(shù)可能會是功能型H5的應(yīng)用重點(diǎn)，大家可以關(guān)注一下。
以下是總結(jié)的應(yīng)用場景：
1、品牌賬號的粉絲運(yùn)營。功能型H5由于具備一定的產(chǎn)品特性，其最大的價值就是提高粉絲活躍度和忠誠度。我們需要根據(jù)本身品牌的形象定位以及受眾的特性設(shè)計功能型H5，要將品牌或產(chǎn)品的功能性特征抽象到生活方式或者精神追求的層次。
舉個例子，賣洗手液的可以抽象為健康生活方式，設(shè)計一個改善生活健康狀態(tài)的功能型H5；服裝品牌可以抽象為追求時尚前沿，設(shè)計一個定期更新時尚潮流資訊的功能型H5。事實上，以粉絲需求為中心的功能型H5將潛移默化的提升品牌影響力，在提升忠誠度的同時帶來持續(xù)的口碑傳播。
2、結(jié)合熱點(diǎn)內(nèi)容的品牌傳播。這種類型的傳播是最常見的，但是往往很多結(jié)合熱點(diǎn)的H5傳播都是一次性娛樂消費(fèi)，大家看過就忘了。其實如果能從用戶需求挖掘和產(chǎn)品運(yùn)營的角度去思考，許多針對熱點(diǎn)的H5傳播都有很大提升的空間。
想更多的了解 h5頁面推廣的相關(guān)信息，可以掃碼了解我們：
申請創(chuàng)業(yè)報道，分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處，共同探討創(chuàng)業(yè)新機(jī)遇！
