1.4 易感知

与传统媒介相比，互联网产品所包含的内容更多，而且更加复杂。以书籍为例，我们读书时都是一页页地翻，一句句地读。但是我们无法期望用户像读书一样来使用互联网产品。尼尔森的一项统计显示，互联网用户平均只读了每个页面文本内容的28%。这意味着用户很少会读完大段的文字，他们更多地是“扫描”。所以，互联网产品必须要思考如何提升用户对信息的感知效率，让用户在短时间内就可以获取到他们期望的信息或者我们希望他们感知到的信息。

1.4.1 信息优先级

一个页面中会有很多信息，但并不是所有的信息对用户来说都是有用的。根据“二八原则”,80%的用户平时只用到了一个产品20%的功能。这就要求我们要梳理信息的优先级，把重要的20%的信息在视觉设计上进行凸显，让用户在快速浏览的模式下，可以看到他们感兴趣或者我们希望他们关注的内容。如何凸显这些信息呢？可以通过合理运用位置、间距、配色、形状和阴影等视觉要素来建立信息层级以完成区分。我们的目的是让用户在短时间就能清楚这个页面中各个元素之间的联系。

例如，当用户打开旅行类APP进行旅程规划时，在“日期选择”功能中，应该对周末和国家的法定节假日进行标示。如图1-22所示，Skyscanner是一个旅行类APP，这里的日历将周六和周日与其他日子区分开，这个设计很有心，因为周末是大多数人选择旅行的时间，所以应该突出展示，让用户更容易发现。

图1-23所示的这个登录页比较常见，在“登录”按钮下有三个超链接，分别是：“忘记密码？”“立即注册”和“游客登录”。为了吸引新用户，我们通常希望新用户点击“立即注册”这个超链接，所以，这里使用了橙色将其凸显出来。这属于通过配色来实现对比。其实在这里除使用配色外，还可以使用大小和位置来实现对比，将“游客登录”超链接移到下方，缩小字号。这两种设计方案都可以很好地鼓励用户完成注册。

1.4.2 缩短路径

为了让用户可以更好地获取信息，我们要缩短信息的获取路径。要知道信息的层级越深，用户的获取成本就越高。例如，如图1-24所示，用户要查看已结清的贷款记录，在这个页面中只能看到贷款金额和贷款日期，如果想查看更多的贷款详情，就要点击进入贷款详情页。市场上很多的金融类产品都采用这样的处理机制，但是这样设计就是好的吗？首先右边的“已结清”的文字标签在这里完全是多余的，因为根据上面的tab栏，我们已经知道这里显示的都是已结清的贷款项。对于这种鸡肋型元素，我们完全可以去掉，这样页面中的空间就会被释放出来。我们可以更改一下布局，将贷款的“还款方式”和“用途”这两个用户比较关注的信息外露，这样用户不需要点击进入详情页就能看到这两个信息。

其实，一款优秀的产品应该做到让页面里的每一个元素都有自己的意义，都是一个小功能，都可以向用户传递信息。以网易云音乐APP为例，如果当前播放的歌曲未下载，那么“本地音乐”那一栏展示的是歌曲数目；如果当前播放的歌曲已经下载了，那么“本地音乐”那一栏展示的是小喇叭icon。同样的位置，通过更改元素就可以向用户传递不同的信息，如图1-25所示。

1.4.3 信息可视化

当我们设计出一个抽奖活动页时，如果别人问你这个活动是怎么玩的，你回答“下面有具体的活动规则自己看”，这样的抽奖活动页就是不合格的。因为用户是不会看活动规则的，准确地说，用户很少看文字。在用户不看文字或者很少看文字的前提下，如何通过具象元素完成信息的传达是摆在每一个设计师面前的难题。

俗话说“字不如表，表不如图”。用户对于具象元素（表格、插画、icon和图像等）的感知能力更强，具象元素也更能传递情绪。例如，道路两旁的路标多数是以图形为主体的。这是因为在车子高速行驶的过程中，司机没有足够的时间阅读标示上的文字。

如图1-26所示，“场均得分122.4分，30.6个助攻，46.25个篮板……”这些数据对我们来说只是冷冰冰的数字，很难理解其背后的含义。这里使用了雷达图对球队数据进行了可视化处理，提升了信息的可读性。因为相比纯文本，用户理解图形的速度要快得多。

如图1-27所示，以谷歌日历APP为例，如果用户要做瑜伽，谷歌日历就会在日程详情页中配一个瑜伽垫的插画；如果用户要跑步，其就会配一幅跑鞋插画。用户甚至不用看文字，通过插画上所描绘的场景就可以知道自己接下来的行程。

