一文讀懂H5:值得收藏的干貨合集

1 評(píng)論 26134 瀏覽 71 收藏 17 分鐘

編輯導(dǎo)讀:H5作為營(yíng)銷(xiāo)運(yùn)營(yíng)的重要手段,好的創(chuàng)意很容易讓其在朋友圈刷屏,引起廣泛傳播。盡管很多人都在談?wù)揌5,但是有些人甚至連H5的定義都不清楚,更別說(shuō)它的使用場(chǎng)景和玩法了。本文將從運(yùn)營(yíng)的角度,圍繞H5進(jìn)行九個(gè)角度的分析,希望對(duì)你有幫助。

一、什么是H5?

程序猿:H5,是HTML5的簡(jiǎn)稱(chēng),不是一項(xiàng)技術(shù),而是一個(gè)標(biāo)準(zhǔn)

大家口中的H5只是借助H5標(biāo)準(zhǔn)制作的網(wǎng)頁(yè),是對(duì)技術(shù)的狹義解釋?zhuān)麓尾灰賳?wèn)我“這個(gè)H5能不能做了”,這是對(duì)俺專(zhuān)業(yè)的不負(fù)責(zé),直接問(wèn)我“這個(gè)手機(jī)端PPT能不能做”?

運(yùn)營(yíng)喵:H5,是可交互的移動(dòng)端網(wǎng)頁(yè),便于營(yíng)銷(xiāo)推廣分享傳播

無(wú)論是淘寶的“年度賬單”還是網(wǎng)易的“飼養(yǎng)手冊(cè)”,或者是朋友圈經(jīng)??吹降牧炎兓顒?dòng)/邀請(qǐng)函/報(bào)名表單/電子相冊(cè)/每日打卡/微商城等,都可以算作運(yùn)營(yíng)人眼中的H5。

和甲方爸爸或客戶解釋技術(shù)原理可能比較復(fù)雜,因?yàn)榇蟛糠秩硕际峭ㄟ^(guò)別人家的“H5案例”進(jìn)行了解的,即使把這些活動(dòng)統(tǒng)稱(chēng)為“H5”比較狹義,但是卻是最接地氣的叫法,只是在和技術(shù)大大溝通時(shí)需要詳細(xì)描述需求類(lèi)型,不要含糊的描述為“別人家的H5”。

設(shè)計(jì)獅:H5,是平面視覺(jué)、廣告創(chuàng)意設(shè)計(jì)的分支,需要大量原創(chuàng)設(shè)計(jì)

對(duì)比普通的平面或UI設(shè)計(jì),H5的制作需要更多的原創(chuàng)設(shè)計(jì)。將策劃創(chuàng)意在這一步進(jìn)行視覺(jué)實(shí)現(xiàn),需要在溝通時(shí)對(duì)尺寸、風(fēng)格、配色、交互邏輯進(jìn)行梳理確認(rèn),最終的效果呈現(xiàn)會(huì)和這一關(guān)鍵步驟緊密相關(guān)。

二、H5常見(jiàn)使用場(chǎng)景

在圖文時(shí)代,可交互的H5算是線上營(yíng)銷(xiāo)的“奢侈品”,既酷炫又新穎的活動(dòng)展現(xiàn)方式能夠讓用戶眼前一亮,但隨著“品效合一”的口號(hào),著重品宣效果的展示類(lèi)H5慢慢被冷落了。

除了看重品宣效果又多金的頭部團(tuán)隊(duì)還在堅(jiān)持,中小商家的注意力逐漸放在了轉(zhuǎn)化效果更好的投票/抽獎(jiǎng)/拼團(tuán)/砍價(jià)/分銷(xiāo)/秒殺等營(yíng)銷(xiāo)類(lèi)H5。

一句化總結(jié):行業(yè)頭部團(tuán)隊(duì)借助H5話題營(yíng)銷(xiāo)仍在不斷打造刷屏爆款,中小商家作為業(yè)務(wù)宣傳載體進(jìn)行推廣和轉(zhuǎn)化,正在從展示類(lèi)H5過(guò)度到營(yíng)銷(xiāo)類(lèi)H5。

三、適用的行業(yè)類(lèi)型

除了匯總過(guò)往的數(shù)據(jù)報(bào)告,我還對(duì)比了H5模板網(wǎng)站的熱門(mén)素材和行業(yè)分類(lèi)規(guī)律,篩選出了下面這些對(duì)H5有高頻需求的行業(yè):

