知乎 X 太古里：不知道诊所，专治不懂！

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

案例：不知道诊所，专治不懂！

出品：知乎 X 太古里

亮点：

策划上，长图类，① “不知道诊所”营业中，专治各种不懂，点击视频，先简单了解一下知乎开的“不知道诊所”；② 而后上滑来到依次来到外科、口腔科、心理科、放射科、五官科、内科、和发烧科，了解了“又没衣服症” 、“59分吃货症”、“久丧不愈症”、“镜头恐惧症”、“影评症”、“不学习空虚焦虑症”和“黑科技狂热症”；③ 最后获知创意体验馆专家门诊的时间地点安排，点击预约体检或者点击一直固定在屏幕右侧带有“立即预约体检”标签的小瓶子填写自己的姓名昵称，选择要预约的科室，即可生成体检预约单，也可邀请好友来治疗；生成体检预约单可长按保存哦。
设计上，漫画风格，采用蓝色作为主色调，里面的人都小小的，很可爱；每个科室用不同形状的各班隔着，形成一个个独立的小空间，但又用一条弯弯曲曲的路将其串联起来，形成整个繁华热闹的体验馆场景。
技术上，长图上下滑动采用的是移动端滚动插件iScroll，适配主要是采用阿里团队开源的一个库flexible.js。

技术实现： jQuery + iScroll + flexible.js（移动端自适应JS库）

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

识别图中二维码

不知道诊所，专治不懂！-查阅二维码

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

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

标签