又刷屏了,关于《人生必做100件事》H5的一切

网易H5 · 2020-02-25
《人生必做的100件事》凭什么刷爆朋友圈?

编者按:本文来自微信公众号“网易H5”(ID:wangyih5),36氪经授权发布。

作者 | 玖柒&蕉十五

编辑 | 玖柒

这两天,很多人都在朋友圈晒出了《人生必做的100件事》。

又刷屏了,关于《人生必做100件事》H5的一切

从2月21日晚上6点至今,这个H5点击量达到2300万,同名微博话题也有2400万阅读。

又刷屏了,关于《人生必做100件事》H5的一切

“一辈子很短,要把时间花在有意义的事上。”

忙碌的生活让人们忘记时间的流逝,繁琐低效的生活很容易让人们丧失热情。

而这支H5,点燃了大家对生活的热情,对自己的人生有了新的期待。

网易哒哒也再一次证明:

H5依旧是刷屏利器。

我们采访了哒哒的策划同事,全面还原这支爆款H5的一切,相信可以带给你不少启发。

01.H5的创意思路

一开始,网易哒哒就把H5的选题方向定在“清单”类内容,打算做一个让大家都能参与进来、并且都愿意分享的H5。

按照这个思路去找能覆盖更多人、与大家生活强相关的选题,于是又将思路细化为“人生清单”。

接下来需要对选题是否具有讨论度进行验证。

在搜索的过程中,哒哒团队看到很多关于“人生必看的100本好书”、“人生必看的100部高分电影”、“100条遗愿清单”、“100件情侣必做的小事”这类完成事项的选题热度颇高。

又刷屏了,关于《人生必做100件事》H5的一切

把清单内容框定为100件事,比单纯的“人生清单”更加具体,又能在数字上产生更明显的差异化,所以最后就将主题定为《人生必做的100件事》。

总有人认为,自己还年轻,什么事都还早,殊不知时间就是这样一点点在流逝。

现在,《人生必做的100件事》来提醒你:你还有很多事没做过。

有的人说,这支H5是在给我们的人生设限,其实不然。

人生并没有限制,哒哒团队只是把大家对人生的经历和憧憬单独拿出来,汇总成“可供参考的人生”。

当你在观看别人的人生时,也是在回忆自己的生活。

你会因为想到,自己曾错过一场校园恋爱而遗憾;也会想起和喜欢的人用一个耳机听歌时的脸红心跳。

你以为的平淡生活,其实挺有意义。

02.内容筛选

100件事的筛选,可以说是整个H5策划中最艰难的一步。

网易哒哒的策划团队,在各种网站上筛选了大量的资料,调研更多人认为的“人生必做的事”。

然后是内部反复投票,让大家选出“最想做的”、“最遗憾的”、“最没感觉的”。

一遍遍的筛选,花费了不少时间。

牵动情感,用户强相关

由于是“人生必做的100件事”,过于小众和个性化自然不行,这些选项应该上覆盖更多普通人,有很多人经历过、憧憬过、遗憾过的事。

还有一些事相对而言比较普通,比如带隐形眼镜、打耳洞等,虽然很多人经历过,但是没什么意义,不能联系到什么情感和回忆。

所以这类选项也pass掉。

而跟我们绝大多数人相关的,容易牵动我们情感的事情,大多与亲情、爱情、友情、梦想有关。

于是就有了“拍一次全家福”、“遇到过令你心动的人”、“与朋友彻夜谈心”......

有网友开玩笑说,这“人生必做的100件事”都是需要钱来完成。

如果真是事事都要雄厚的经济实力,那不如叫“人生做不到的100件事”好了。

“用第一笔工资给父母买礼物”、“给未来的自己写封信”、“ 对家人说我爱你”...... 

这些都是再普通不过的人生活中的小确幸,没有任何门槛,但又意义非凡。

而还有一些事,是只有在特定的年龄段才会发生,一旦错过,就再也回不去了。

“谈一场校园恋爱”、“邀请亲友参加毕业典礼”......这些没做过,看到就会觉得遗憾。

遗憾 、回忆、感动、启发,这些小小的情感牵扯着我们的心,也让大家对这支H5抱有了别样的感情,也更愿意通过分享它来表达自己。

放宽参与程度

考虑到H5的可玩性,不能把事情都设定的太难完成,也不能都太容易完成。

为了防止大家对事件选项的理解不同,文案上会具体落到某件事,也会尽量的放宽参与要求,让大家能够获得更多的满足感。

比如“(曾经/正在)和宠物一同生活”这一条。

如果只是“养一只宠物”,那么一些曾经养过宠物、现在没有养宠物的人可能就会忽略这个选项。

而“曾经和宠物一同生活”,则会唤起很多小时候养过宠物的人的童年回忆。

一些本该被忽略、以为自己没做过的事情,通过放宽的具体描述,可以让很多人想起“啊我原来是做过这样的事的”,能够牵动大家的回忆。

03.视觉设计

整体画风

图案、颜色、文字所呈现给用户良好的视觉印象,能够轻松抓住用户的注意力。

