你会有个什么系的娃?

2018-01-22 H5案例分享 H5案例分享
你会有个什么系的娃?


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

识别图中二维码

你会有个什么系的娃?-查阅二维码

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


案例:你会有个什么系的娃?

出品:

制作:CCTV中文国际频道

亮点:

  1. 策划上,问答类,加载完成后进入问题页面,点击“挖掘一下”,开始回答问题, 有“你是什么星座?”,“你出场时候自带的BGM是哪首?”,“困扰的时候你的头会有几个大?”,“你想追求的是?”等共5个问题。答完后即可生成答案,可长按保存图片,也可以进行分享。
  2. 设计上,采用黄色为主色调,清亮明快,最开始是刷屏的弹幕形式,搭配欢快的音乐,整体呈现出一种轻松感。
  3. 交互上,问题的回答是屏幕的点击,时光瓶的打开时上划屏幕,均比较简单。
  4. 技术上,使用了hammer.js触屏设备手势库,实现了最后一页向上滑动打开时光瓶的效果。
  5. 体验上,动画不是很多,页面整体的颜色主要是黄色和黑色,稍显单调。音乐时长的选择不合适,有点短,感觉回答问题的过程音乐已经重复数次。

(以上均为个人意见,谢谢)



技术实现: hammer.js+vue.js



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

标签

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

相关推荐:

CCTV-9:CCTV-9带你感知自然的魅力

CCTV:你有料吗?

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~