上期為大家?guī)?lái)許多優(yōu)秀的H5案例，反響不錯(cuò)，很多朋友都希望能再多分享一些。為了滿足大家的需求，藍(lán)橙小編就給大家?guī)?lái)第二期精選H5案例合集。

案例名稱：跟我到古代云逛廟

案例品牌：餓了么X口碑網(wǎng)X清明上河圖

餓了么與清明上河圖合作，將餓了么上面的商家植入進(jìn)上河圖里面的商鋪，整幅畫(huà)面以動(dòng)態(tài)形式呈現(xiàn)，用戶點(diǎn)擊上河圖中的商家，可以領(lǐng)取優(yōu)惠券。

標(biāo)題頁(yè)面的進(jìn)度條加載完畢后，用戶隨著鏡頭穿過(guò)云霧，來(lái)到清明上河圖中，左滑瀏覽，熙攘街頭有許多熱門店面，和零星分布的講解，以及人物對(duì)話框。店面包括外婆家，來(lái)伊份，麥當(dāng)勞，奈雪的茶，海底撈等100多個(gè)各類店鋪，店鋪上面有招牌，LOGO和廣告語(yǔ)；零星分布的講解內(nèi)容有超級(jí)品牌日，顧客對(duì)美食的感慨，蜂鳥(niǎo)配送，口碑直播等平臺(tái)活動(dòng)和服務(wù)內(nèi)容；人物對(duì)話有外賣員送餐，顧客取餐，老板感慨加入餓了么以后訂單很多等生活化內(nèi)容。用戶點(diǎn)擊喜歡的店鋪，查看大圖，有小二報(bào)出店名和歡迎詞，用戶可選擇進(jìn)店搶貨或繼續(xù)逛街。

還原清明上河圖的風(fēng)格，進(jìn)行手繪呈現(xiàn)，既有古風(fēng)美感，又有很多熟悉的現(xiàn)代美食店鋪羅列，點(diǎn)開(kāi)后各個(gè)品牌均有優(yōu)惠可以領(lǐng)取，對(duì)用戶來(lái)說(shuō)都是實(shí)打?qū)嵉氖″X，精準(zhǔn)迎合需求，同時(shí)很詳細(xì)的宣傳了平臺(tái)各方面的品牌優(yōu)勢(shì)和貼心服務(wù)。

案例名稱：秘密花園

案例品牌：餓了么X后浪出版公司《秘密花園》

該案例契合餓了么藍(lán)騎士的口號(hào)，與知名的涂色繪本《秘密花園》合作，將餓了么上可以點(diǎn)的商戶植入到秘密花園中，凸顯下午茶的概念，用戶可以看到藍(lán)騎士與用戶之間發(fā)生的故事，凸顯“愛(ài)什么來(lái)什么”的口號(hào)。

點(diǎn)擊打開(kāi)作品，來(lái)到秘密花園風(fēng)格的橫屏界面，左滑屏幕查看畫(huà)作每部分的內(nèi)容，藍(lán)騎士為小朋友送來(lái)好吃的，為在公園看書(shū)的女生送來(lái)奶茶，為聚會(huì)慶生的女生們送來(lái)蛋糕，為求婚的男生送來(lái)花束。用戶點(diǎn)擊發(fā)光圖標(biāo)領(lǐng)取優(yōu)惠券。

還原《秘密花園》本來(lái)的色彩元素和手繪風(fēng)格，色彩豐富元素繁密，各個(gè)場(chǎng)景都很溫暖美好，又有生活氣息，都是生活中人們經(jīng)常遇到的外賣需求。

案例名稱：燃...燃起來(lái)了

案例品牌：新華社客戶端X新華社體育部X新華社技術(shù)局X新浪微博

全民健身時(shí)代，遠(yuǎn)離高熱量食物，用運(yùn)動(dòng)消耗卡路里，才能實(shí)現(xiàn)身材升級(jí)。參與新華社出品的足球游戲，了解運(yùn)動(dòng)，卡路里，與實(shí)物數(shù)量之間的換算，還可以用成績(jī)兌換獎(jiǎng)品哦！

初始界面有一位身著球服的胖男生背影，上方是標(biāo)題和該男子肥胖程度，下方是開(kāi)始觸點(diǎn)，排行榜與游戲方法詳情。

點(diǎn)擊“運(yùn)動(dòng)有獎(jiǎng)”開(kāi)始挑戰(zhàn)，男生大腳開(kāi)球，向前奔跑，用戶點(diǎn)擊跑道讓運(yùn)動(dòng)員左右移動(dòng)，在奔跑時(shí)需要注意足球位置，及時(shí)挪去帶球，同時(shí)接住水，避開(kāi)高熱量食品和裁判，接住水可以保持左上角身體含水量進(jìn)度條不枯竭，接住高熱量食品會(huì)抵消減掉的卡路里，沒(méi)有及時(shí)接回球和沖撞裁判會(huì)導(dǎo)致游戲結(jié)束，奔跑一定距離后男子身材會(huì)變瘦一個(gè)等級(jí)。

案例名稱：東京奧運(yùn)會(huì) 金牌大挑戰(zhàn)

案例品牌：人民日?qǐng)?bào)新媒體 x 中國(guó)移動(dòng) x 咪咕

這是人民日?qǐng)?bào)新媒體聯(lián)合中國(guó)移動(dòng)、咪咕制作的H5案例，旨在傳遞奧運(yùn)精神，通過(guò)互動(dòng)H5游戲的形式讓用戶體驗(yàn)不同運(yùn)動(dòng)項(xiàng)目的趣味。

