火山小视频:声音解码器

2019-04-09 H5案例分享 H5案例分享
火山小视频:声音解码器


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

识别图中二维码

声音解码器-查阅二维码

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


案例:声音解码器

品牌:火山小视频

亮点:

  1. 创意定位:火山小视频联合《歌手》推出的测试类的H5,测试你的歌手cp音是哪位明星。

  2. 策划上,①首先标题是“测一测谁是你的《歌手》cp音?”,下方输入昵称,选择性别,点击右下角“声音解码”按钮,②会随机抽取一段话,点击开始录音,朗诵或吟唱这段话(时长不低于5秒)。③最后生成一张属于用户的声音解码报告,有与你一同的cp歌手,并搭配着一首专属歌曲,下方有两个按钮,“再测一次”和“分享一下”。

  3. 设计上,采用蓝色作为主色调,橙色作为辅色调,并以画满线条的格子线条做背景,很炫的色彩。

  4. 体验上,操作简单,很单调的一个小测试,添加一点背景音乐就好了(一加手机上加载有些慢)。



技术实现: jQuery swiper vue zepto layerjs



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

标签

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

相关推荐:

火山小视频:火山年度报告

芒果TV:洪老师@你并送你《歌手》珍藏版免费黑胶唱片

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~