随着H5开发技术（shù）的成熟，H5页面能支持丰富（fù）更能和视觉效（xiào）果，实现不同的H5玩法设计（jì），比如H5互动游戏、H5漫画、答题测试H5、年度（dù）H5账单（dān）等等。蓝（lán）橙互动精（jīng）选H5案例合集分享08期（qī），就给（gěi）大家分享一下各种不（bú）同（tóng）玩法的H5案例。

案（àn）例名称（chēng）：鱿鱼游戏

案（àn）例品牌：MEO

结合当下流行的（de）影视作品“鱿鱼（yú）游（yóu）戏”创作的H5交互小游戏，各种限制，让用户（hù）体验人性的善恶，欲罢不能的一次次去挑战，最后（hòu）通关的人，获（huò）得通过（guò）的“乐趣”。

鱿鱼游戏共6关，每关是一个独（dú）立游戏（xì）。每一关（guān）开（kāi）始前都有操作和规则（zé）提示，限时游戏。违犯规则和突破限定时（shí）间，都算Game Over。最后通关的者，会有通关祝（zhù）贺：消（xiāo）耗命数+引发思考（kǎo）的文案。

巨难无比，即使了（le）解（jiě）《鱿鱼游戏》剧情的人，通关也得（dé）操（cāo）作几十遍，小编开始就以为这个游戏有bug，根本（běn）玩（wán）不过去。引发思（sī）考：如果有坚持不懈通关的韧性和决心，天下什么事（shì），搞（gǎo）不定？

案例名称：警惕身边的（de）TA

案例品牌：人民日报新（xīn）媒（méi）体

人民（mín）日报新媒体出品，用根据真实案例改编的情节故（gù）事，告知用户间谍的常用套（tào）路与作案目标，测试和提高全民反（fǎn）奸防（fáng）谍意识。

打开作（zuò）品（pǐn）后，在三个故事中任选（xuǎn）一个进入，在故事节点选（xuǎn）择自（zì）己是否接受情（qíng）境中（zhōng）对（duì）方的要求，“天上的馅（xiàn）饼”讲（jiǎng）述（shù）了境外间谍（dié）势力利用高薪网（wǎng）络兼职，企图让“你”帮他拍摄（shè）军（jun1）港（gǎng）和军事基（jī）地照片；“美丽（lì）的（de）陷阱”是美（měi）女（nǚ）间谍（dié）利用美色，结识男性（xìng），收集尖端（duān）机械（xiè）的相关信息；“坑人的朋友”是（shì）间谍势力渗入朋友群，通过转介绍企图套（tào）取国家（jiā）机密信息。最后间谍都无一例外被依（yī）法（fǎ）逮捕，作（zuò）品（pǐn）也会根据（jù）用户的选择给出（chū）反奸（jiān）防谍（dié）意识测试结果（guǒ）。

案例名（míng）称（chēng）：消灭全民（mín）公（gōng）敌

案例品牌（pái）：淘（táo）宝（bǎo）特价版

网（wǎng）购盛行，但是陷阱和套路（lù）也很多，淘宝特价（jià）版在故事中（zhōng）化（huà）身江（jiāng）湖侠客，行侠仗（zhàng）义，戳破各（gè）种消（xiāo）费诡计，具象（xiàng）化（huà）购（gòu）物的各种（zhǒng）不良现（xiàn）象，表明自身态度，有针对性的宣传自身优（yōu）势，吸引（yǐn）用户使用。

下（xià）滑浏览长图，内容是（shì）一位婴儿降生，被麒麟（lín）赐予神（shén）秘美玉，长大后行走江（jiāng）湖，看到（dào）村民收到货不对版（bǎn）的物（wù）品，帮助村（cūn）民（mín）赶走旗号为（wéi）“拼”的帮派，看到低价大甩卖，怒揭（jiē）黑心（xīn）商人原价更低的真相，遇到套（tào）路（lù）似迷宫的开业大酬宾，一剑毁掉（diào），又打败了假（jiǎ）装一手货源的中间商，获得群众支持，最后杀掉了（le）集（jí）“假冒”“套路”“高价”“伪劣”于一身的黑心（xīn）头目，完（wán）成使命，屏幕出现“为消费平（píng）权而斗”“为杀（shā）价而生”的标语。