《人生必做的100件事》开屏即是醒目的哒哒黄。

高饱和度的黄色代表着活泼与生机,整支H5色彩鲜艳,传达出的感情丰富多彩,带给人视觉上的动感与张力。

又刷屏了,关于《人生必做100件事》H5的一切

扁平化的插画画风高级但不幼稚,大面积的色块简约直观,尽显摩登与时尚感。

为了确定整支H5的设计风格,设计师多次尝试不同风格的插画,每张插画都与策划及时沟通。

在确认每张画的呈现内容和画面构图之后,再进行下一步的绘制。

哒哒团队希望用精美的图画语言来表现必做之事,所绘制人物时线条柔和,抽象但有韵律,两位设计师加班加点绘制了一周多,才完成100张插画的最终设计。

在上线前,由于封面动画效果,H5加载渲染时间需要约5秒,但为了让参与者立即打开H5,最终上线版本还是减掉了H5封面的动画渲染,保证1秒内可以打开H5。

结果页要素

H5的结果页,要能让用户一眼就牢记主题。分享在朋友圈中,精致的结果页也不会失了逼格,更容易吸引用户的目光。

最近,大家总是觉得朋友圈不够刷,希望好友们多发朋友圈,给无聊的自己找到一些乐趣。

这时,分享一张好看的图片到朋友圈,更是收获点赞的好方法。

考虑到100件事的数量,如果单纯地用文字来排列组合成一张海报,未免会有些乏味,视觉上也很难构成强烈的冲击。

因此,哒哒把100件事做成图画。

用户在选择必做之事时,脑海中会不自觉陷入当时的回忆中,对自己的必做之事有一个心理预期。

当他们看到图画版的必做之事时,也会有一种熟悉的既视感,唤起情绪共鸣。

结果页中,最亮眼的地方就超大的数字:已完成的数量。

丰富的图画给予用户视觉上的美感,而数字则能直观地刺激到用户心理。

放大的数字突出完成的数量,具有强烈的社交属性,用户的窥探、羡慕和比较情绪由此而生。

04.交互设计

“傻瓜”式的交互玩法, 比起复杂炫酷、不知道从哪下手的交互设计更讨人欢心。

哒哒这次依然使用了简单的交互手势,以保证每个人迅速上手,操作体验更加流畅。

不止如此,一贯严格把控细节和用户体验的哒哒,在交互上还隐藏着种种小心思。

抛弃列表点选,改用弧形滑选

不同于列表排列的flag,H5大胆进行了滑动点选的设计,选择页面就像转盘一样可以360°自由滑动。

又刷屏了,关于《人生必做100件事》H5的一切

考虑到100件事的数量,清单选择型的文字排版很有可能让人看得眼花缭乱,划不到底,即使对主题感兴趣,也不一定能够耐心看完。

而环状的排列方式,每组滑到用户屏幕中的选项不超过5个,一共滑动20次左右,保证用户能够看清每件事,并且不会感到烦躁。

搭配清新的音乐节奏,将原本繁多的事项拆分成流星一般,整体感觉十分治愈。

调整事件顺序

在选择页面中,用户点击的顺序对应结果页呈现的位置。用户选择的必做之事越多,海报也会越长。

如果用户想将点击靠后的选项提前,用户可以在H5的右上角处的“收藏夹”里,拖动该选项的位置。

又刷屏了,关于《人生必做100件事》H5的一切

哒哒观察到,很多用户都有着选择困难症,机会在手时总会犹豫不决。

而每位用户在选择必做之事时标准不同,很有可能当时脑子灵光选择的某个选项,之后又开始后悔自己的手太快。

考虑到用户会有反复修改选项的需求,H5从用户体验出发,可以更改事件的位置,给予用户极大的DIY权利,以得到专属自己的个性化结果。

自定义姓名

还有一个最容易被忽略的小细节。

很多H5为了方便用户使用,常会出现自动调取微信头像、名称的情况。

这种“授权调取”的行为,其实藏着很多尴尬。

当海报分享到朋友圈时,如果顶着沙雕网名,或者一串谁都看不懂的文字/符号,去完成人生必做的100件事,总感觉不够应景。

为了避免尴尬,哒哒这支H5选择只读取头像,名字由用户自定义。

任何刷屏作品背后,都是对生活和情感的深刻洞察。

希望《人生必做的100件事》能够重新唤起大家对生活的期待,等到疫情转好之后,我们才能真正的走出家门,去完成这些“必做的事”。

+1

好文章,需要你的鼓励

参与评论
登录后才能参与讨论哦...
后参与讨论
提交评论0/1000

请回复有价值的信息,无意义的评论将很快被删除,账号将被禁止发言。

下一篇

“云游戏”还是“云网吧”,在备受关注的行业新热点中,有些人是否正走在错误的道路上?

2020-02-25

36氪APP让一部分人先看到未来
36氪
鲸准
氪空间

为你推送和解读最前沿、最有料的科技创投资讯

一级市场金融信息和系统服务提供商

聚集全球最优秀的创业者,项目融资率接近97%,领跑行业