三体×长安汽车: 面壁者招募计划

2022-12-26 H5案例分享 H5案例分享
三体×长安汽车: 面壁者招募计划


案例演示,请长按/扫描以下二维码 ->

识别图中二维码

 面壁者招募计划-查阅二维码

完整欣赏此案例大约需要2分钟


案例: 面壁者招募计划

品牌:三体×长安汽车

技术实现: HTML5

亮点:

1.创意定位

《三体》联合长安汽车推出闯关H5创意作品。结合《三体》内容和长安汽车,共设置了5关闯关,让用户在烧脑和交互的过程中,体验三体的魅力和长安汽车产品,达成品牌和IP传播和曝光。

 

2.策划逻辑

大致逻辑:Loading→ 主题页 → 5关闯关 → 上传头像、昵称 → 生成海报。

 

Loading部分:用代码闪屏+文案引导,营造高科技感。

 

主题页:露出品牌(三体、长安汽车)和活动主题——面壁者招募计划。点击「拯救人类靠我了」,进入闯关部分。

 

5关闯关:第一关:知识是探索科技的基础。还原地球、火星、木星和海王星的位置顺序。第二关:敏锐是获取先机的条件。按提示还原一个宫殿地图拼块。第三关:勇气是突破困局的品性。汽车躲避障碍小游戏。第四关:智慧是陪伴前行的伙伴。五句话连线。第五关:信念是文明长安的倚靠。六选三,选出信念关键词。点击确定,进入头像页。

 

上传头像、昵称:可以上传一张照片,输入昵称,点击把数据输入钥匙,进入生成海报环节。

 

生成海报:成功加入面壁者计划通知海报。

 

3.设计交互

以宇宙暗黑为主色,植入三体元素、长安汽车品牌元素。每关设计不同的交互方式,主要包含:点击、拖动、连线、输入、上传照片、长按图片保存等。

 

4.用户体验

闯关还是有一定难度的,第一题相信就能卡住很多人。八大行星顺序,小五相信很多人不一定一下就能想起来。





以上为“H5案例分享”团队原创文章,转载请注明出处!

标签

分享:
海报
案列链接
下载截图
收藏案例
已收藏
分享到微信朋友圈
打开微信,点击底部的“发现”,
使用“扫一扫”即可将网页分享至朋友圈。

相关推荐:

网易云音乐×syoss:是谁狠狠emo住了?快「桃」

顾家家居:小王子睡眠答案之书

关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

对汉语支持不错,别对小五说英文

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~