案例名称：灵魂试香纸（zhǐ）

案例（lì）品（pǐn）牌：天猫（māo）

灵魂也是有香气的（de），听起来是（shì）不是很新颖？天猫超级品牌日做品牌（pái）推广，根（gēn）据用户性格测试结果，推荐不同品牌的产品，提高品牌日知名（míng）度，加深用户对（duì）各（gè）大品牌的印象（xiàng），促进消费。

点击标题页（yè）的触（chù）点，开始测试，主题是在一座（zuò）古堡里探险，跟着作品来到不同情（qíng）境，回答相关问（wèn）题，包括是否带上（shàng）舞会面具，对墙上的空画（huà）框做何感想，选择一幅画拖入（rù），来到花（huā）园会如何（hé）摆（bǎi）放花盆（pén），听到受（shòu）伤的猫喊“疼（téng）”第一反应是什么，选择一个传送（sòng）门（mén）结束旅程。输入名字（zì）生成（chéng）海（hǎi）报，包括“你（nǐ）”的灵魂香气形容词，两个关键（jiàn）词和解（jiě）说，主（zhǔ）图，“魂器（qì）推荐”是一件商品，旁侧有具体的商品（pǐn）名称，报头是天（tiān）猫超级品牌日logo与（yǔ）商品品牌logo。

案（àn）例（lì）名（míng）称：壳牌电子会员2周（zhōu）年庆

案例品牌：壳牌

这款H5是由‘壳牌’开发的盘点类H5，旨在通过展现（xiàn）用户与壳牌（pái）的（de）大数据信息，让用户了解（jiě）自己与（yǔ）壳牌的消费记（jì）录（lù），从而宣传品牌信息。进入H5后，出现动（dòng）态横条（tiáo）插画形（xíng）式的主题（tí）‘8月（yuè）壳粉节，2周年’，下面点击启动（dòng）引擎进入游戏；进（jìn）入游（yóu）戏后通过滑动翻页查看各种自（zì）己与壳牌的经历，从认识（shí）到第一次加油，然后（hòu）是最早的加油时（shí）间，最晚的加油（yóu）时（shí）间，去过的壳牌门店；最后形成（chéng）一张发条（tiáo）形（xíng）式的信息展（zhǎn）示（shì）页（yè），可以分（fèn）享到（dào）朋（péng）友（yǒu）圈；再次下滑则会进（jìn）入红包雨游戏中，只有壳牌会员才能参与。

案例名称：成都天府通-年（nián）度（dù）账单H5

案例品牌（pái）：天府通

2019成都公共交通大（dà）数（shù）据报告发布（bù）后，天府通公司正式上（shàng）线年度个人（rén）出行账单查询功能，用户可打开天府通APP，点击首（shǒu）页顶部活动入口（kǒu）即（jí）可查（chá）询到自（zì）己的年度出行账单。

本H5、“公共交通年终总（zǒng）结”的主题更具个性化和趣味性，内容包括用（yòng）户全年的公（gōng）共交通消（xiāo）费、搭乘公交和地铁的“成绩”、最早乘车与（yǔ）最（zuì）晚乘车时间、个人（rén）减碳量（liàng）等数据，直观地反应了用户与城市的密（mì）切互动。

以上就是本期为大家带来H5案例分享，感兴（xìng）趣的朋友可以持续关（guān）注（zhù）我（wǒ）们完美和蓝橙互动官网的新闻动（dòng）态，或是关注完美和蓝橙互动官方微信公众号，我们（men）会不定时向大（dà）家分享最新的优秀案例。

相（xiàng）关（guān）阅读：《精选H5案例（lì）合集分享（xiǎng）-07期》