最近双十一大战已经开启
如火如荼的点赞PK在社群里肆意散播
每年十一月天猫双十一
已成为各位剁手党最大的节日
今天的案例分析不是双十一
而是天猫H5关于十年后的你！
你会是什么样子？
你知道嘛？
不知道的话就先来测一测吧
天猫：我在这里遇见了十年后的自己
创意分析：
由一辆时光列车为由头，带着用户前往4个明星的时光空间，并由明星的时光空间引出一个问题，用户需要回答问题结束旅程抵达未来，在终点站会有关于十年后你的描述。
技术分析：
由时光列车串联了4个明星的时光空间，在那里明星会说一件自己十年来坚持的事情，之后便由此向用户提出一个问题，增加用户的带入感。在用户穿梭完毕所有的时光空间后，便将抵达十年后的终点站，在终点站，H5根据用户的答题结果，会给用户匹配一段对用户十年后的描述，用户可以保存分享。3D车厢、3D的时光空间，整各时光之旅的真实性很高，代入感也很强。列车行进的过程中，窗外的景色和光影效果都做的十分精致。
视觉分析：
色彩效果丰富，整体的画面非常精致，就是难免在穿梭的过程中有一些重复交互，列车行进的部分会拖慢整体的节奏。进入每一个人物场景时，场景都是符合该人物的风格，回答的问题也是符合人物形象的。
京东x奥克斯空调：天气渐凉，街上擦肩而过的，都是哪种暖男？
创意分析：
创意定位，天气渐凉，这支H5将“暖男”与物理上的“暖”相结合，推广品牌商品。男女生分角度分析，男生的角度是你是什么类型的暖男，女生是你适合什么类型的暖男。通过代入感的答题方式，结果生成适合你的品牌产品，还是很贴心的。
技术分析：
策划上，通过答题+长图的方式，测试“你是什么类型的暖男”或者“你适合什么类型的暖男”。①进入H5之后，先选择男女，男性选择“测测你是哪款暖男”，女性可以选择“测测你适合哪款暖男”。②选择之后，进入答题测试页面。整个答题页面是一张长图，长图的主要内容是街道及两边景色。③根据用户选择的性别，会有一个相应的人物形象走在街道上，没走到一个场景，会有与该场景相关的问题弹出。④用户答完所有问题后，出现测试结果。根据测试结果，H5会为用户推荐相关的奥克斯空调机型。用户长按可以保存测试结果页面，也可以分享给朋友或者直接进入购买页面。
视觉分析：
色调上以暖色调为主，对应主题。设计上，长图采用卡通手绘风格，十分有质感。人物沿着街道出现问题，对应问题的卡通人物图片也与问题相呼应。答题测试型H5，问题都是比较新颖。
网易考拉X我就是演员：
5道题揭秘你的真实职场人格
创意分析：
由热播综艺引出测试主题——职场人格测试，通过面试中可能遇到问题测试用户的职场人格，并且用出品公司作为测试题的面试情景，以此达到宣传目的。角色分为男生和女生，相同的场景测试，每一个问题都细节化，最后生成的性格分析描述的还是很详细的。
技术分析：
与实景视频结合的情景答题形式，整个答题过程中题目是连贯的，按照一个面试的过程来植入测试题，这道题选择完毕后便会继续播放视频内容，直至下一题。视频答题交互的方式，很有代入感，最后生成的性格海报加上品牌活动的优惠券，还是很吸引人的。
视觉分析：
简约的性冷淡风格，灰色为主色调，整个页面非常高级且正式。整体的形式很棒，测试题是一个连贯的情景，代入感很强，页面的设计和视频部分的画质都很好，使整个作品显得很高级。
自如：自如生活节，约你花式发光
创意分析：
策划上，以“反转人生”为出发点，如果，你可以拥有你想拥有的东西，或者生活方式，当你真的拥有了，是否如你想的那么美好嘛。在这支H5中，做了6种如果，如果你想拥有茂密的头发，如果你想整体无所事事，如果你想过上天天数钱的日子，如果你想成为一名有格调的艺术家，如果你可以去骑行看看外面的世界，如果你可以不问世事隐居室外，最后给出与其幻想未来，寻找自己的发光点。结尾给出6个人物角色，点击人物以后，生成一张人物的海报。
技术分析：
设计上，扁平颗粒度风格，插画人物和景物。技术上，pixi进行景物和人物的绘制，配合Tween.js实现动画效果。
视觉分析：
色调上颜色比较丰富，手绘动漫风格，整个滑动动漫剧情效果还是很逗趣的。体验上，锁屏横屏观看，不断向右侧滑动浏览更多内容。案例整体节奏不错。
掌阅：测一测，你是书里的谁？
创意分析：
创意上，围绕着“在书里遇到另一个自己”展开。以进入图书馆场景后根据每一步的场景进行答题选择，每一个问题
技术分析：
策划上，虚拟了一个线上书店，在这个温馨的书店里，通过书店的浏览过程中，出现4个问题，每个问题四个答案，挑选一本心怡的书，点一杯饮品，邂逅一个喜欢的人，给未来的自己寄一张明信片。通过你与场景发生的互动记录你的性格和情感观，匹配一个来自不同书中的专属角色。
视觉分析：
色调上以暖色调为主，设计上，扁平画风。体验上，横向长图，无论横屏还是纵屏，都可以保存横向观看。
十年后
或许你已经成为你想成为的人
过着你想过的生活
也或许还在奋斗的过程中
一切都不必太过着急
毕竟成长的路上
除了你付出的所有的努力
其他的就交给时间吧~
猛戳下图定制专属创意H5
猛戳下图浏览更多创意H5案例
更多创意H5解析
请关注H5创意汇
每周为你解析最热门H5案例