新媒體、電商微商、保險(xiǎn)金融、教育培訓(xùn)、婚禮婚慶、地產(chǎn)中介、廣告?zhèn)髅健⑸願(yuàn)蕵?lè)等行業(yè),這些行業(yè)都有一個(gè)共通點(diǎn),那就是有大量的信息需要借助可視化的載體通過(guò)社交媒體傳遞給用戶。

這些行業(yè)其實(shí)也是TOB營(yíng)銷(xiāo)工具的金主爸爸,大部分團(tuán)隊(duì)缺少設(shè)計(jì)和技術(shù)開(kāi)發(fā)資源,但日常工作中又有很大的營(yíng)銷(xiāo)需求,無(wú)論是圖片還是H5活動(dòng)制作,很多模板化的營(yíng)銷(xiāo)工具剛好能夠解決痛點(diǎn),給了懶人成為營(yíng)銷(xiāo)多面手的機(jī)會(huì)。

四、常見(jiàn)的玩法分類(lèi)

根據(jù)常見(jiàn)的H5玩法,我瀏覽了大概上百個(gè)案例,覺(jué)得可以大概分為以下幾類(lèi):個(gè)性測(cè)試/總結(jié)盤(pán)點(diǎn)/定制DIY/互動(dòng)游戲/答題競(jìng)賽/趣味惡搞/營(yíng)銷(xiāo)推廣/限時(shí)福利。

接下來(lái)我會(huì)按照上面的分類(lèi)列舉一些爆款案例:

1. 個(gè)性測(cè)試

案例《網(wǎng)易噠噠-飼養(yǎng)手冊(cè)》

2. 總結(jié)盤(pán)點(diǎn)

案例《支付寶-年度賬單》

3. 定制DIY

案例《騰訊新聞-迎國(guó)慶換新顏》

4. 互動(dòng)游戲

案例《騰訊醫(yī)學(xué)ME大會(huì)-手速挑戰(zhàn),拯救人類(lèi)你有多快?》

5. 答題競(jìng)賽

案例《新華社-民法典大沖關(guān)》

6. 趣味惡搞

案例《跳跳糖創(chuàng)意-我的地?cái)偽易鲋鳌?/p>

7. 營(yíng)銷(xiāo)推廣

案例《騰訊-全球數(shù)字生態(tài)大會(huì)》

8. 限時(shí)福利

案例《京東-年終福利》

五、常用的交互方式

H5交互方式匯總:滑動(dòng)、單擊、連擊、長(zhǎng)按、拖拽、縮放、聲音、書(shū)寫(xiě)、重力、3D、全景等,這個(gè)知識(shí)點(diǎn)來(lái)自網(wǎng)易噠噠團(tuán)隊(duì)的干貨文章哦!

我發(fā)現(xiàn)大部分案例都是通過(guò)滑動(dòng)和單擊這類(lèi)簡(jiǎn)單交互來(lái)完成的,疊加更多的交互方式意味著開(kāi)發(fā)設(shè)計(jì)難度和用戶學(xué)習(xí)成本同步增加。

新穎的交互方式可能會(huì)讓用戶眼前一亮,但如果沒(méi)有和創(chuàng)意很好的結(jié)合,同時(shí)又增加了開(kāi)發(fā)周期和用戶使用難度,那就得不償失了。

復(fù)雜交互≠優(yōu)質(zhì)H5,在策劃階段討論創(chuàng)意實(shí)現(xiàn)方式時(shí),我們需要結(jié)合團(tuán)隊(duì)實(shí)際情況來(lái)確定方案,畢竟運(yùn)營(yíng)的腦暴靈感+設(shè)計(jì)創(chuàng)意+技術(shù)開(kāi)發(fā)才能完成一個(gè)完整的H5。(如果團(tuán)隊(duì)只有你自己一個(gè)人,那就跳過(guò)這個(gè)步驟吧,請(qǐng)看下段文字中提到的速成方案)

對(duì)了,記得每一個(gè)交互都要增加步驟引導(dǎo),即使是滑動(dòng)這類(lèi)簡(jiǎn)單的操作也要進(jìn)行提示,因?yàn)榇蟛糠钟脩粼诨顒?dòng)中找不到下一步如何操作時(shí)會(huì)直接關(guān)閉頁(yè)面。

流暢的交互體驗(yàn)?zāi)軌驕p少過(guò)程中的流失率,畢竟我們不是在做解密游戲,給每一個(gè)交互步驟增加引導(dǎo)或使用提示非常有必要。

六、制作方式和流程

