天猫超级品牌日&哒哒:滚蛋吧,失眠君

2019-03-22 H5案例分享 H5案例分享
天猫超级品牌日&哒哒:滚蛋吧,失眠君


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

识别图中二维码

滚蛋吧,失眠君-查阅二维码

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


案例:滚蛋吧,失眠君

品牌:天猫超级品牌日&哒哒

亮点:

1.创意定位

这是天猫超级品类日与网易哒哒工作室联合推出的宣传H5,以世界睡眠日为由头,邀请用户找出失眠原因,宣誓要睡个好觉,并借此宣传天猫超级品类日的床垫活动。

 

2.策划上

①整个H5采用走心的文案配图,将当代年轻人日常失眠的情形展现得淋漓尽致。进入H5后,一段导语点出世界睡眠日这个节点,并且询问用户是否也在失眠。用户根据提示点击画面,便开始了一段动画,动画配合着简单又戳人的文字展现了几个深夜无眠的年轻人。②动画用一镜到底的手法,从讲述页面自然地过渡到了交互部分。交互部分邀请用户找出自己失眠的理由。用户需要在给定的选项里选择自己的失眠理由,此处的选项如果不够,用户还可以自己填写失眠理由。填好失眠理由,点击下一步后,页面文案又引导用户暂时忘记烦恼一起告别失眠,并署名宣誓。③填写好姓名和性别后,进入尾页也是海报页。页面写出了用户的宣誓词,还有用户是第多少个宣誓者,这个页面用户可以长按保存分享出去。值得注意的是,为了突出作品的公益性,尾页的页面高度高于手机屏幕,用户需要再进行一次下滑才能看到跳转到天猫的按钮。

 

3.设计上

偏扁平的漫画风格,类一镜到底的展现形式,整体设计十分用心,比如音乐开关按钮的设计是用月亮和睡眠符号Z结合,非常应景。

 

4.体验上

作品加载速度快,观看流畅,页面设计精美,并且立意很好。整个作品的制作非常用心,不仅从页面设计到文案策划都很走心,用户填写昵称的地方还做了屏蔽词,要求用户填写较为真实的昵称,随便填写的话会要求用户换一个昵称。

 



技术实现: html5



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

标签

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

相关推荐:

天猫:翻开人生的另一面

网易哒哒×一汽马自达:2019,在哪儿过年?

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~