简书•重设计
注一:本文本着「写完一篇文章再砍掉一半」的原则,不必要的解释和说明都没有详细展开。
看不清请点开大图~
简书 for iOS 大版本升级后,多了很多新功能的同时更多的是痛点。在 App Store 中介绍自己的定位是「内容分享社区」,但我在使用过程中,感觉它却并没有做到一个「内容社区」该有的样子。
每每翻看时,只感觉到处都是文章,毫无头绪不知该点哪里。简书 for iOS 把所有文章都揉在一个纸篓里,然后砸到了我脸上。
作为内容先行的 App,用户在使用时应该被满足四点:
- 快速找到自己感兴趣的内容
- 快速进入阅读
- 查看动态
- 接收通知
App 已知缺陷:
- 逻辑紊乱
- 结构冗余
- 操作繁琐
- 内容展示低效
1. 逻辑紊乱
打开 App 首页,可以轻扫屏幕来切换内容分类,但进入其他页面时,该手势又用于在一个类 Scroll bar 里切换,在「简友圈」中也是在类 Scroll bar 中切换。如图:

那么,在首页的类 Scroll bar 中,只能去点击它们切换,这完全破坏了操作的「一致性」,使我频繁误操作。
再者,首页中「我的关注」这一栏我看了半天才反应过来那是我订阅的专题的动态:

难道这些更新的文章不该在「简友圈」(相当于动态)中吗?
2. 结构冗余 & 操作繁琐
把这两个放在一起,因为它们之间是相互作用的。
第一次点开「消息」,被惊到了:

查看消息首先得停顿一下选一个种类,然后再分别点进去,然后再返回,然后再看下一个种类...
第一次点开「我的」,也被惊到了:

「我的」页面中,下方自然是自己的动态,并不需要再有一个「动态」。

同样,这些信息不管主次直接全部塞到一个 bar 里面,也和「消息」一样让人不知所措,甚至,还有一个「更多」。

以及,tab bar 上有五个入口,这实在太多了。
3. 内容展示低效
「主页」中的文章归属专题并不会为读者带来更多地有效信息,也无法让用户快速进入阅读。

内容展示低效是前面所有已述缺陷带来的共同后果,结构冗余、逻辑混乱、操作繁琐必然带来低效。
同时,简书为用户们带来了共 30 种细分分类,看似扁平的结构其实非常低效,一股脑塞给用户,让人无法快速找到自己感兴趣的内容,如图:

同时做了一张思维导图展示简书的扁平结构:

我画了一个总图去展示以上提到的缺陷(看不清点击大图):

App 重设计
考虑到简书作为一个「内容为王」的 App,
重设计的最大目标和目的就是:高效展示内容,一切为内容服务。
1. 精简结构
首先看一张重设计的结构图:

改进动作:
- 减少入口,减为四个,将「我」提至 Navigation bar。
- 「主页」以 Timeline 的形式展示排名,「今日」、「一周」、「一月」整合。将「搜索」纳入主页。
- 「发现」页面减少种类,将「今日看点」纳入「发现」。「发现页面」专注于「快速获得感兴趣的内容」。


同时,取消首页的类 Scroll bar,以 Timeline 的形式展现内容。引导、暗示用户只需要看文章,不需要分散注意力。

「发现」页面最重要的目的是「快速找到兴趣点」,减少专题的注入,如有需要可点击「更多」;同样减少「今日看点」分类的注入,如有需要可点击「分类」:

2. 改善逻辑
将「简友圈」更名为「动态」,把原本在「主页」的「我的关注」纳入「动态」;原本混乱的「轻扫」手势只保留在「动态」页面,用以在「动作」和「文章」间切换:

3. 内容高效展示
「消息」结构精简,使用 hub 的形式展示各种种类的消息,用图表和排版来区分。
不同种类的信息给出明确不同的展示形式,高效展示高效吸收,让用户轻松区分:

「我」的页面也是一样,「轻扫」来展示更多信息:


至此,重设计结束。考虑到「内容优先」,没有过多更改已有的风格,保持简单朴素的风格,将内容更好的呈现出来才是最重要的目的。
注二:本文所有图文(除了截图)皆为原创,版权完全归我本人所有。如有未经允许的「任何部分或全部」的转载、抄袭、盗用,全部默认为:您已同意并接受给我本人 3 万元。本文「发布」时间:2015 年 04 月 24 号 19:19。
完。