加載成功后，用戶可以在首頁(yè)看到九種不同的運(yùn)動(dòng)項(xiàng)目金牌，只要點(diǎn)擊自己感興趣的項(xiàng)目金牌，即可體驗(yàn)該運(yùn)動(dòng)項(xiàng)目的線上比賽；頁(yè)面跳轉(zhuǎn)后，用戶可以在游戲起始頁(yè)了解運(yùn)動(dòng)項(xiàng)目的規(guī)則、歷史以及中國(guó)運(yùn)動(dòng)員最早在該項(xiàng)目取得的成就，點(diǎn)擊“我要挑戰(zhàn)”了解線上比賽的規(guī)則和比賽方法，在倒計(jì)時(shí)后開(kāi)始比賽，結(jié)束后會(huì)根據(jù)你的比賽成績(jī)，為你頒發(fā)金牌、銀牌、銅牌、謝謝參與四個(gè)獎(jiǎng)項(xiàng)，用戶可以在頒獎(jiǎng)頁(yè)面直接保存海報(bào)，也可以分享到朋友圈，如果對(duì)成績(jī)不滿意，可以點(diǎn)擊“再次挑戰(zhàn)”。

整個(gè)案例操作簡(jiǎn)單，游戲也具有反復(fù)參與性，九種不同的運(yùn)動(dòng)項(xiàng)目包含全面，有些是用戶平時(shí)很難接觸到的，通過(guò)游戲體驗(yàn)是一種很新穎的方式，也能夠增強(qiáng)用戶對(duì)該項(xiàng)目真正的運(yùn)動(dòng)體驗(yàn)的好奇心。

案例名稱：我們能一起看奧運(yùn)么？

案例品牌：人民體育&騰訊看點(diǎn)&QQ瀏覽器

選擇自己最喜歡的奧運(yùn)項(xiàng)目，發(fā)給好友，考驗(yàn)?zāi)酢?/p>

點(diǎn)擊打開(kāi)作品，在紫色系分框圖中點(diǎn)擊自己最喜歡的奧運(yùn)項(xiàng)目，選五個(gè)，被點(diǎn)擊的項(xiàng)目圖片會(huì)從紫色系變?yōu)椴噬?，右下角有已選數(shù)量，點(diǎn)好后，用戶可選擇“就這樣猜”看看自己和誰(shuí)最默契，或選擇“我來(lái)出題”，然后發(fā)給好友讓好友猜，最后用戶可查看自己的選擇，和登陸QQ瀏覽器查看奧運(yùn)主題版塊。

色彩統(tǒng)一，每個(gè)項(xiàng)目都有相關(guān)配圖，讓用戶瀏覽起來(lái)有畫(huà)面感，從而選出自己的最愛(ài)。被選項(xiàng)目會(huì)變成別的顏色，視覺(jué)突出，方便用戶回顧。

案例：新生代返場(chǎng) 升級(jí)新可能

品牌：網(wǎng)易云音樂(lè) X adidas

開(kāi)學(xué)季在即，如果給你個(gè)機(jī)會(huì)重回校園，你會(huì)是老師同學(xué)心目中怎樣的學(xué)生呢？帶上adidas新裝備，一起重溫校園時(shí)光吧！

選擇自己的身份，學(xué)生，畢業(yè)多年，或已為人父母，開(kāi)始答題，包括書(shū)包里的東西，喜歡坐的位置，對(duì)一段音樂(lè)的聯(lián)想，感興趣的新課和如何回復(fù)小紙條，輸入姓名，選擇性別，生成海報(bào)，包括你所屬的學(xué)生類型，頭腦王者，學(xué)霸或暖心班長(zhǎng)等，以及相關(guān)分析，用戶可點(diǎn)擊觸點(diǎn)登陸相關(guān)平臺(tái)。

校園類作品，顏色清新活躍，畫(huà)風(fēng)青春洋溢有活力，插圖上的人物都身著阿迪達(dá)斯服飾，加深用戶對(duì)品牌的印象，和感受品牌服飾對(duì)青春氣質(zhì)的加持。除了上課下課這樣的上學(xué)正規(guī)流程，作品還融入了傳紙條，打球，零食這些學(xué)生時(shí)代最喜歡的趣味，引發(fā)美好回憶。

案例名稱：biubiubiu

案例品牌：新華社技術(shù)局&新華社客戶端&新華社體育部出品

新華社出品，用戶在作品中感受射擊樂(lè)趣，通過(guò)三關(guān)，即可參與抽獎(jiǎng)，挑戰(zhàn)體育項(xiàng)目，呼應(yīng)奧運(yùn)主題。

首頁(yè)有獎(jiǎng)牌數(shù)，五星紅旗和個(gè)人最高分，用戶可選擇音效是否打開(kāi)，查看排行榜和開(kāi)始游戲，游戲開(kāi)始后，上方是30秒倒計(jì)時(shí)，目標(biāo)38環(huán)，中間是瞄準(zhǔn)星和靶子，滑動(dòng)左下方的觸點(diǎn)瞄準(zhǔn)，點(diǎn)擊右方射擊，靶子上會(huì)出現(xiàn)擊中的環(huán)數(shù)和槍眼，上方目標(biāo)欄跳至相應(yīng)剩余環(huán)數(shù)，完成38環(huán)后進(jìn)入下一關(guān)，靶子會(huì)變小或晃動(dòng)，三關(guān)后，總成績(jī)和獎(jiǎng)杯出現(xiàn)，點(diǎn)擊抽獎(jiǎng)。

作品界面很簡(jiǎn)潔，瞄準(zhǔn)星視角，讓用戶專注射擊，在嚴(yán)肅的背景音樂(lè)下感受緊張的比賽氣氛。

相關(guān)閱讀：

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