春光裡照相馆：春光裡照相馆

2017-05-10 H5案例分享 H5案例分享

案例：春光裡照相馆

出品：春光裡照相馆

亮点：

策划上，图文展示类，① 首屏展示了春光裡照相馆拍摄的证件照作品，用精良的作品吸引用户目光；② 接着是截屏赢优惠，不断变化的屏幕，拿起手机使用截屏有机会截取到优惠价格；③ 保存截屏后预约到店，进行拍摄时可以现金抵扣；④ 最后关注其公众号，并展示了该照相馆可拍照片包括证件照、新婚照、履历照、私人订制等。
设计上，小清新风格，采用薄荷绿作为主色调，背景是在贰元纸币的基础上进行创新而来的，在第二屏快速变换的证件照里还有萌哒哒的小动物，使页面变得更加有趣。
技术上，滑屏切换采用的是JS滑屏组件Swiper，第二屏中快速变换的证件照采用的是GIF动图，证件照下方快速变化的数字序列号是采用setInterval定时器 + random随机数来实现的。

技术实现： jQuery + Swiper

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

识别图中二维码

春光裡照相馆-查阅二维码

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

标签