举一个现实生活中的例子，我们发现朋友圈中“晒图”获得的点赞和评论数量要远高于分享歌曲和文章。当然造成这种现象的原因有很多，例如经常“晒图”的人要么长得好看，要么个性开朗、热衷于社交，这类人比较受欢迎。另一个原因就是信息的可读性，点赞和评论的前提是你要明白这条动态的意思，对于一张照片，我一秒钟就能明白其中的含义，而对于一首歌曲和一篇公众号文章，我需要花3～5分钟才能理解，有这个时间几十张照片都已看完，所以评论关于歌曲和文章的动态所需的时间成本太高。

1.4.4 化繁为简

用户所能接受的信息量是有限的，如果页面中的内容过多，用户就会望而却步。为了更利于用户消化信息，可以将一个页面中的信息拆解到几个页面中来展示，这样单个页面中的信息量就会大大减少，这就是我们常说的“一个页面，一个任务”原则。

例如，现在很多产品都对注册流程进行了拆解，不像之前那样由一个页面完成所有信息的输入，而是分成好几个页面来完成：在这个页面中只输入手机号，在下一个页面中只输入短信验证码，最后再让用户设置登录密码，如图1-28所示。

产品为了更了解用户，在用户首次登录的时候会询问一些个人信息。如果把所有的问题都放在一个页面中，用户很有可能会选择直接跳过这一步骤。一个页面只问一个问题，然后一步步地诱导用户完成个人信息的填写。

但是，任何事物都是有利有弊的，一个页面就能完成的任务现在要跳转到几个页面中，增加了用户的操作路径，可能会对转化率造成影响，而且对产品的容错性也提出挑战。以图1-28所示的短信快捷登录为例，如果用户没有收到短信，那么他想要确认自己有没有输错手机号，就必须返回上一个页面。所以，在设计中，并没有放之四海而皆准的原理，我们不能罔顾实际情况而机械地套用。

那么可不可以在不删减当前页面内容的前提下，让内容更容易被用户消化呢？当然可以，还是同样的原则：化繁为简。将大的模块切割成小的模块，让用户了解页面的信息结构，提升内容的可读性。就好比你看到一篇5000字的公众号文章，整篇文章就一个段落，更别说分成小的章节了，这样的文章看起来会很费劲。

同样，当表单项目过多时，我们要通过将其整合分组来提升内容的可读性。如图1-29所示，右表格将左表格中的11个项目分成3组。同样数量的内容，但用户的观感却大不相同。

当然，在运用“化繁为简”原则时一定要考虑具体的场景，切勿盲目生搬硬套。有的教程会比较长，而且上下文关联性强，如果分页展示就会让用户难以理解。比如你看到一个教程，其中第5页会用到第4页里的知识，这时候如果要跳转到第4页中去看就会显得很麻烦。

“化繁为简”原则不一定仅存在于交互和视觉设计上，还与产品的运营策略有关。支付宝和京东金融都有各自的会员等级体系，支付宝的蚂蚁会员等级是根据蚂蚁积分来判定的；京东金融的会员等级是通过会员成长值来判定的。但是支付宝中的用户可以直接将蚂蚁积分兑换成商品和权益，京东金融的用户则只能使用金币兑换。而金币和会员成长值的获取方式类似，也就是说，用户在支付宝中做任务获得的积分既可以提升等级也可以直接使用；而在京东金融中做任务只能二选一，因为它们是两套完全不同的体系，这样的设置会增加用户的认知和操作成本，如图1-30所示。

1.4.5 隐藏机制

身为设计师，可能都会有这样的苦恼：我也想控制页面的内容量啊，但是页面里的东西就是那么多，我也没法删啊。我们不一定非要删内容，也可以隐藏内容。因为虽然页面中有那么多功能，但并不是每一个功能用户都是全程需要的。如果我们可以感知到某个场景下用户对于特定功能的诉求很低，就可以考虑隐藏这个功能。

例如，在知乎APP中，用户进行搜索操作时，在搜索结果里浏览了大概3屏内容之后会在底部弹出一个“向知友提问”的浮框。这是因为一旦用户浏览了3屏内容，大概就可以判断用户对当前的搜索结果不满意，这时引导用户去提问是很合适的。如果一开始就展示这样一个浮框，则会减少用户的阅读区域，如图1-31所示。

这个例子也告诉我们，从用户的行为去判断用户的心理状态可能会带来不一样的收获。在网易云音乐APP中，如果用户点赞一首歌，就会出现一个小动画来引导用户去分享。因为一旦用户点赞了，就说明用户喜欢这首歌，系统就会抓住这个契机来引导用户，此时用户的分享意愿会更高，如图1-32所示。