H5活動(dòng)主流制作方式有三種,分別是借助模板/對(duì)接外包/獨(dú)立制作,每種方式的預(yù)算成本以及優(yōu)劣勢(shì)我?guī)痛蠹疫M(jìn)行了簡(jiǎn)單分析,下次做方案時(shí)可以直接用到:

1. 借助模板

  • 成本預(yù)算:低
  • 創(chuàng)意指數(shù):低
  • 耗費(fèi)時(shí)間:短

借助第三方工具模板市場(chǎng)快速獨(dú)立完成制作,但是模板化的H5可供修改的內(nèi)容有限,主要的創(chuàng)意和交互方式都無(wú)法修改,只能對(duì)文字和圖片等素材進(jìn)行調(diào)整。

適合中小微商家或團(tuán)隊(duì),以及對(duì)H5營(yíng)銷(xiāo)不熟悉的團(tuán)隊(duì),試錯(cuò)成本低。

2. 對(duì)接外包

  • 成本預(yù)算:高
  • 創(chuàng)意指數(shù):中
  • 耗費(fèi)時(shí)間:中

使用鈔能力尋找第三方專(zhuān)業(yè)團(tuán)隊(duì)完成制作,你只需要提供靈感,哦不,或者你只需要講清楚“五彩斑斕的黑”這樣的需求即可,誰(shuí)讓我們是甲方爸爸呢(滑稽)。

專(zhuān)業(yè)第三方團(tuán)隊(duì)可以從創(chuàng)意策劃到上線推廣提供一條龍全案服務(wù),但是需要充足的預(yù)算支持,行業(yè)頭部公司一般會(huì)選擇這種方式和第三方團(tuán)隊(duì)進(jìn)行合作,雖然大家都懂“如何打造爆款”,但是真正實(shí)操時(shí),專(zhuān)業(yè)領(lǐng)域的第三方團(tuán)隊(duì)距離成功爆款會(huì)更近一些。

普通外包團(tuán)隊(duì)只負(fù)責(zé)設(shè)計(jì)和技術(shù)開(kāi)發(fā)部分,需要在合作前確定具體的創(chuàng)意需求和實(shí)現(xiàn)方式,作為甲方的我們需要完成前期策劃-進(jìn)度跟進(jìn)-成品驗(yàn)收。為了防止踩坑,在合作前要對(duì)第三方團(tuán)隊(duì)進(jìn)行能力評(píng)估,過(guò)程中來(lái)回扯皮延誤進(jìn)度或成品千差萬(wàn)別是最糟糕的。

3. 獨(dú)立制作

  • 成本預(yù)算:中
  • 創(chuàng)意指數(shù):高
  • 耗費(fèi)時(shí)間:長(zhǎng)

由自己團(tuán)隊(duì)獨(dú)立開(kāi)發(fā)制作的成本也比較高,通常一個(gè)H5活動(dòng)的制作周期大概為2-4周,同時(shí)需要運(yùn)營(yíng)+設(shè)計(jì)+技術(shù)等團(tuán)隊(duì)資源進(jìn)行支持,需要占用比較多的團(tuán)隊(duì)資源。

更重要的是,大部分團(tuán)隊(duì)沒(méi)有這類(lèi)開(kāi)發(fā)經(jīng)驗(yàn),甚至完整的協(xié)作流程,成熟團(tuán)隊(duì)在衡量原創(chuàng)H5的投入產(chǎn)出時(shí),一般會(huì)否決這類(lèi)品宣大于效果的創(chuàng)意策劃。

所以作為運(yùn)營(yíng)的我們,在項(xiàng)目啟動(dòng)時(shí)就需要思考清楚,這個(gè)方案目前是不是最優(yōu)選擇,如果是初次接觸H5活動(dòng)策劃,還是選擇第一種低成本的實(shí)現(xiàn)方式最優(yōu)。

七、用戶分享的動(dòng)機(jī)

用戶分享是裂變傳播的關(guān)鍵,分享率決定活動(dòng)的流量回流率和傳播層級(jí),想要擴(kuò)大影響范圍,我們需要先清楚用戶的分享動(dòng)機(jī),以及如何觸動(dòng)更多用戶進(jìn)行分享。

用戶的分享動(dòng)機(jī):打造人設(shè)、懷舊回憶、情感共鳴、利益誘導(dǎo)、幫助別人、輸出觀點(diǎn)、熱點(diǎn)討論、知識(shí)學(xué)習(xí)。

