今天主要从用户体验的一些原则来看闲鱼，主要从产品视觉设计的四个原则，交互设计的十个可用性原则，情感设计。今天，我们将首先谈论视觉和交互用户体验的两个部分。

其实主要是因为用户体验分为这几个方面:

在产品视觉的设计中，可以用四个原则来满足用户感官体验的优化，主要是:对齐、重复、亲密、对比。

对齐

页面对齐，左对齐，右对齐和居中对齐，保持页面的视觉统一性。

移动端的阅读习惯是从左到右，所以我们也是按照尾部信息的左对齐或者右对齐。在整体的信息排列中很少使用对中对齐，除非是比较正规传统的使用对中对齐这种大关系的产品设计，对中对齐在小细节的对齐中也用于logo/头像等等。从开发成本来说，对齐设计也方便了他们的开发。

例:闲鱼消息页面顶部的功能区居中对齐，比较正式，突出引导用户点击；个人头像和消息左对齐显示，发布的图片右对齐显示。闲鱼我的页面，功能图标和信息左对齐显示，消息和进入按钮右对齐显示；欣赏，关注，粉丝都在中间展示。突出显示信息，显示在中央，引导用户浏览路径。常规列表以左对齐、右对齐的方式显示，符合用户的浏览习惯，提升了用户体验。

重复

重复简单理解为一致性，颜色，形状，材质，与空的关系，线宽，材质，空等等。我们常说的视觉规范的一致性是这样的。始终保持这些单元的统一性，这样我们的页面布局和产品设计才能融为一体。

例:在闲鱼消息页面，头部功能区的圆形图标是重复的，字体也是重复的。消息列表的头像、名字、消息、图片都是重复的、一致的、统一的。首页部分功能区图标重复，风格重复一致；活动区标题和图片的重复性原则；在类别筛选部分，显示每个类别的瀑布流，重复网格，保证页面筛选的一致性。

亲密无间

如果很多物品相互靠近，就会成为一个视觉整体。所以我们在设计的时候，往往需要整合信息，整合组织关系紧密的内容。减少了混乱的信息内容排列，整合了框架，也方便了用户浏览，满足了可读性和易用性。个人观点(在产品设计中亲密度的控制上，要多学习理论，然后将理论与实践相结合，要有更多的实物佐证，这样才能更好的符合用户体验)

例:闲鱼首页分为四大部分，分别是功能区、活动区、闲置区、分类区。每个区域相互靠近，形成一个整体。通过空间划分，可以满足用户的可读性，减轻学习和记忆的负担。消息页更明显，主要分为功能操作区和消息列表区，各区域之间亲密无间，以区间和表现形式区分。(这种需求不像基本需求那样是必须的，即产品中的预期需求体验越多越好，用户越满意，否则用户的满意度也会下降)。

比较

相比较而言，既要有比较性，又要有差异性，即避免页面上的元素过于相似，这样既要避免同质化、差异化的节奏，又要突出关键信息的传递。当然，这个度是需要我们在日常工作中不断积累的。常见的比较有方向比较、信息比较、颜色比较、对称比较、比例比较等等。

举例:在闲鱼聊天页面上，双方消息的颜色对比更加明显，增强了双方聊天的视觉效果。闲鱼交流的详情页，文字和信息的对比，突出了内容信息的展示，让用户从图片中一目了然的区分内容，多种信息对比，也增加了信息获取的质量，提升了用户体验。

产品设计的四大原则是美国设计师罗宾·威廉姆斯总结出来的。文章中有很多排版的案例。如果你想进一步了解排版设计的四大原则，可以看看《设计大家用书》这本书。

人机交互博士雅各布·尼尔森(Jakob Nielsen)于1995年1月1日出版了《十大可用性原则》。尼尔森十大可用性原则是尼尔森博士在分析了200多个可用性问题后提炼出的十大通用原则。是产品设计和用户体验设计的重要参考标准，值得深入研究和应用。

——百度百科

这是一套实用的原则，无论是产品开发还是落地，都可以帮助我们提升用户体验和设计质量。以人为本，以用户为中心，让我们的设计师明确用户需求的设计方向和科学方法论。

1.状态可见性原则

解读状态可见性原理，我们将从实际案例中选取，结合原理进行解释，以便更好地理解和驾驭状态可见性原理。

(1)让用户知道系统正在做什么

即在产品设计的过程中，向用户展示系统的运行状态。

比如::比如在页面刷新的时候，通知用户加载进度。当系统判断操作时，它通知用户当前的操作状态。当用户清空缓存时，告诉用户产品是如何清空缓存的，等等。

(2)让用户知道他们在系统中的位置

其实我在哪里，我去哪里，我就去哪里，让用户一目了然，不需要太多的学习成本。这是页面元素的核心。一旦用户不知道自己在系统中的位置，就很容易犯错或者放弃产品。失去了设计为用户服务的本质。

举个例子在闲鱼页面上，我们系统的标题栏和标签栏中的提示贯穿整体，用户知道我们在哪个页面。比如认证提示，每一步都告诉用户去过哪里。

(3)让用户知道系统做了什么

让用户知道产品做了什么，清楚的知道下一步怎么操作。

例如:登录时输入密码不正确，系统提示输入密码不正确，可以重新输入。

注销时，系统提示保存当前数据，下次可以继续登录。当您清除缓存时，产品显示已经清除了灰分、数量变化等。

(4)让用户知道他们在做什么

当用户操作时，产品会及时反馈用户做了什么。

举个例子:闲鱼中最简单的例子，就是我们聊天的时候，输入信息并发送，显示在我们和对方的聊天页面上。

(5)新手提示

