爱慕先生：是真的！你骨子里竟然这么色

2017-04-06 H5案例分享 H5案例分享

案例：是真的！你骨子里竟然这么色

出品：爱慕先生

亮点：

策划上，交互视频+图文展示。进入页面，有一段引导文案，接着让用户在倒计时5秒钟之内，5个颜色里选出一个喜欢的颜色（倒计时结束也不会发生什么，会卡在1秒）。选择颜色之后，会进入对应的主题部分，在画面中点击提示元素，则开始播放视频。视频播放完毕有一段文案，并提示“点击有惊喜”，点击后出现该颜色的“爱慕先生百搭T”，用户可以“再测一次赢优惠券”，或“进入官网”，还能点击屏幕下方来观看更多颜色。

设计上，画面效果很赞，字体和文案话术都很独特，六边形的设计在视觉上也表现得很舒服。每个颜色对应不同风格不同主题的视频，并且让画面都充满了对应的颜色，虽然为了一个简单的T恤，视频表现显得有点夸张，但正是这种夸张，能吸引人的眼球，并且除了第一选择，用户还可能会想体验一下其他的颜色。在背景音乐上的选择，也能看出制作的用心。

体验上，其实说实话，小编觉得这支H5在体验上有一些问题：①进入案例后，如果横屏放置再竖屏，整个页面显示异常；②原地刷新的话，背景会出现Notice错误提示导致页面结构异常；③虽然有微信授权，却没有提取任何用户信息，因此没有发挥出微信授权的价值，等于说就白白提高了用户退出的几率。（测试环境为iPhone6）。抛开这些可修复的问题，案例的画面和声音表现还是很不错的。

技术实现： CreateJS + jQuery + Video视频

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

识别图中二维码

是真的！你骨子里竟然这么色-查阅二维码

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

标签