上面這段可能有點(diǎn)難理解,我一般會(huì)把這種理論內(nèi)容簡(jiǎn)單化,那就是自己代入目標(biāo)用戶角色根據(jù)策劃方案寫(xiě)出不愿意分享的原因幫助優(yōu)化方案,同時(shí)寫(xiě)出自己認(rèn)為活動(dòng)吸引自己參與和分享的主要?jiǎng)恿?,如果?xiě)不出或者自己參與都不可能分享,那就推翻重來(lái)。

自己或團(tuán)隊(duì)腦暴出的方案靈感覺(jué)得沒(méi)問(wèn)題后,還可以找目標(biāo)用戶聊一下,如果這樣的活動(dòng)發(fā)布出來(lái),他會(huì)不會(huì)參與,會(huì)不會(huì)分享,以及最近有沒(méi)有看到同類(lèi)型的案例。同樣流程,把用戶溝通放在方案確定前期就是用戶調(diào)研環(huán)節(jié)了,也是幫助我們做決策的方法。

除了理論上滿足用戶的分享動(dòng)機(jī),我們還需要清楚影響用戶不愿意分享的因素有哪些?是否會(huì)涉及用戶敏感隱私,是否會(huì)影響用戶在朋友圈的人設(shè)等原因??傊?,在項(xiàng)目前期明白用戶為什么分享,以及不分享的可能原因能讓我們?cè)趫?zhí)行和推廣時(shí)少踩坑。

八、爆款不容易復(fù)制

1. 創(chuàng)意難尋

能夠和用戶產(chǎn)生情感共鳴的案例才能達(dá)到全民刷屏效果,核心的靈感創(chuàng)意才是這個(gè)領(lǐng)域的護(hù)城河,即使掌握了打造爆款的全部方法論,也很難通過(guò)復(fù)制模仿達(dá)到同樣的效果。

2. 成本較高

上面和大家分享了H5制作的幾種方式,其中套用模板的方式成本雖然很低,但是幾乎不會(huì)有產(chǎn)生爆款的可能,尋找第三方團(tuán)隊(duì)或獨(dú)立制作的成本高昂,方案可能會(huì)在討論或者需求評(píng)審階段被放棄。

3. 封禁風(fēng)險(xiǎn)

為了增加傳播速度和引流轉(zhuǎn)化,可以在活動(dòng)中增加獎(jiǎng)勵(lì)誘導(dǎo),公眾號(hào)或小程序和H5結(jié)合,可以通過(guò)紅包或者任務(wù)類(lèi)實(shí)物獎(jiǎng)勵(lì)激勵(lì)用戶進(jìn)行分享傳播,但是被舉報(bào)后很容易會(huì)被微信爸爸封禁,建議對(duì)微信規(guī)則不熟悉的朋友盡量不要試探處罰邊緣。

即使不進(jìn)行利益誘導(dǎo),只在海報(bào)上添加活動(dòng)入口二維碼,也不能保證百分之百安全,根據(jù)微信的風(fēng)控閾值,達(dá)到定量的分享傳播后,活動(dòng)同樣會(huì)被限制。例如朋友圈海報(bào)被屏蔽,其他好友無(wú)法看到—禁止鏈接分享—活動(dòng)域名封禁。

九、放心大膽去做吧

希望這些資料可以在大家進(jìn)行項(xiàng)目決策或?qū)懖邉澐桨笗r(shí)提供幫助,最后討論的“爆款不容易復(fù)制”,不是為了“勸退”大家,只是團(tuán)隊(duì)目標(biāo)如果是以轉(zhuǎn)化或是大范圍刷屏的話,開(kāi)發(fā)成本高/籌備周期長(zhǎng)且效果不可控的H5活動(dòng)不建議大家去做,畢竟還有很多更優(yōu)的方案可供選擇。

最后再跟大家分享一個(gè)我自己的案例,下面這個(gè)《測(cè)測(cè)你的單身理由H5》是兩年前我和團(tuán)隊(duì)小伙伴完成的測(cè)試H5,當(dāng)時(shí)為了蹭七夕的熱點(diǎn),從策劃到上線只用了一周的時(shí)間,我一個(gè)人負(fù)責(zé)運(yùn)營(yíng)策劃兼設(shè)計(jì),還要從各處搜集手繪素材,過(guò)程很費(fèi)勁,不過(guò)成果還很滿意的,算是一個(gè)小范圍傳播的案例,下次有機(jī)會(huì)和大家詳細(xì)拆解一下。

關(guān)于H5相關(guān)的問(wèn)題就到這里了,希望大家都能夠早日打造出自己的刷屏爆款!

 

本文由 @阿趙 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載

題圖來(lái)自 Unsplash,基于 CC0 協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 好!

    來(lái)自浙江 回復(fù)