隨著H5開發(fā)技術(shù)的成熟，H5頁(yè)面能支持豐富更能和視覺(jué)效果，實(shí)現(xiàn)不同的H5玩法設(shè)計(jì)，比如H5互動(dòng)游戲、H5漫畫、答題測(cè)試H5、年度H5賬單等等。藍(lán)橙互動(dòng)精選H5案例合集分享08期，就給大家分享一下各種不同玩法的H5案例。

案例名稱：魷魚游戲

案例品牌：MEO

結(jié)合當(dāng)下流行的影視作品“魷魚游戲”創(chuàng)作的H5交互小游戲，各種限制，讓用戶體驗(yàn)人性的善惡，欲罷不能的一次次去挑戰(zhàn)，最后通關(guān)的人，獲得通過(guò)的“樂(lè)趣”。

魷魚游戲共6關(guān)，每關(guān)是一個(gè)獨(dú)立游戲。每一關(guān)開始前都有操作和規(guī)則提示，限時(shí)游戲。違犯規(guī)則和突破限定時(shí)間，都算Game Over。最后通關(guān)的者，會(huì)有通關(guān)祝賀：消耗命數(shù)+引發(fā)思考的文案。

巨難無(wú)比，即使了解《魷魚游戲》劇情的人，通關(guān)也得操作幾十遍，小編開始就以為這個(gè)游戲有bug，根本玩不過(guò)去。引發(fā)思考：如果有堅(jiān)持不懈通關(guān)的韌性和決心，天下什么事，搞不定？

案例名稱：警惕身邊的TA

案例品牌：人民日?qǐng)?bào)新媒體

人民日?qǐng)?bào)新媒體出品，用根據(jù)真實(shí)案例改編的情節(jié)故事，告知用戶間諜的常用套路與作案目標(biāo)，測(cè)試和提高全民反奸防諜意識(shí)。

打開作品后，在三個(gè)故事中任選一個(gè)進(jìn)入，在故事節(jié)點(diǎn)選擇自己是否接受情境中對(duì)方的要求，“天上的餡餅”講述了境外間諜勢(shì)力利用高薪網(wǎng)絡(luò)兼職，企圖讓“你”幫他拍攝軍港和軍事基地照片；“美麗的陷阱”是美女間諜利用美色，結(jié)識(shí)男性，收集尖端機(jī)械的相關(guān)信息；“坑人的朋友”是間諜勢(shì)力滲入朋友群，通過(guò)轉(zhuǎn)介紹企圖套取國(guó)家機(jī)密信息。最后間諜都無(wú)一例外被依法逮捕，作品也會(huì)根據(jù)用戶的選擇給出反奸防諜意識(shí)測(cè)試結(jié)果。 

案例名稱：消滅全民公敵

案例品牌：淘寶特價(jià)版

網(wǎng)購(gòu)盛行，但是陷阱和套路也很多，淘寶特價(jià)版在故事中化身江湖俠客，行俠仗義，戳破各種消費(fèi)詭計(jì)，具象化購(gòu)物的各種不良現(xiàn)象，表明自身態(tài)度，有針對(duì)性的宣傳自身優(yōu)勢(shì)，吸引用戶使用。

下滑瀏覽長(zhǎng)圖，內(nèi)容是一位嬰兒降生，被麒麟賜予神秘美玉，長(zhǎng)大后行走江湖，看到村民收到貨不對(duì)版的物品，幫助村民趕走旗號(hào)為“拼”的幫派，看到低價(jià)大甩賣，怒揭黑心商人原價(jià)更低的真相，遇到套路似迷宮的開業(yè)大酬賓，一劍毀掉，又打敗了假裝一手貨源的中間商，獲得群眾支持，最后殺掉了集“假冒”“套路”“高價(jià)”“偽劣”于一身的黑心頭目，完成使命，屏幕出現(xiàn)“為消費(fèi)平權(quán)而斗”“為殺價(jià)而生”的標(biāo)語(yǔ)。

