天猫：你的元气Boy

2018-04-12 H5案例分享 H5案例分享

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

识别图中二维码

你的元气Boy-查阅二维码

完整欣赏此案例大约需要40秒

案例：你的元气Boy

出品：天猫

亮点：

策划上，首先看到的一个界面是易烊千玺的招聘，大字是本h5的主题名，点击下方的一探究竟，进入下一界面；进入的是天猫搜索结果界面，关键字是易烊千玺的绰号和别名，每个图片下方配上文字描述和收藏量，是模仿天猫商品详情制作的；按照提示点击其中一张图片，会在图片的位置加载出一个短视频；当点击完当前界面的图片后，会提示下拉进入下一个界面，点击屏幕中间位置，所有的图片会合成出一个新的全屏短视频，视频内容是天猫21天元气计划；之后跳入最后一个界面，点击下方的去扩散，可以分享链接给朋友。
设计上，模仿天猫商品界面，创意新颖；画面干净，色彩搭配舒服；图片转换成短视频的创意很好。
体验上，找小鲜肉易烊千玺代言，对于宣传效果有很大的影响；操作简单，加载流畅，内容简单。

技术实现： jquery,zepto.js,

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

标签