优衣库:优衣库
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要1分钟
案例:优衣库
品牌:优衣库
亮点:
- 创意定位
优衣库制作的在线推荐牛仔裤的H5作品,用户选择自己的性别,身高和体重后,生成推荐结果,有六个模特效果图可供切换查看,用户可直接点击购买和参与抽奖,以此宣传优衣库的新款裤子系列。
- 策划逻辑
加载完毕后,主界面写着“裤型研究所,即将为您解锁专属版型”,屏幕中间是优衣库的LOGO,三秒左右后自动进入主题,①性别选择,选择完毕后点击“下一步”。②上下滑动左侧触点选择身高,左右滑动下方触点选择体重,然后点击“下一步”。③穿着场景二选一,女生是“走在流行前端”和“经典百搭”,男生是“休闲约会”和“开会通勤”。在此界面也可点击“上一步”重新选择性别和身高体重。④进入结果界面,屏幕上方有分析结果“XXXX就是我”,屏幕中间是模特图,图片旁有此款裤子的简介,包括版型和适合场合,点击右边的“换个裤型”可切换造型图,点击下方指纹键图案可分享此作品,也可以选择“参与抽奖”和“立即购买”。
- 设计上
作品简短易操作,简单选择后即可生成结果,画面颜色很浅,只有重要文字是红色,字体也较小并不乍眼,符合优衣库一贯的简约风格。
- 体验上
在线即可查看新款裤子,版型和颜色都很丰富,有喜欢的赶紧去店里试穿一下吧!
技术实现: jQuery+iScroll
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号