由于我们的新用户是承载整个产品流量的开口，新手的提示关系到我们运营中的留存，做好这方面的工作对业务环节的运营也有很大的帮助。

比如:在新手提示中，有一个设计点是，有趣的设计可以用来更好地沟通用户的情感。

2.环境相关性原则

简单理解就是产品设计要结合实际，产品设计要符合用户的认知，不能是我认为用户这样理解的产品。

(1)图片、图标和现实的结合

满足用户对描述图标功能的认证。

举个例子:在闲鱼首页的功能页面上，二手手机的图标用真人手机建模，游戏交易用游戏手柄建模，二手书用翻书页面建模，珠宝玉器用首饰建模，符合用户在现实生活中熟悉的东西，满足认知，体验良好。‍

(2)文字表达符合用户认知

符合用户自身现实生活的认证场景。

举个例子:在鱼塘页面，我们把兴趣的鱼塘称为文学、艺术、书法、乐器等。优质文艺青年聚集地，文艺青年是目前比较流行的网络用语，喜欢文化艺术的青年符合用户年龄段的环境认知。

3.撤销重做原则

这个比较好理解的是产品设计符合撤销重做原则，防止用户后悔操作或误操作等。，满足用户体验逆向操作。

(1)撤销

浏览操作可以撤销到上一步。比如闲鱼页面常见的返回操作就是撤销的一个例子。

(2)重做

即用户撤销上一步，然后又反悔上一步；或者用户完成发布后，又反悔发布，满足了用户充足的反悔空间，给了用户对产品的信心和控制权。

比如:如果闲鱼发布了，后悔重新发布，可以在管理页面编辑或者删除重发操作。

4.一致原则

一致性原则主要包括颜色、字体、图标、图片、功能、提示等的全局一致性。，为用户带来全球一致的舒适体验。因为一致性包含的内容很多，这里主要举几个例子来说明一致性的原理。

(1)颜色一致性

色彩一致性是全球化运营的重要点，也是产品具有品牌基因的重要体现。

比如:颜色一致性在我的页面和首页的页眉上体现的很清楚。

(2)提示一致性

提示一致性只要是提示操作一致性，就包括设计圆角、字体层次、颜色等的一致性。

举个例子:这个例子是不一致的例子。取消保存、删除、退出等操作，一个弹窗一个设计风格，不符合基本的提示一致性设计，当然这也是我们设计师自身产品体验设计需要改进和优化的地方。

5.防错原则

防止用户出错的简单手段，在用户误操作或可能因误操作造成不必要的操作损失时，给予用户提示，防止用户出错。这里有两个常见的例子来帮助设计师理解错位原理。

(1)退出操作提示

注销保存时提示，防止用户丢失数据。

比如:提示注销时，是否注销，增加确认级别，放在右边，明确提示用户，防止用户出错。

(2)登录操作

登录时，该按钮只有在满足登录操作条件时才会高亮显示，其他情况下按钮灰显，防止用户误点击。

例如:在闲鱼登录操作中输入验证码后，可以高亮显示按钮进行登录(登录操作不能截图，可以下载闲鱼自己体验)

6.减轻内存负担

主动系统识别可以减轻用户的记忆负担。常见的系统操作有扫码识别、语音识别、指纹识别、人脸扫描识别等等。

举个例子:闲鱼扫码识别用户，识别条码商品等等。

7.灵活高效原则

简单理解就是灵活高效的设计，满足大部分用户的操作需求，高效便捷的操作。因为不同的产品类型不一样，这里介绍几种常见的类型，比如自动回复、表情预览、常用表情等。

(1)自动回复

典型的灵活高效设置，用户可以不在线直接自动回复，选择不同的回复语言。

比如:闲鱼我的页面设置自动回复，灵活高效。

(2)表情包预览

聊天的时候选择自己的表情包，预览一下，选择适合自己的表情发送。

举个例子:在聊天页面预览表情包，切换可爱的闲鱼表情，满足用户的操作需求。

8.易扫原理

简单的理解就是用户在扫描产品信息时，可以很容易的获取信息。因此，有必要突出层次强化的主体部分。

【/s2/】举个例子:【/s2/】我的闲鱼页面，每个区块分为四个主要部分:买、卖、玩、其他。级别降低，同时显示区块中的各个功能图标，也便于用户查找，满足了易扫描的原则，提示了用户体验。

9.容错原则

简单理解就是灵活高效的设计，满足大部分用户的操作需求，高效便捷的操作。因为不同的产品类型不一样，这里介绍几种常见的类型，比如:自动回复、表情预览、常用表情等。

(1)反馈帮助

如果产品或用户有问题，提供反馈或帮助。

比如:网络打不开的时候提示你开小差。可以刷新一下试试。

(2)限制操作

为了防止产品出现一些问题，可以提前限制操作来避免。

举个例子:有时候下载图片流量太少。通过限制图片下载来避免用户损失应该怎么做？

10.人性化的帮助

简单的理解就是帮助用户运营，帮助用户解决问题，给予暗示、指导、建议、反馈等等。这里有两个主要的常见的人性化帮助，信息提示和帮助说明。

(1)信息提示

当产品中添加新功能或复杂功能时，浮动窗口会提示操作。比如新手钓鱼互动，提示用户点击引导信息，帮助用户更好的操作。

‍

(2)帮助

APP的常用功能，当用户有疑问或者不知道如何操作时，可以查看帮助说明，及时反馈:方便用户更好的使用产品。

举个例子:闲鱼的帮助解释功能更全面，可以满足无用户场景的问题需求，还可以及时咨询并反馈信息给客户。

本文由@阿汉原创设计发布。每个人都是产品经理。未经许可，禁止转载。

图片来自Unsplash，基于CC0协议。