淘宝:淘宝回忆杀

2021-12-06 H5案例分享 H5案例分享
淘宝:淘宝回忆杀


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

识别图中二维码

淘宝回忆杀-查阅二维码

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


案例:淘宝回忆杀

品牌:淘宝

技术实现: HTML5

亮点:

1.创意定位

淘宝在2021年12月初推出的,以“淘宝回忆杀”为主题的数据类H5创意作品。入口为在淘宝APP搜索“淘宝回忆杀”。通过用户注册淘宝APP的时间,生成相关回忆记录,最后生成“证书”,为2021年双12进行预热和引流。

 

2.策划逻辑

主要策划流程:① 主题页(授权) → ② 若干数据动态海报 → ③ 结果海报 → ④ 分享/漂流瓶。

 

① 主题页:以老电影的形式,展现主题:我和我的淘宝,需要用户勾选“同意淘宝查询并统计我的淘宝购物订单”,用户可以点击“查看授权协议”,点击“立刻观看电影首映”,通过摄像机动画“过渡”,进入若干数据海报页;

 

② 若干数据动态海报页。根据用户曾经在淘宝的消费记录,生成的若干带有数据的动态视觉海报,滑屏切换。最后,生成一个“淘宝12.12”的信封,点击信封,即进入结果海报页。

 

③ 结果海报页。根据用户注册淘宝的年限,生成证书。包含用户姓名、注册时间、有效期,以及荣誉称号、与淘宝携手走过的年限、订单笔数。

 

④ 分享/漂流瓶。海报结果页底部有两种交互选择,一是分享,用户可以方便分享到微信、QQ、微博和钉钉。一是漂流瓶,点击后,跳转淘宝漂流瓶页面。

 

3.视觉交互

为映衬“回忆杀”主题,视觉方面采用了仿旧老电影的形式,主视觉采用淘宝橙的变色。交互主要采用上滑屏、点击等形式。

 

4.用户体验

数据类H5,门槛是拥有用户的数据,并用合理的形式展现出来。淘宝回忆杀,通过用户授权的方式,调取了小五14年的数据,很多记忆确实都模糊了,看到后,确实有些暖暖的味道。

 





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

标签

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

相关推荐:

淘宝X妙啊工作室:猜你喜欢

淘宝:去发现真相

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~