三体×长安汽车: 面壁者招募计划
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要2分钟
案例: 面壁者招募计划
品牌:三体×长安汽车
技术实现: HTML5
亮点:
1.创意定位
《三体》联合长安汽车推出闯关H5创意作品。结合《三体》内容和长安汽车,共设置了5关闯关,让用户在烧脑和交互的过程中,体验三体的魅力和长安汽车产品,达成品牌和IP传播和曝光。
2.策划逻辑
大致逻辑:Loading→ 主题页 → 5关闯关 → 上传头像、昵称 → 生成海报。
Loading部分:用代码闪屏+文案引导,营造高科技感。
主题页:露出品牌(三体、长安汽车)和活动主题——面壁者招募计划。点击「拯救人类靠我了」,进入闯关部分。
5关闯关:第一关:知识是探索科技的基础。还原地球、火星、木星和海王星的位置顺序。第二关:敏锐是获取先机的条件。按提示还原一个宫殿地图拼块。第三关:勇气是突破困局的品性。汽车躲避障碍小游戏。第四关:智慧是陪伴前行的伙伴。五句话连线。第五关:信念是文明长安的倚靠。六选三,选出信念关键词。点击确定,进入头像页。
上传头像、昵称:可以上传一张照片,输入昵称,点击把数据输入钥匙,进入生成海报环节。
生成海报:成功加入面壁者计划通知海报。
3.设计交互
以宇宙暗黑为主色,植入三体元素、长安汽车品牌元素。每关设计不同的交互方式,主要包含:点击、拖动、连线、输入、上传照片、长按图片保存等。
4.用户体验
闯关还是有一定难度的,第一题相信就能卡住很多人。八大行星顺序,小五相信很多人不一定一下就能想起来。
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号