优秀H5案例赏析汇总（二）

上期为大家带来许多优秀的H5案例，反响不错，很多朋友都希望能再多分享一些。为了满足大家的需求，蓝橙小编就给大家带来第二期精选H5案例合集。

案例名称：跟我到古代云逛庙

案例品牌：饿了么X口碑网X清明上河图

饿了么与清明上河图合作，将饿了么上面的商家植入进上河图里面的商铺，整幅画面以动态形式呈现，用户点击上河图中的商家，可以领取优惠券。

标题页面的进度条加载完毕后，用户随着镜头穿过云雾，来到清明上河图中，左滑浏览，熙攘街头有许多热门店面，和零星分布的讲解，以及人物对话框。店面包括外婆家，来伊份，麦当劳，奈雪的茶，海底捞等100多个各类店铺，店铺上面有招牌，LOGO和广告语；零星分布的讲解内容有超级品牌日，顾客对美食的感慨，蜂鸟配送，口碑直播等平台活动和服务内容；人物对话有外卖员送餐，顾客取餐，老板感慨加入饿了么以后订单很多等生活化内容。用户点击喜欢的店铺，查看大图，有小二报出店名和欢迎词，用户可选择进店抢货或继续逛街。

还原清明上河图的风格，进行手绘呈现，既有古风美感，又有很多熟悉的现代美食店铺罗列，点开后各个品牌均有优惠可以领取，对用户来说都是实打实的省钱，精准迎合需求，同时很详细的宣传了平台各方面的品牌优势和贴心服务。

案例名称：秘密花园

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

该案例契合饿了么蓝骑士的口号，与知名的涂色绘本《秘密花园》合作，将饿了么上可以点的商户植入到秘密花园中，凸显下午茶的概念，用户可以看到蓝骑士与用户之间发生的故事，凸显“爱什么来什么”的口号。

点击打开作品，来到秘密花园风格的横屏界面，左滑屏幕查看画作每部分的内容，蓝骑士为小朋友送来好吃的，为在公园看书的女生送来奶茶，为聚会庆生的女生们送来蛋糕，为求婚的男生送来花束。用户点击发光图标领取优惠券。

还原《秘密花园》本来的色彩元素和手绘风格，色彩丰富元素繁密，各个场景都很温暖美好，又有生活气息，都是生活中人们经常遇到的外卖需求。

案例名称：燃...燃起来了

案例品牌：新华社客户端X新华社体育部X新华社技术局X新浪微博

全民健身时代，远离高热量食物，用运动消耗卡路里，才能实现身材升级。参与新华社出品的足球游戏，了解运动，卡路里，与实物数量之间的换算，还可以用成绩兑换奖品哦！

初始界面有一位身着球服的胖男生背影，上方是标题和该男子肥胖程度，下方是开始触点，排行榜与游戏方法详情。

点击“运动有奖”开始挑战，男生大脚开球，向前奔跑，用户点击跑道让运动员左右移动，在奔跑时需要注意足球位置，及时挪去带球，同时接住水，避开高热量食品和裁判，接住水可以保持左上角身体含水量进度条不枯竭，接住高热量食品会抵消减掉的卡路里，没有及时接回球和冲撞裁判会导致游戏结束，奔跑一定距离后男子身材会变瘦一个等级。

案例名称：东京奥运会 金牌大挑战

案例品牌：人民日报新媒体 x 中国移动 x 咪咕

这是人民日报新媒体联合中国移动、咪咕制作的H5案例，旨在传递奥运精神，通过互动H5游戏的形式让用户体验不同运动项目的趣味。

加载成功后，用户可以在首页看到九种不同的运动项目金牌，只要点击自己感兴趣的项目金牌，即可体验该运动项目的线上比赛；页面跳转后，用户可以在游戏起始页了解运动项目的规则、历史以及中国运动员最早在该项目取得的成就，点击“我要挑战”了解线上比赛的规则和比赛方法，在倒计时后开始比赛，结束后会根据你的比赛成绩，为你颁发金牌、银牌、铜牌、谢谢参与四个奖项，用户可以在颁奖页面直接保存海报，也可以分享到朋友圈，如果对成绩不满意，可以点击“再次挑战”。

整个案例操作简单，游戏也具有反复参与性，九种不同的运动项目包含全面，有些是用户平时很难接触到的，通过游戏体验是一种很新颖的方式，也能够增强用户对该项目真正的运动体验的好奇心。

案例名称：我们能一起看奥运么？

案例品牌：人民体育&腾讯看点&QQ浏览器

选择自己最喜欢的奥运项目，发给好友，考验默契。

点击打开作品，在紫色系分框图中点击自己最喜欢的奥运项目，选五个，被点击的项目图片会从紫色系变为彩色系，右下角有已选数量，点好后，用户可选择“就这样猜”看看自己和谁最默契，或选择“我来出题”，然后发给好友让好友猜，最后用户可查看自己的选择，和登陆QQ浏览器查看奥运主题版块。

色彩统一，每个项目都有相关配图，让用户浏览起来有画面感，从而选出自己的最爱。被选项目会变成别的颜色，视觉突出，方便用户回顾。

案例：新生代返场 升级新可能

品牌：网易云音乐 X adidas

开学季在即，如果给你个机会重回校园，你会是老师同学心目中怎样的学生呢？带上adidas新装备，一起重温校园时光吧！

选择自己的身份，学生，毕业多年，或已为人父母，开始答题，包括书包里的东西，喜欢坐的位置，对一段音乐的联想，感兴趣的新课和如何回复小纸条，输入姓名，选择性别，生成海报，包括你所属的学生类型，头脑王者，学霸或暖心班长等，以及相关分析，用户可点击触点登陆相关平台。

校园类作品，颜色清新活跃，画风青春洋溢有活力，插图上的人物都身着阿迪达斯服饰，加深用户对品牌的印象，和感受品牌服饰对青春气质的加持。除了上课下课这样的上学正规流程，作品还融入了传纸条，打球，零食这些学生时代最喜欢的趣味，引发美好回忆。

案例名称：biubiubiu

案例品牌：新华社技术局&新华社客户端&新华社体育部出品

新华社出品，用户在作品中感受射击乐趣，通过三关，即可参与抽奖，挑战体育项目，呼应奥运主题。

首页有奖牌数，五星红旗和个人最高分，用户可选择音效是否打开，查看排行榜和开始游戏，游戏开始后，上方是30秒倒计时，目标38环，中间是瞄准星和靶子，滑动左下方的触点瞄准，点击右方射击，靶子上会出现击中的环数和枪眼，上方目标栏跳至相应剩余环数，完成38环后进入下一关，靶子会变小或晃动，三关后，总成绩和奖杯出现，点击抽奖。

作品界面很简洁，瞄准星视角，让用户专注射击，在严肃的背景音乐下感受紧张的比赛气氛。

相关阅读：

优秀H5案例赏析汇总（一）