豆瓣:我去2000年

2019-12-20 H5案例分享 H5案例分享
豆瓣:我去2000年


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

识别图中二维码

我去2000年-查阅二维码

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


案例:我去2000年

品牌:豆瓣

技术实现: jquery + jquery.fullpage.js

亮点:

  1. 创意定位

豆瓣推出的怀旧类型的作品,对比2000年和2019年的流行缩影,最后生成2000年个人报告。

 

  1. 策划逻辑

作品主要有三个环节

 

①漫画导入

标题闪动,上滑屏幕,欣赏导入漫画,每幅漫画都搭配有关于怀念时光的文字。

 

②情景回顾

点击触点,“穿越”回2000年,在每个场景点击发光物品,回顾儿时经历,主要情节包括:点击电视机遥控器,桌上出现大白兔,电视播放《还珠格格》,脚步声响起后赶紧关电视,把零食换成作业;点击包装盒,出现随身听,还有周杰伦的磁带,课本上出现杜甫;点击生物书,出现那位肌肉发达的女士的插图;QQ聊天界面,点击企鹅图标,流行词一行行出现;点击书本,当年的流行小说和百科全书出现。

 

③落地海报

一段关于豆瓣话题的展示后,是当年和现在的流行对比,最后点击触点,选择三个最能代表自己的2000年的物件,输入名字,生成“我去2000年个人报告”,包括关键词和解析,最后用户可生成小图或重新测试。

 

  1. 设计上

手绘的简单卡通画,抓住了2000年经典场景和物品的精髓,细节十分到位,当年的装修风格,老式座机电话,电视停台时的彩色地球,周杰伦的磁带封面和《可爱女人的》歌词,韩寒的《三重门》等当年传阅率最高的小说等,处处有亮点,回忆的共鸣十分强烈。

 

  1. 交互上

由于与年龄碰撞时间不同,八零后和九零初的共鸣会强烈一些,很有意思的小作品,非常丰富真实的还原了当年的各种细节。





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

标签

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

相关推荐:

网易新闻:20年,澳门印记

携程×豆瓣:寻找旅行栖息地

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~