藍(lán)暢首頁(yè) >> 動(dòng)態(tài)
H5開(kāi)發(fā),你該知道的H5玩法和設(shè)計(jì)技巧
時(shí)間:2019-08-06 16:21:18 | 來(lái)源:
運(yùn)營(yíng)目標(biāo)與受眾需求
在設(shè)計(jì)一個(gè)H5之前,首先要明確的是我們的運(yùn)營(yíng)目標(biāo)和受眾需求。運(yùn)營(yíng)目標(biāo)會(huì)依據(jù)最終目的有所不同,針對(duì)的受眾也有可能因?yàn)檫\(yùn)營(yíng)目標(biāo)不同而發(fā)生變化。成功的運(yùn)營(yíng)應(yīng)當(dāng)是通過(guò)滿(mǎn)足受眾的某種需求,最終實(shí)現(xiàn)運(yùn)營(yíng)目的。過(guò)多傾向于用戶(hù),會(huì)導(dǎo)致PV上升而CV低迷;過(guò)多傾向于運(yùn)營(yíng)推廣而忽略受眾需求,會(huì)失去流量最終也達(dá)不到目標(biāo)。
舉一個(gè)反例,曾一度刷爆朋友圈的著名H5《吳亦凡要入伍》,其通過(guò)視頻展示的方式很有創(chuàng)意,吳亦凡的帥氣形象也深得很多粉絲的心。然而這真的是一支成功的H5嗎?如果沒(méi)有特別注意,很容易誤認(rèn)為這個(gè)H5主要是為騰訊新聞做宣傳。因?yàn)槌蓑v訊新聞的標(biāo)題以外,H5的宣傳目標(biāo)“全民突擊”游戲名只出現(xiàn)在了結(jié)束頁(yè)的左上角,以及吳亦凡視頻的口頭描述中。雖然滿(mǎn)足了受眾(粉絲們)欣賞偶像的需求,可是宣傳推廣“全民突擊”的運(yùn)營(yíng)需求卻沒(méi)有真正完成。
怎樣設(shè)計(jì)一個(gè)好的H5?
綜合考慮運(yùn)營(yíng)目標(biāo)和受眾目標(biāo),并結(jié)合之前的數(shù)據(jù),想要設(shè)計(jì)一個(gè)好的H5需要考慮以下三個(gè)方面:
內(nèi)容創(chuàng)意+誘發(fā)傳播+優(yōu)質(zhì)渠道
1- 內(nèi)容創(chuàng)意
創(chuàng)意。還是創(chuàng)意。一個(gè)好的創(chuàng)意可以把運(yùn)營(yíng)需求和受眾痛點(diǎn)很好的結(jié)合在一起,在安慰或激勵(lì)用戶(hù)的同時(shí)推廣了自身活動(dòng)、產(chǎn)品或品牌。
案例:Next Idea x 故宮-騰訊
這個(gè)H5是騰訊創(chuàng)新大賽報(bào)名通知。明朝永樂(lè)皇帝朱棣從故宮的畫(huà)中穿越到現(xiàn)在,戴上太陽(yáng)鏡、唱著rap、跳著騎馬舞、玩自拍、發(fā)朋友圈……想法很有新意,迎合了創(chuàng)新大賽的主題。
2-誘發(fā)傳播
H5內(nèi)容的觸發(fā)點(diǎn),同時(shí)也必須是吸引用戶(hù)的點(diǎn)。在第一時(shí)間引誘用戶(hù)過(guò)來(lái)點(diǎn)擊很重要,否則再好的H5也不會(huì)轉(zhuǎn)化成流量。觸發(fā)點(diǎn)要有誘惑性,提供用戶(hù)不得不點(diǎn)的理由。這個(gè)誘因可以是獎(jiǎng)勵(lì),可以是觸到痛點(diǎn)的文案,可以是美食美色,可以用以下方式:標(biāo)題吸睛——利用人們的好奇心;懸念營(yíng)銷(xiāo)——制造懸念,引人猜想;紅包利誘——“送送送“、“發(fā)發(fā)發(fā)”,受眾從來(lái)不會(huì)拒絕這一套。同時(shí),為了獲得需要的宣傳效果或者品牌影響力,需要選擇合適的傳播機(jī)制。例如集贊或接力方式,一人發(fā)布可以換來(lái)可持續(xù)的病毒式傳播,可以在短時(shí)間內(nèi)造成病毒式影響。
案例:七夕開(kāi)撕 最美新娘打PK,Baby倪妮你會(huì)支持誰(shuí)?
這個(gè)H5是為宣傳電影《新娘大作戰(zhàn)》制作的。作為劇中的主角,Baby與倪妮是敵對(duì)關(guān)系。那么誰(shuí)會(huì)贏得最終的勝利呢?投票權(quán)在用戶(hù)的手里,點(diǎn)擊花球,拋給兩位女神,她們會(huì)爭(zhēng)搶花球,誰(shuí)搶到了花球就為自己的獲勝機(jī)會(huì)增加了一票。想要為自己的女神增加更多花球?那就轉(zhuǎn)發(fā)給朋友們,為心愛(ài)的女神積攢花球吧。
3- 優(yōu)質(zhì)渠道
以上三點(diǎn)確立,需要的就是合適的發(fā)放渠道了。盡你所能利用所有能推廣H5的渠道。目前比較常用的方式:通過(guò)公眾號(hào)的圖文群發(fā)推廣、微信群推廣、線下二維碼推廣,以及前面提到的KOL轉(zhuǎn)發(fā)和投稿等。APP和自身公眾號(hào)的推廣算是比較保守的形式,前提是自身APP有足夠大的用戶(hù)群體或者自身公眾號(hào)有足夠多的活躍受眾。否則的話,KOL營(yíng)銷(xiāo),或者找到熱衷于創(chuàng)造與轉(zhuǎn)發(fā)內(nèi)容的種子用戶(hù),是最有效的方式。
H5交互形式案例
目前就交互形式來(lái)說(shuō),H5在移動(dòng)端的交互形式無(wú)外乎常見(jiàn)的幾種:點(diǎn)擊,滑動(dòng),擦除,長(zhǎng)按等等,還有一些產(chǎn)品本身就是H5制作的,這里略去不談。按照交互輕重程度的區(qū)別,H5推廣可以分為以下三大類(lèi):
1 – 展示型交互
2 – 引導(dǎo)型交互
3 – 游戲型交互
1 – 展示型
對(duì)展示型的定義,就是非常簡(jiǎn)單的,打開(kāi)H5頁(yè)面或者幾個(gè)簡(jiǎn)單的滑動(dòng)或點(diǎn)擊操作就開(kāi)始展示內(nèi)容,對(duì)交互的要求最少,對(duì)內(nèi)容的要求最高。這種H5一般就一小段H5視頻或者動(dòng)畫(huà),要求在開(kāi)始展示的一瞬間就抓住受眾的注意力。
優(yōu)缺點(diǎn)
優(yōu)點(diǎn):易于流暢地呈現(xiàn)一個(gè)完整的品牌故事或品牌形象;技術(shù)難度較低,交互層級(jí)較少。
缺點(diǎn):對(duì)內(nèi)容的要求非常高,而且必須完整觀看完整個(gè)展示才能達(dá)到傳播作用。交互形式簡(jiǎn)單乏味,容易引起受眾流失。
展示型交互的常見(jiàn)的表現(xiàn)形式有以下幾種。
1-1 視頻式
視頻式H5最為簡(jiǎn)單,打開(kāi)H5就開(kāi)始播放視頻,一直到H5結(jié)束。這種H5對(duì)于視頻內(nèi)容的要求極高,能不能達(dá)到運(yùn)營(yíng)目的,就要看視頻給不給力了。
案例:薛之謙史上最瘋狂的廣告-騰訊動(dòng)漫
1-2 幻燈片式
傳統(tǒng)的幻燈片式的播放也屬于展示型交互。通過(guò)觸發(fā)切換不同頁(yè)面內(nèi)容,一頁(yè)一頁(yè)地觀看,利用圖文和音樂(lè)播放來(lái)講故事。比較近的案例如網(wǎng)易云音樂(lè)的2016年度總結(jié),通過(guò)呈現(xiàn)幾組簡(jiǎn)單數(shù)據(jù)來(lái)記錄你與網(wǎng)易云音樂(lè)在2016年的過(guò)往,既煽情也有趣。
應(yīng)用場(chǎng)景——由于制作簡(jiǎn)單,周期短,這種H5展現(xiàn)形式適用于頻繁、小型的需求。用在線編輯器的話,不需要任何開(kāi)發(fā),你只需要要配備一名設(shè)計(jì)和文案。因此,幻燈片式特別適應(yīng)定期發(fā)布或者結(jié)合熱點(diǎn)的營(yíng)銷(xiāo)。
幻燈片式的常見(jiàn)玩法可以羅列如下:
話題法,追蹤熱點(diǎn)事件,發(fā)表三觀極正或者反彈琵琶的觀點(diǎn);
數(shù)據(jù)法,用數(shù)據(jù)說(shuō)故事,比如每年支付寶微信年末都要做的事情;
科普法,介紹有趣有用或者極其重要卻鮮為人知的小知識(shí)(想起來(lái)我們爸媽的朋友圈了嘛???);
溫情法,一個(gè)節(jié)日的問(wèn)候,一個(gè)對(duì)母校的祝福,騙來(lái)了數(shù)以百萬(wàn)計(jì)的轉(zhuǎn)發(fā);
產(chǎn)品介紹法。幾頁(yè)幻燈片切換,介紹一個(gè)美好的新產(chǎn)品。
案例:2017春節(jié)和家人怎么過(guò)?- Airbnb
1-3 空間展示
空間展示指的是講移動(dòng)端屏幕當(dāng)做一個(gè)展示窗口,打開(kāi)后可以通過(guò)簡(jiǎn)單交互(移動(dòng)或觸控)看到很多信息。常見(jiàn)的形式包括全景交互以及一鏡到底。
一鏡到底算是2016年下半年炒熱的一個(gè)概念,但是采用這種形式的并不多,因?yàn)橐话慵虞d的內(nèi)容多,技術(shù)實(shí)現(xiàn)復(fù)雜。但是用得好的話效果酷炫,展示內(nèi)容豐富,造成的傳播力也強(qiáng)大。2016年天貓雙11一鏡到底也屬于這種播放式的H5,只需要一步操作,就可以看到一個(gè)宇宙,讓人贊不絕口。類(lèi)似的,別的廠也做了炫酷的一鏡到底展示。
案例:一鏡到底、一刀未剪的大劇發(fā)布-優(yōu)酷
這是一個(gè)一鏡到底+萬(wàn)花筒得設(shè)計(jì)。進(jìn)入頁(yè)面,動(dòng)畫(huà)自動(dòng)播放,鏡頭從遠(yuǎn)慢慢拉近,以一鏡到底的形式展現(xiàn)youku網(wǎng)站上收錄的電視劇、綜藝等各類(lèi)節(jié)目,按住屏幕不滑動(dòng)時(shí),展現(xiàn)方式會(huì)變成萬(wàn)花筒,松開(kāi)則恢復(fù)。最后一頁(yè)到達(dá)YOUKU會(huì)員推廣頁(yè)面,點(diǎn)擊“拉上伙伴一起酷”分享給小伙伴,也可點(diǎn)擊“加入會(huì)員”跳轉(zhuǎn)到外部鏈接。
這個(gè)H5在整體設(shè)計(jì)上豐富艷麗,配合動(dòng)感的音樂(lè),效果炫酷,震撼人心。
2 – 引導(dǎo)型
其實(shí)引導(dǎo)型和展示型很像,非常注重內(nèi)容。之所以將其分開(kāi),是因?yàn)樵谶@里需要強(qiáng)調(diào)一下H5中互動(dòng)的重要性。畢竟大部分受眾是很難堅(jiān)持靜靜看完一段視頻或者動(dòng)畫(huà)的(要不然優(yōu)酷土豆bilibili的存在就沒(méi)意義了)。H5和視頻相對(duì)不同的是它可以加入互動(dòng)。當(dāng)我們說(shuō)一個(gè)故事的時(shí)候,通過(guò)有一定引導(dǎo)的交互讓受眾和故事有一點(diǎn)點(diǎn)互動(dòng),會(huì)提升受眾的參與感,激勵(lì)受眾繼續(xù)看下去。因此引導(dǎo)式交互更適用于講故事。要強(qiáng)調(diào)的是,在推廣用的H5中,默認(rèn)界面和故事對(duì)用戶(hù)來(lái)說(shuō)都是新的,所以所有的交互都要有一定程度的引導(dǎo),否則會(huì)讓用戶(hù)不小心迷失在界面中。
優(yōu)缺點(diǎn):
優(yōu)點(diǎn):豐富了用戶(hù)與H5之間的交互,讓用戶(hù)在閱讀過(guò)程中始終對(duì)故事保持沉浸感。同時(shí)安插得好的交互觸點(diǎn)可以增強(qiáng)宣傳推廣作用。
缺點(diǎn):用戶(hù)依然是在觀看中被動(dòng)地接受故事,參與感并沒(méi)有實(shí)質(zhì)的提升。
根據(jù)內(nèi)容形式不同,引導(dǎo)式交互的H5可以細(xì)分為以下幾種交互方式:
2-1 互動(dòng)視頻式
缺乏交互的展示型視頻很難長(zhǎng)時(shí)間吸引注意力,如果是有一定互動(dòng)性的視頻就有意思地多了。這種案例需要精心選擇觸發(fā)時(shí)機(jī),配合故事的結(jié)構(gòu),烘托整個(gè)故事的氣氛。
案例:首個(gè)手機(jī)話劇團(tuán)開(kāi)張了 – 天貓
這支H5最近很火,一方面它的話劇部分非常魔性,演員很有表現(xiàn)力,視覺(jué)沖擊感很強(qiáng),另一方面又結(jié)合上恰到好處的交互觸點(diǎn),把控住受眾觀看的節(jié)奏,將“天貓無(wú)憂購(gòu)”這幾個(gè)字牢牢地印在了人的腦海里。
2-2 小場(chǎng)景式
用戶(hù)在幻燈片切換這種沉悶無(wú)聊的交互中堅(jiān)持不了幾頁(yè),所以當(dāng)下的切換往往會(huì)采用小場(chǎng)景方式,每一頁(yè)是一個(gè)場(chǎng)景,在當(dāng)前場(chǎng)景中制造一個(gè)有趣的熱點(diǎn),讓用戶(hù)觸發(fā)熱點(diǎn)切換到下一個(gè)場(chǎng)景;或者有多個(gè)場(chǎng)景可以選擇,每一個(gè)場(chǎng)景會(huì)有一個(gè)互動(dòng)性的小故事。
案例:媽媽再打我一次-京東母親節(jié)
采用回到小時(shí)候挨媽媽打,結(jié)合小游戲的形式,引起回憶,帶來(lái)歡樂(lè)。先選擇媽媽打你的理由,之后,演繹這個(gè)場(chǎng)景,之后隨機(jī)出現(xiàn)四種打擊方法:如來(lái)神掌、打狗棍、無(wú)影腳、召喚術(shù),每種媽媽打你的方式都配著搞笑夸張的動(dòng)畫(huà),打完還問(wèn)舒不舒服,認(rèn)不認(rèn)錯(cuò)~如果認(rèn)錯(cuò)就進(jìn)入主題頁(yè),媽媽老了,再也打不動(dòng)你了,母親節(jié)了,你想媽媽了么?如果不認(rèn)錯(cuò),就挨次體驗(yàn)各種被虐招式吧~
2-3 頁(yè)面探索
設(shè)計(jì)一個(gè)大場(chǎng)景,通過(guò)讓受眾在場(chǎng)景內(nèi)主動(dòng)探索來(lái)達(dá)到運(yùn)營(yíng)目的。在探索過(guò)程中,受眾一邊體驗(yàn)著瀏覽的樂(lè)趣,一邊接受著H5推廣宣傳的故事或概念。在探索的最終,受眾會(huì)被引導(dǎo)到相關(guān)的app或者活動(dòng)頁(yè)。
案例:杜蕾斯美術(shù)館-杜蕾斯
3 – 游戲式交互
游戲型H5相比于展示型和引導(dǎo)型來(lái)說(shuō),最注重交互。設(shè)計(jì)一個(gè)簡(jiǎn)單的小游戲,通過(guò)有趣的游戲交互來(lái)達(dá)到吸引受眾的目的,可以滿(mǎn)足受眾獲得感官刺激、打發(fā)無(wú)聊時(shí)間或者炫耀自己的目的。當(dāng)年神經(jīng)貓之類(lèi)的游戲忽然間風(fēng)靡一時(shí),傳播魔力之大令人乍舌。
然而H5游戲在朋友圈的推廣作用也有限,一方面H5游戲因?yàn)椴僮骱?jiǎn)單、競(jìng)技性強(qiáng),一度風(fēng)靡朋友圈,但創(chuàng)意缺乏和同質(zhì)化現(xiàn)象導(dǎo)致用戶(hù)對(duì)無(wú)腦小游戲逐漸產(chǎn)生了厭倦。另一方面受制于《微信外部鏈接內(nèi)容相關(guān)管理規(guī)范》[3]對(duì)H5游戲的限制,微信中傳播的小游戲只能是純游戲,不能含有誘導(dǎo)式的宣傳推廣內(nèi)容,否則活不過(guò)半天。
不過(guò)好的創(chuàng)意依然不缺乏受眾,一款設(shè)計(jì)良好的小游戲也可以間接的將自己的品牌價(jià)值或是活動(dòng)目標(biāo)推廣給廣大受眾。在這里列舉一些常見(jiàn)的類(lèi)型。
3-1 圖片合成
案例:我的小學(xué)生照片 – 天天P圖
想要炫耀自我嗎?想要體驗(yàn)新奇嗎?給你機(jī)會(huì)。通過(guò)一鍵生成圖片,讓你秒變小學(xué)生。
3-2 做測(cè)試
一般是比較簡(jiǎn)單的幾步問(wèn)答選擇,就給出一個(gè)有意思的測(cè)試結(jié)果。硬廣營(yíng)銷(xiāo)的測(cè)試已經(jīng)基本被封殺了,目前更多的是一些帶有預(yù)測(cè)、惡搞、科普或者祝福意義的測(cè)試,然后博取關(guān)注公眾號(hào)或下載APP。
案例:沒(méi)想到你是這樣的安全帶 – 滴滴出行
你知道多少關(guān)于安全帶的知識(shí)呢?“汽車(chē)安全帶雛形是哪個(gè)國(guó)家呢?”“最先使用三點(diǎn)式安全帶是哪個(gè)汽車(chē)廠商?”“安全帶的克星是什么”“乘坐出租車(chē)不系安全帶可能發(fā)生什么”“安全帶的織帶主要組成成分是什么?”這些問(wèn)題你知道么?通過(guò)一系列測(cè)試,案例最終將滴滴的安全出行理念傳輸給受眾。
3-3 抽簽
2017年,獵魚(yú)達(dá)人給你一個(gè)嘚瑟的理由 – 騰訊游戲
騰訊獵魚(yú)達(dá)人游戲節(jié)日推,通過(guò)搖一搖抽福簽的形式展開(kāi),隨后對(duì)抽到的福簽進(jìn)行解簽,可以進(jìn)行多次搖取,最后可以跳轉(zhuǎn)app store進(jìn)行游戲下載贏取紅包,還可進(jìn)行分享。
3-4 原創(chuàng)/移植小游戲
案例:2017年雞雞向上- Sigma
加載進(jìn)入后,進(jìn)入首頁(yè)介紹主題“雞雞向上”,隨后介紹游戲的玩法進(jìn)入游戲,點(diǎn)擊屏幕可以使小雞跳動(dòng)起來(lái),左右晃動(dòng)手機(jī)可以控制小雞的墜落方向,除了燈籠外里面還有各種小道具,跳到小道具上可以使小雞變身哦。想要不停向上,那么就來(lái)挑戰(zhàn)吧。
當(dāng)下H5游戲也有了很多新玩法,例如雙屏互動(dòng)、地理定位、聲音識(shí)別、面部識(shí)別,就不一一詳細(xì)列舉了。。
以上就是2017年關(guān)于H5的一些基礎(chǔ)知識(shí)。掛一漏萬(wàn)說(shuō)了很多,總的來(lái)說(shuō)一款H5產(chǎn)品是需要仔細(xì)打磨的,但大部分失敗的制作者期望高、投入少、時(shí)間急還不動(dòng)腦,想靠一款粗糙的H5產(chǎn)品來(lái)引爆朋友圈。這種思維在當(dāng)下H5產(chǎn)品競(jìng)爭(zhēng)中毫無(wú)可取之處,唯有真正從產(chǎn)品與用戶(hù)兩個(gè)角度出發(fā)才能盡量避免產(chǎn)品的失敗。
http://www.woshipm.com/pd/600972.html
上海藍(lán)暢信息技術(shù)有限公司成功為多家世界財(cái)富500強(qiáng)企業(yè)以及其他著名品牌提供優(yōu)質(zhì)服務(wù),是您靠譜的互聯(lián)網(wǎng)開(kāi)發(fā)供應(yīng)商。
服務(wù)客戶(hù)遍及北京、上海、杭州、深圳、廣州、天津、青島、南京、寧波、蘇州、無(wú)錫、廈門(mén)、重慶、西安等大中型城市及地區(qū) 主要業(yè)務(wù):H5開(kāi)發(fā),H5外包,微信開(kāi)發(fā)外包,網(wǎng)站開(kāi)發(fā)外包,H5游戲開(kāi)發(fā),小程序開(kāi)發(fā)外包,APP開(kāi)發(fā)外包,視頻后期制作等
2022年雙11銷(xiāo)售額數(shù)據(jù):全網(wǎng)交易額為5571億元
2020年天貓雙11銷(xiāo)售額,11.11成交額4982億
微信開(kāi)發(fā)解決方案:醫(yī)藥原料貿(mào)易中的加密訂單系統(tǒng)如何保護(hù)客戶(hù)采購(gòu)隱私
微信小程序如何重塑會(huì)展活動(dòng)管理?展商名錄與觀眾預(yù)約的智慧化解決方案
微信開(kāi)發(fā)公司:微信積分系統(tǒng)如何助力企業(yè)實(shí)現(xiàn)綠色采購(gòu)轉(zhuǎn)型?
微信開(kāi)發(fā)公司:食品添加劑企業(yè)如何借力企業(yè)微信社群打造行業(yè)認(rèn)證影響力?
企業(yè)微信對(duì)接庫(kù)存系統(tǒng):汽配經(jīng)銷(xiāo)商的區(qū)域代理管理智能化升級(jí)介紹
微信開(kāi)發(fā)賦能飼料原料批發(fā),自動(dòng)化報(bào)價(jià)系統(tǒng)如何破解大宗交易定價(jià)難題?