网易新闻:查看你的隐藏星座
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要4分钟
案例:查看你的隐藏星座
品牌:网易新闻
技术实现: createjs + zepto
亮点:
- 创意定位
网易新闻出品,总结成长之路,用户一边浏览长幅画作,一边回答问题,生成自己的隐藏星座海报。
- 策划逻辑
整个作品是一段治愈系的长幅画作,用户下滑屏幕浏览,一段段文字在画作中浮现,总结成长之路,当中穿插了若干成长道路上的问题,用户输入自己的答案即可,概况如下:
- 星辰降落
滑动屏幕,一颗星辰落在地球上变成一个红衣小孩,用户输入名字,小孩就代表了自己,小孩经历了被妈妈第一次唤名,在妈妈的摄影胶片中喝奶,玩耍,学习,长大,有了自己的梦想,用户在此需要问答选择题——小时候的梦想。
- 历炼成长
小孩在浩渺星空中遨游,遇到另一个TA,怦然心跳,用户此时需要回答和恋人最常去的约会地点,小孩意识到自己需要努力长大,经历高考,用户再次回答高中时最不擅长的科目,小人意识到自己的平凡,开始了远航,在大学中磨炼,经历了交友和毕业,用户需要回答第一份工作在哪个城市,最晚一次下班的时间,印象最深刻的三个城市。
- 落地海报
测试完毕,海报自动生成,包括用户名,隐藏星座,星座图,星座关键词和解析,下方是出品方名字,用户可重新测试或分享作品。
- 设计上
加载界面是一个红衣小人抱着小星星站在小小的星球上,让人联想到“小王子”,星辰降落地球的人物设定很温情纯真,图画和文字风格都很治愈,富有童趣,内容也比较符合大多数人生活上与心理上的成长之路。
- 交互上
下滑屏幕推动作品展开,停止下滑时界面也停止变动,用户可仔细浏览文字,也可上滑让作品倒退,重新浏览。
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号