很可惜 T 。T 您現(xiàn)在還不是作者身份，不能自主發(fā)稿哦～
如有投稿需求，請把文章發(fā)送到郵箱tougao@appcpx.com，一經(jīng)錄用會有專人和您聯(lián)系
咨詢?nèi)绾纬蔀榇河鹱髡哒埪?lián)系：鳥哥筆記小羽毛（ngbjxym）
PC 時代，設(shè)計師們就基于 H5 開發(fā)了眾多交互性能強大的酷站，進入移動時代，交互設(shè)計師們更是如魚得水，結(jié)合移動端的重力感應(yīng)、豎屏顯示、手勢交互等全新玩法，開創(chuàng)了全新的交互時代。
fff.cmiscm.com 網(wǎng)站收錄了 15 個基于 H5 創(chuàng)建的極具創(chuàng)意的網(wǎng)站
所以說， 朋友圈 H5 進化史可以看做是新媒體交互設(shè)計進化史。
2014 年開始，朋友圈開始出現(xiàn)一些簡單圖文形式的 H5，早期圖文型 H5 只需要用戶通過簡單的翻頁、點擊就可以參與其中，展現(xiàn)效果類似于 PPT。應(yīng)用場景主要包括移動網(wǎng)站、邀請函、年終總結(jié)、產(chǎn)品推廣等。
制作網(wǎng)站是 H5 在 PC 端最廣泛的用法，所以，當(dāng) H5 應(yīng)用到移動端時，設(shè)計師們首先會想到的就是制作移動網(wǎng)站。
比如，歐香小鎮(zhèn)、燕楠國際等品牌就基于 H5 制作了移動網(wǎng)站。
邀請函也是圖文型H5的主要應(yīng)用場景之一，比如《奔馳 C 級上市邀請函》和《微信公開課 PRO 版邀請函》都是當(dāng)時的典型代表。
2014 年，一些品牌開始嘗試用 H5 推廣產(chǎn)品，比如錘子手機、特斯拉等，僅僅采用精美圖片加上簡單的翻頁動效，最終的呈現(xiàn)效果卻超越了當(dāng)時人們對微信營銷的想象。
2014 年 4 月，著名奢侈品牌Burberry 推出的 H5 《從倫敦到上海的旅程》是當(dāng)時交互體驗的集大成者。第一步，“搖一搖”，開始體驗；第二步，點擊屏幕進入油畫般的倫敦清晨；第三步，摩擦屏幕使晨霧散去；第四步，點擊“河面”，河水泛起漣漪；最后點擊屏幕上的白點，達到終點站上海。
2014 年 5 月，可口可樂推出的《分享快樂 128 年》，將圖文型 H5 的交互又向前推進了一步。這支 H5 頁面上的每個元素都可以動。而且相較于原本的單頁翻動，更注重跨頁連接，一根貫穿畫面始終的“紅線”，讓畫面在視覺上更加流暢和統(tǒng)一。
此后，長圖型 H5 逐漸多了起來，正式引爆可以追溯到 2017 年 5 月，百雀羚刷屏長圖《一九三一》開辟了長圖型圖文H5的新形式，這種形式非常適合移動端閱讀，迅速為大眾接受。
2018 年 8 月，騰訊云推出的《山城云居圖》采用了橫屏長圖的形式。
2018 年 9 月，網(wǎng)易的公益H5《她掙扎48小時后死去，無人知曉》在朋友圈刷屏，這支 H5 在長圖的基礎(chǔ)上，融合滑動動畫等表現(xiàn)形式，為圖文型 H5 增加了新的創(chuàng)意，效果令人震撼：
活動型 H5 也是較早出現(xiàn)的 H5 類型，主要包括紅包、抽獎、投票、砍價、拼團等，這類 H5 模式和技術(shù)都非常簡單，但因為由直接利益驅(qū)動，傳播力較強。
口令紅包、語音紅包、簽到抽獎、砍價拼團（來源：人人秀官網(wǎng)）
常規(guī)的活動型 H5 往往缺乏情節(jié)設(shè)計，非常單調(diào)，為了更好地促使用戶點擊和分享，一些活動類 H5 開始探尋新的玩法。
比如，2016 年 1 號店推出的 H5《姐妹花的煩惱》，打破了常規(guī)活動類 H5 的俗套，在推出促銷活動前添加了故事情節(jié)，以吐槽物價高為主題，在表現(xiàn)形式上機智地拿人民幣開玩笑，角色直接取自于一元紙幣上的少數(shù)民族形象，最后一頁才出現(xiàn) 1 號店的促銷活動。
2014 年 7 月 22 日起，一款名為“圍住神經(jīng)貓”的H5小游戲開始在微信朋友圈瘋傳，此后，游戲類 H5 如“2048”、杜蕾斯“一夜N次郎”（即山寨版“別踩白塊兒”）等游戲類 H5 層出不窮。
近年來火爆的游戲型 H5 大都是簡單的小游戲，用戶只需要通過簡單交互，便可參與。比如，2017 年 ofo 推出的 H5《小黃車研發(fā)車間》，利用點擊、滑動、搖一搖等簡單交互，讓用戶參與造車小游戲。
2017 年 9 月，網(wǎng)易嚴(yán)選推出了一個為強迫癥患者量身定做的 H5 小游戲《好難受，強迫癥受不了了》，通過對齊木塊、將彩色球排列完整、救活枯萎的花、消除俄羅斯方塊、修剪一下樹木等 5 個“強迫癥”小游戲來展現(xiàn)“極致美學(xué)”，不過，這個小游戲里除了簡單的點擊、滑動等外，還應(yīng)用了重力感應(yīng)等更復(fù)雜的交互。
2017 年 11 月 19 日，世界廁所日，網(wǎng)易新聞以此為主題，通過小游戲的形式，了解了三個有趣的廁所新聞和一個廁所文化。
2018年草莓音樂節(jié)的宣傳H5和網(wǎng)易的H5《你的工位有貓，我的工位有刀》、《睡姿大比拼》等都屬于DIY型的小游戲。
創(chuàng)意廣告公司 Dopemine 在 2016 年推出的《活口》在玩法上有很大不同，采用了真人密室逃脫的形式，設(shè)計和交互上更為復(fù)雜。
測試型 H5 以問答、評分、測試為表現(xiàn)形式，利用用戶的好奇心，引導(dǎo)用戶參與問答，并分享最終結(jié)果。測試類 H5 一般分為三大類型：運勢占卜、知識測試、心理測試，剛開始出現(xiàn)的時候以運勢占卜為主，慢慢開始出現(xiàn)有趣的知識測試類型，近 2 年刷屏的測試類 H5 大都以心理測試為主。
1.運勢占卜
通過在線抽簽、塔羅牌等形式進行運勢占卜。在新年、春節(jié)之類的喜慶日子，人們都很喜歡玩占卜游戲來祈求福運，此類H5操作容易，符合傳統(tǒng)習(xí)俗，因而備受歡迎。比如，攜程旅行在2016年推出的H5《我的2016福地》就引導(dǎo)用戶從“愛情、事業(yè)、健康、財運”中任意選擇一個自己想了解的福地，然后點擊“探尋我的福地”，測試出2016年自己的福地。
2.知識測試
傳播度較高的知識測試，通常是針對一些有趣的常識類知識進行的。比如，2017年愛奇藝推出的《2017七夕直男考卷》針對男女朋友間相處的一些趣事進行測試，取得了微信當(dāng)天pv2646.6萬，分享成功次數(shù)137.8萬的成績。
騰訊視頻在 2017 年推出的 H5《測測娛樂圈有沒有你的一席之地》則是以當(dāng)時熱門的綜藝、電視劇、明星相關(guān)資訊為題，并結(jié)合傳統(tǒng)考試題型進行設(shè)計。
3.心理測試
心理測試型 H5 一般通過答題來給測試者的認(rèn)知、行為、情感的心理活動予以量化，幫助其了解自己的情緒、行為模式和人格特點。
近年來大火的測試型H5大都屬于這種類型，比如，2018年8月，京東推出的《你是哪種走紅體質(zhì)》，F(xiàn)IYTA&網(wǎng)易云音樂聯(lián)合推出的《你有戀愛的天分嗎》，2018年9月，飛利浦推出的《友情鑒定書——塑料指數(shù)大檢驗》，海底撈推出的《測測你在宮斗劇中能活到第幾集》，2018年10月，小米互娛《測一測你在戀愛中的形象》等。
2018 年 8 月，網(wǎng)易云音樂和第5人格聯(lián)合推出的《你的榮格心理學(xué)原型》采用對話的形式，非常新穎，而且非常適合用于心理學(xué)測試，讓被測者更輕松。
H5 二維碼已被微信屏蔽，用 QQ 掃碼，或網(wǎng)易云音樂 App 首頁 banner 進入
2018 年 10 月，貓眼電影推出的《假如影子有生命》，為每一個選項設(shè)置了不同的動畫效果，而不是簡單地跳轉(zhuǎn)到下一題，使得測試類H5的視覺效果又上了一個臺階。但心理學(xué)測試的選題過于老套，文案也缺乏亮點。
快閃是指在短時間內(nèi)，快速閃過大量文字或圖片信息的一種視頻制作方式。國內(nèi)最早使用快閃形式進行營銷的品牌是蘋果。2016 年 9 月，蘋果在 iPhoe7 發(fā)布會結(jié)束后，采用快閃的形式，將 2小時的發(fā)布會濃縮成了 107 秒的快閃短視頻，引發(fā)了巨大的傳播和討論。
蘋果107S快閃，形式簡潔，但細(xì)節(jié)非?？季?/p>
此后，國內(nèi)使用快閃形式進行營銷的品牌層出不窮，比如凱迪拉克 30S 快閃廣告、CMF 設(shè)計快閃宣傳片、京東《閑置衣物》公益快閃廣告等，但在質(zhì)量上很少能和蘋果的快閃媲美。
快閃形式在 H5 中也開始應(yīng)用，觀看形式由橫版變成了豎版，并且融入了 H5 中特有的交互形式。比如，人民日報在 2017 年推出的快閃 H5《為我黨傳播力瘋狂打call》以及《史上最牛創(chuàng)業(yè)經(jīng)》，都在朋友圈瘋狂刷屏，之后，快閃這種H5的新形式開始受到熱烈的追捧。
比如，蘇寧易購在 2017 年雙 11 推出的 H5，2017 年全運會宣傳 H5 都是快閃形式。
模擬界面，就是模擬不同的移動端界面，進行場景的構(gòu)建和情節(jié)的開展。目前常見的類型有模擬微信界面、模擬來電界面、模擬新聞界面、模擬抖音界面等。
1.模擬微信界面
模擬微信界面是模擬界面類 H5 中最常見的類型，包括微信群聊、朋友圈、微信文章等多種形式。
2015 年，大眾點評推出的 H5《四大導(dǎo)師拯救麥渣》偽裝成微信文章，利用當(dāng)時很火爆的選秀節(jié)目中國好聲音，結(jié)合四大導(dǎo)師來推廣大眾點評的KTV資源。
2016 年 4 月份寶馬推出的 H5《該新聞已被BMW快速刪除》開頭模擬微信公眾號文章頁面，當(dāng)用戶點擊后，新聞網(wǎng)頁像紙一樣被寶馬 M2 跑車劃破，接著視頻新聞、朋友圈和音樂播放器都被它呼嘯碾過，極具沖擊力?！?/p>
未來應(yīng)用為 2017 年兩會定制的 H5，就結(jié)合了微信群聊、微信朋友圈等形式，成功在朋友圈刷屏。
有道翻譯官在 2017 年推出的 H5《深夜，男同事問我睡了嗎》結(jié)合了微信聊天和群聊的形式，因為標(biāo)題有吸引力，且文案設(shè)計活潑幽默，也取得了刷屏效果。
新媒體人王高高模擬微信公眾號界面制作了一份個人簡歷，文案生動幽默，形式新穎。
2.模擬手機界面
包括模擬手機屏幕、模擬來電、模擬siri等。微信朋友圈中大范圍傳播的第一個模擬電話場景的 H5,是 2015 年大眾點評為推廣電影《復(fù)仇者聯(lián)盟2》定制的H5《這個陌生來電你敢接嗎？》，通過用戶收到未知來電，接聽后屏幕被婦聯(lián)的人物武器不斷敲擊，最終“碎屏”，創(chuàng)意表現(xiàn)手法與《復(fù)仇者聯(lián)盟2》的電影調(diào)性完美結(jié)合。
2016 年網(wǎng)易游戲倩女幽魂推出的 H5《頭條|誰約到了楊洋》采用了模擬手機屏幕的形式，在 H5 中，楊洋通過幫用戶擦手機屏幕、整理手機 APP 等方式與用戶互動。
3.模擬新聞界面
2015年，騰訊游戲全民突擊推出的H5《吳亦凡即將入伍》采取了模擬騰訊新聞界面的形式，然后轉(zhuǎn)變成視頻通話，最后再鏈接到廣告頁面。
4.模擬抖音界面
模擬抖音界面主要應(yīng)用在抖音官方的推廣H5中，比如2017年推出的《世界名畫抖抖抖抖起來了》、2018年推出的《抖音美好奇妙夜》等。
2015 年，朋友圈開始出現(xiàn)雙屏互動型 H5，這種類型的 H5 需要 2 臺手機共同掃碼完成互動，交互性能比其他 H5 顯著增強。
2015 年，奔馳推出的 H5《鵲橋會，愛更多》采用雙屏互動的形式，模擬喜鵲搭橋場景，當(dāng)兩臺手機合并的時候，一座鵲橋就搭建完成，并出現(xiàn)唯美的愛心畫面，同時車的后備箱出現(xiàn)玫瑰花，非常浪漫。
2015 年，六神推出的 H5《在夏天在一起》通過買通票的方式，模擬電影院讓兩位觀眾欣賞到一部制作精良的夏夜動畫。
一鏡到底是指看上去幾乎不用剪輯，沒有切換，一個鏡頭從頭到尾，完整記錄整個事件的發(fā)生過程。這種藝術(shù)手法源于電影產(chǎn)業(yè)，最早出現(xiàn)在美國波普藝術(shù)家安迪·沃霍爾拍攝的紀(jì)錄片《帝國大廈》中。1964 年，他將攝影機對著帝國大廈毫不變換機位、景別地拍了 485 分鐘。
紀(jì)錄片《帝國大廈》劇照
第 87 屆奧斯卡金像獎最佳影片《鳥人》也是一部經(jīng)典的一鏡到底的影片。
電影《鳥人》海報
2017 年，網(wǎng)易新聞推出的 H5《章瑩穎失蹤 74 天了，全世界都想找到她》就采用了一鏡到底的形式，通過一張長圖，結(jié)合滑動動畫，非常清晰流暢地呈現(xiàn)了新聞事件的經(jīng)過。
VR全景是指利用計算機生成一個全方位的虛擬現(xiàn)實環(huán)境，許多科幻電影都用到了 VR 技術(shù)進行拍攝，如《黑客帝國》、《阿凡達》等等。
隨著 VR 技術(shù)的逐漸成熟，應(yīng)用 VR 技術(shù)的 H5 逐漸增多，比如，《穿越宇宙的邀請函》是天貓在2016年制作的一個結(jié)合VR技術(shù)及一鏡到底的H5，試聽效果非常震撼。
從形式上來說，每一次新技術(shù)的出現(xiàn)都會帶來新的創(chuàng)意形式，比如，當(dāng)下大火的人工智能技術(shù)也開始在 H5 領(lǐng)域應(yīng)用，出現(xiàn)了《人工智能為你定制春聯(lián)》、《詩與故鄉(xiāng)》等經(jīng)典案例。
從內(nèi)容上來說，所有刷屏型 H5 本質(zhì)上都在做一件事情——抓住一種情緒，講好一個故事。
本文為作者獨立觀點，不代表鳥哥筆記立場，未經(jīng)允許不得轉(zhuǎn)載。
《鳥哥筆記版權(quán)及免責(zé)申明》 如對文章、圖片、字體等版權(quán)有疑問，請點擊 反饋舉報
我們致力于提供一個高質(zhì)量內(nèi)容的交流平臺。為落實國家互聯(lián)網(wǎng)信息辦公室“依法管網(wǎng)、依法辦網(wǎng)、依法上網(wǎng)”的要求，為完善跟帖評論自律管理，為了保護用戶創(chuàng)造的內(nèi)容、維護開放、真實、專業(yè)的平臺氛圍，我們團隊將依據(jù)本公約中的條款對注冊用戶和發(fā)布在本平臺的內(nèi)容進行管理。平臺鼓勵用戶創(chuàng)作、發(fā)布優(yōu)質(zhì)內(nèi)容，同時也將采取必要措施管理違法、侵權(quán)或有其他不良影響的網(wǎng)絡(luò)信息。
一、根據(jù)《網(wǎng)絡(luò)信息內(nèi)容生態(tài)治理規(guī)定》《中華人民共和國未成年人保護法》等法律法規(guī)，對以下違法、不良信息或存在危害的行為進行處理。
1. 違反法律法規(guī)的信息，主要表現(xiàn)為：
1)反對憲法所確定的基本原則；
2)危害國家安全，泄露國家秘密，顛覆國家政權(quán)，破壞國家統(tǒng)一，損害國家榮譽和利益；
3)侮辱、濫用英烈形象，歪曲、丑化、褻瀆、否定英雄烈士事跡和精神，以侮辱、誹謗或者其他方式侵害英雄烈士的姓名、肖像、名譽、榮譽；
4)宣揚恐怖主義、極端主義或者煽動實施恐怖活動、極端主義活動；
5)煽動民族仇恨、民族歧視，破壞民族團結(jié)；
6)破壞國家宗教政策，宣揚邪教和封建迷信；
7)散布謠言，擾亂社會秩序，破壞社會穩(wěn)定；
8)宣揚淫穢、色情、賭博、暴力、兇殺、恐怖或者教唆犯罪；
9)煽動非法集會、結(jié)社、游行、示威、聚眾擾亂社會秩序；
10)侮辱或者誹謗他人，侵害他人名譽、隱私和其他合法權(quán)益；
11)通過網(wǎng)絡(luò)以文字、圖片、音視頻等形式，對未成年人實施侮辱、誹謗、威脅或者惡意損害未成年人形象進行網(wǎng)絡(luò)欺凌的；
12)危害未成年人身心健康的；
13)含有法律、行政法規(guī)禁止的其他內(nèi)容；
2. 不友善：不尊重用戶及其所貢獻內(nèi)容的信息或行為。主要表現(xiàn)為：
1)輕蔑：貶低、輕視他人及其勞動成果；
2)誹謗：捏造、散布虛假事實，損害他人名譽；
3)嘲諷：以比喻、夸張、侮辱性的手法對他人或其行為進行揭露或描述，以此來激怒他人；
4)挑釁：以不友好的方式激怒他人，意圖使對方對自己的言論作出回應(yīng)，蓄意制造事端；
5)羞辱：貶低他人的能力、行為、生理或身份特征，讓對方難堪；
6)謾罵：以不文明的語言對他人進行負(fù)面評價；
7)歧視：煽動人群歧視、地域歧視等，針對他人的民族、種族、宗教、性取向、性別、年齡、地域、生理特征等身份或者歸類的攻擊；
8)威脅：許諾以不良的后果來迫使他人服從自己的意志；
3. 發(fā)布垃圾廣告信息：以推廣曝光為目的，發(fā)布影響用戶體驗、擾亂本網(wǎng)站秩序的內(nèi)容，或進行相關(guān)行為。主要表現(xiàn)為：
1)多次發(fā)布包含售賣產(chǎn)品、提供服務(wù)、宣傳推廣內(nèi)容的垃圾廣告。包括但不限于以下幾種形式：
2)單個帳號多次發(fā)布包含垃圾廣告的內(nèi)容；
3)多個廣告帳號互相配合發(fā)布、傳播包含垃圾廣告的內(nèi)容；
4)多次發(fā)布包含欺騙性外鏈的內(nèi)容，如未注明的淘寶客鏈接、跳轉(zhuǎn)網(wǎng)站等，誘騙用戶點擊鏈接
5)發(fā)布大量包含推廣鏈接、產(chǎn)品、品牌等內(nèi)容獲取搜索引擎中的不正當(dāng)曝光；
6)購買或出售帳號之間虛假地互動，發(fā)布干擾網(wǎng)站秩序的推廣內(nèi)容及相關(guān)交易。
7)發(fā)布包含欺騙性的惡意營銷內(nèi)容，如通過偽造經(jīng)歷、冒充他人等方式進行惡意營銷；
8)使用特殊符號、圖片等方式規(guī)避垃圾廣告內(nèi)容審核的廣告內(nèi)容。
4. 色情低俗信息，主要表現(xiàn)為：
1)包含自己或他人性經(jīng)驗的細(xì)節(jié)描述或露骨的感受描述；
2)涉及色情段子、兩性笑話的低俗內(nèi)容；
3)配圖、頭圖中包含庸俗或挑逗性圖片的內(nèi)容；
4)帶有性暗示、性挑逗等易使人產(chǎn)生性聯(lián)想；
5)展現(xiàn)血腥、驚悚、殘忍等致人身心不適；
6)炒作緋聞、丑聞、劣跡等；
7)宣揚低俗、庸俗、媚俗內(nèi)容。
5. 不實信息，主要表現(xiàn)為：
1)可能存在事實性錯誤或者造謠等內(nèi)容；
2)存在事實夸大、偽造虛假經(jīng)歷等誤導(dǎo)他人的內(nèi)容；
3)偽造身份、冒充他人，通過頭像、用戶名等個人信息暗示自己具有特定身份，或與特定機構(gòu)或個人存在關(guān)聯(lián)。
6. 傳播封建迷信，主要表現(xiàn)為：
1)找人算命、測字、占卜、解夢、化解厄運、使用迷信方式治??；
2)求推薦算命看相大師；
3)針對具體風(fēng)水等問題進行求助或咨詢；
4)問自己或他人的八字、六爻、星盤、手相、面相、五行缺失，包括通過占卜方法問婚姻、前程、運勢，東西寵物丟了能不能找回、取名改名等；
7. 文章標(biāo)題黨，主要表現(xiàn)為：
1)以各種夸張、獵奇、不合常理的表現(xiàn)手法等行為來誘導(dǎo)用戶；
2)內(nèi)容與標(biāo)題之間存在嚴(yán)重不實或者原意扭曲；
3)使用夸張標(biāo)題，內(nèi)容與標(biāo)題嚴(yán)重不符的。
8.「飯圈」亂象行為，主要表現(xiàn)為：
1)誘導(dǎo)未成年人應(yīng)援集資、高額消費、投票打榜
2)粉絲互撕謾罵、拉踩引戰(zhàn)、造謠攻擊、人肉搜索、侵犯隱私
3)鼓動「飯圈」粉絲攀比炫富、奢靡享樂等行為
4)以號召粉絲、雇用網(wǎng)絡(luò)水軍、「養(yǎng)號」形式刷量控評等行為
5)通過「蹭熱點」、制造話題等形式干擾輿論，影響傳播秩序
9. 其他危害行為或內(nèi)容，主要表現(xiàn)為：
1)可能引發(fā)未成年人模仿不安全行為和違反社會公德行為、誘導(dǎo)未成年人不良嗜好影響未成年人身心健康的；
2)不當(dāng)評述自然災(zāi)害、重大事故等災(zāi)難的；
3)美化、粉飾侵略戰(zhàn)爭行為的；
4)法律、行政法規(guī)禁止，或可能對網(wǎng)絡(luò)生態(tài)造成不良影響的其他內(nèi)容。
二、違規(guī)處罰
本網(wǎng)站通過主動發(fā)現(xiàn)和接受用戶舉報兩種方式收集違規(guī)行為信息。所有有意的降低內(nèi)容質(zhì)量、傷害平臺氛圍及欺凌未成年人或危害未成年人身心健康的行為都是不能容忍的。
當(dāng)一個用戶發(fā)布違規(guī)內(nèi)容時，本網(wǎng)站將依據(jù)相關(guān)用戶違規(guī)情節(jié)嚴(yán)重程度，對帳號進行禁言 1 天、7 天、15 天直至永久禁言或封停賬號的處罰。當(dāng)涉及欺凌未成年人、危害未成年人身心健康、通過作弊手段注冊、使用帳號，或者濫用多個帳號發(fā)布違規(guī)內(nèi)容時，本網(wǎng)站將加重處罰。
三、申訴
隨著平臺管理經(jīng)驗的不斷豐富，本網(wǎng)站出于維護本網(wǎng)站氛圍和秩序的目的，將不斷完善本公約。
如果本網(wǎng)站用戶對本網(wǎng)站基于本公約規(guī)定做出的處理有異議，可以通過「建議反饋」功能向本網(wǎng)站進行反饋。
(規(guī)則的最終解釋權(quán)歸屬本網(wǎng)站所有)