优衣库:优衣库

2019-04-17 H5案例分享 H5案例分享
优衣库:优衣库


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

识别图中二维码

优衣库-查阅二维码

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


案例:优衣库

品牌:优衣库

亮点:

  1. 创意定位

优衣库制作的在线推荐牛仔裤的H5作品,用户选择自己的性别,身高和体重后,生成推荐结果,有六个模特效果图可供切换查看,用户可直接点击购买和参与抽奖,以此宣传优衣库的新款裤子系列。

 

  1. 策划逻辑

加载完毕后,主界面写着“裤型研究所,即将为您解锁专属版型”,屏幕中间是优衣库的LOGO,三秒左右后自动进入主题,①性别选择,选择完毕后点击“下一步”。②上下滑动左侧触点选择身高,左右滑动下方触点选择体重,然后点击“下一步”。③穿着场景二选一,女生是“走在流行前端”和“经典百搭”,男生是“休闲约会”和“开会通勤”。在此界面也可点击“上一步”重新选择性别和身高体重。④进入结果界面,屏幕上方有分析结果“XXXX就是我”,屏幕中间是模特图,图片旁有此款裤子的简介,包括版型和适合场合,点击右边的“换个裤型”可切换造型图,点击下方指纹键图案可分享此作品,也可以选择“参与抽奖”和“立即购买”。

 

  1. 设计上

作品简短易操作,简单选择后即可生成结果,画面颜色很浅,只有重要文字是红色,字体也较小并不乍眼,符合优衣库一贯的简约风格。

 

  1. 体验上

在线即可查看新款裤子,版型和颜色都很丰富,有喜欢的赶紧去店里试穿一下吧!



技术实现: jQuery+iScroll



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

标签

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

相关推荐:

UNIQLO优衣库:温暖黑科技实验室

Uniqlo优衣库:Life Wear 服适人生

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~