考虑到 100 件事的数量,如果单纯地用文字来排列组合成一张海报,未免会有些乏味,视觉上也很难构成强烈的冲击。
因此,哒哒把 100 件事做成图画。
用户在选择必做之事时,脑海中会不自觉陷入当时的回忆中,对自己的必做之事有一个心理预期。
当他们看到图画版的必做之事时,也会有一种熟悉的既视感,唤起情绪共鸣。
结果页中,最亮眼的地方就超大的数字:已完成的数量。
丰富的图画给予用户视觉上的美感,而数字则能直观地刺激到用户心理。
放大的数字突出完成的数量,具有强烈的社交属性,用户的窥探、羡慕和比较情绪由此而生。

“傻瓜”式的交互玩法, 比起复杂炫酷、不知道从哪下手的交互设计更讨人欢心。
哒哒这次依然使用了简单的交互手势,以保证每个人迅速上手,操作体验更加流畅。
不止如此,一贯严格把控细节和用户体验的哒哒,在交互上还隐藏着种种小心思。
| 抛弃列表点选,改用弧形滑选
不同于列表排列的flag,H5 大胆进行了滑动点选的设计,选择页面就像转盘一样可以360°自由滑动。
考虑到 100 件事的数量,清单选择型的文字排版很有可能让人看得眼花缭乱,划不到底,即使对主题感兴趣,也不一定能够耐心看完。
而环状的排列方式,每组滑到用户屏幕中的选项不超过 5 个,一共滑动 20 次左右,保证用户能够看清每件事,并且不会感到烦躁。
搭配清新的音乐节奏,将原本繁多的事项拆分成流星一般,整体感觉十分治愈。
| 调整事件顺序
在选择页面中,用户点击的顺序对应结果页呈现的位置。用户选择的必做之事越多,海报也会越长。
如果用户想将点击靠后的选项提前,用户可以在H5 的右上角处的“收藏夹”里,拖动该选项的位置。

哒哒观察到,很多用户都有着选择困难症,机会在手时总会犹豫不决。
而每位用户在选择必做之事时标准不同,很有可能当时脑子灵光选择的某个选项,之后又开始后悔自己的手太快。