案例名稱：靈魂試香紙

案例品牌：天貓

靈魂也是有香氣的，聽(tīng)起來(lái)是不是很新穎？天貓超級(jí)品牌日做品牌推廣，根據(jù)用戶性格測(cè)試結(jié)果，推薦不同品牌的產(chǎn)品，提高品牌日知名度，加深用戶對(duì)各大品牌的印象，促進(jìn)消費(fèi)。

點(diǎn)擊標(biāo)題頁(yè)的觸點(diǎn)，開始測(cè)試，主題是在一座古堡里探險(xiǎn)，跟著作品來(lái)到不同情境，回答相關(guān)問(wèn)題，包括是否帶上舞會(huì)面具，對(duì)墻上的空畫框做何感想，選擇一幅畫拖入，來(lái)到花園會(huì)如何擺放花盆，聽(tīng)到受傷的貓喊“疼”第一反應(yīng)是什么，選擇一個(gè)傳送門結(jié)束旅程。輸入名字生成海報(bào)，包括“你”的靈魂香氣形容詞，兩個(gè)關(guān)鍵詞和解說(shuō)，主圖，“魂器推薦”是一件商品，旁側(cè)有具體的商品名稱，報(bào)頭是天貓超級(jí)品牌日l(shuí)ogo與商品品牌logo。

案例名稱：殼牌電子會(huì)員2周年慶

案例品牌：殼牌

這款H5是由‘殼牌’開發(fā)的盤點(diǎn)類H5，旨在通過(guò)展現(xiàn)用戶與殼牌的大數(shù)據(jù)信息，讓用戶了解自己與殼牌的消費(fèi)記錄，從而宣傳品牌信息。進(jìn)入H5后，出現(xiàn)動(dòng)態(tài)橫條插畫形式的主題‘8月殼粉節(jié)，2周年’，下面點(diǎn)擊啟動(dòng)引擎進(jìn)入游戲；進(jìn)入游戲后通過(guò)滑動(dòng)翻頁(yè)查看各種自己與殼牌的經(jīng)歷，從認(rèn)識(shí)到第一次加油，然后是最早的加油時(shí)間，最晚的加油時(shí)間，去過(guò)的殼牌門店；最后形成一張發(fā)條形式的信息展示頁(yè)，可以分享到朋友圈；再次下滑則會(huì)進(jìn)入紅包雨游戲中，只有殼牌會(huì)員才能參與。

案例名稱：成都天府通-年度賬單H5

案例品牌：天府通

2019成都公共交通大數(shù)據(jù)報(bào)告發(fā)布后，天府通公司正式上線年度個(gè)人出行賬單查詢功能，用戶可打開天府通APP，點(diǎn)擊首頁(yè)頂部活動(dòng)入口即可查詢到自己的年度出行賬單。

本H5“公共交通年終總結(jié)”的主題更具個(gè)性化和趣味性，內(nèi)容包括用戶全年的公共交通消費(fèi)、搭乘公交和地鐵的“成績(jī)”、最早乘車與最晚乘車時(shí)間、個(gè)人減碳量等數(shù)據(jù)，直觀地反應(yīng)了用戶與城市的密切互動(dòng)。

以上就是本期為大家?guī)?lái)的H5案例分享，感興趣的朋友可以持續(xù)關(guān)注我們藍(lán)橙互動(dòng)官網(wǎng)的新聞動(dòng)態(tài)，或是關(guān)注藍(lán)橙互動(dòng)官方微信公眾號(hào)，我們會(huì)不定時(shí)向大家分享最新的優(yōu)秀案例。

相關(guān)案例：

優(yōu)秀H5案例賞析匯總（一）

優(yōu)秀H5案例賞析匯總（二）

優(yōu)秀H5案例賞析匯總（三）

優(yōu)秀H5案例賞析匯總（四）

優(yōu)秀H5案例賞析匯總（五）

優(yōu)秀H5案例賞析匯總（六）

優(yōu)秀H5案例賞析匯總（七）