网站内容设计基本原则(产品视觉设计四大原则、交互设计十大可用性原则来对照用户体验)

　　网站内容设计基本原则(产品视觉设计四大原则、交互设计十大可用性原则来对照用户体验)

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

　　其实主要是因为用户体验分为以下几个方面：

　　视觉感官体验带给用户的是视觉呈现层的体验，所以我们将产品视觉设计的四大原则与用户的感官体验进行对比。交互用户体验，即产品设计中针对用户的交互交互，如点击效果、输入、弹出、切换等。所以我们用尼尔森交互设计可用性十原则来对比用户体验的互动。情感用户体验是一种由外而内的心理效应，为用户带来心理认同，增加满足感和愉悦感。所以我们使用情感设计原则来对比我们的情感用户体验。产品视觉设计的四大原则

　　在产品视觉设计中，我们可以利用四个原则来优化用户的感官体验，主要是：对齐；重复; 亲密关系；对比。

　　1. 对齐

　　对齐页面信息，左右对齐，居中对齐，保持页面视觉统一

　　移动端的阅读习惯是从左到右，所以我们也是按照左对齐，或者说尾部信息右对齐。中心对齐很少用于整体信息排列，除非是更正式、传统的产品设计，使用中心对齐来处理大型关系。在小细节的对齐中，logo/头像等也应该使用居中对齐，从开发成本上来说，对齐的设计也有利于它们的开发。

　　例如

　　闲鱼新闻页面顶部功能区采用居中对齐方式，更加正式，并突出显示引导用户点击；个人头像和消息左对齐显示，发布的图片右对齐显示。

　　在闲鱼我的主页上，功能图标和信息显示在左对齐，消息和进入按钮显示在右对齐；欣赏、关注和粉丝展示在中心。

　　显示在中心的集中信息引导用户通过路径。传统的列表以左对齐和右对齐的方式显示，以满足用户的浏览习惯，提高用户体验。

　　2. 重复

　　重复相对简单理解为一致性、颜色、形状、材质、空间关系、线宽、材质、空间等。我们常说的视觉规范的一致性就是这样，保持这些单元统一，贯穿其中，这样我们的页面布局就会整合，产品设计也会整合。

　　例如

　　在闲鱼新闻页面，标题功能区的圆形图标和字体重复出现。消息列表头像、姓名、消息、图片重复、一致、统一。

　　主页部分功能区图标重复，样式重复。活动区域的标题和图片保持重复。在类别过滤部分，每个类别都以瀑布流的形式显示，并重复网格以保证页面过滤的一致性。

　　3. 亲密

　　如果多个项目彼此之间有密切的亲密关系，它们就会成为一个视觉整体。因此，我们在设计时，往往需要整合信息，整合内容与亲密的组织关系。减少了信息内容的混乱排列，整合了框架，也方便用户浏览，满足可读性和易用性。个人观点（在产品设计中要控制好亲密度，需要多学习理论，然后理论联系实际，要有大量实物证据才能更好的满足用户体验）

　　例如

　　闲鱼首页分为功能区、活动区、闲置区、分类区4个部分。每个区域相互靠近，形成一个整体。按距离划分，满足用户易读性，减轻学习记忆负担。

　　消息页面更加明显。主要分为功能操作区和消息列表区。每个区域通过间隔和表达方式彼此密切区分。（这种需求不如基本需求那么必要。预计产品中的需求体验越多越好，用户越满意，反之，用户满意度也会下降）。

　　4. 比较

　　通俗的讲，对比就是要有对比和差异，即避免页面上的元素过于相似，从而避免同质化，强调差异化的节奏，突出关键信息的传递。当然，这个学位需要我们在日常工作中积累很多。比较常见的对比有方向对比、信息对比、颜色对比、对称对比、比例对比等。

　　例如

　　在闲鱼聊天页面上，对比了两方消息的颜色，两方聊天的视觉效果更强，对比也更加明显。

　　闲鱼交易所详情页，文字与信息的对比，突出内容信息，让用户一目了然区分内容和图片，多条信息的对比也增加了信息获取的质量，提升了用户体验。

　　美国设计师罗宾·威廉姆斯总结了产品设计的四大原则。文章 排版方面也有很多案例研究。如果想进一步了解排版设计的四大原则，可以阅读《写给大家的设计书籍》一书。

　　交互设计的十大可用性原则

　　Jakob Nielsen 是人机交互博士，他于 1995 年 1 月 1 日发表了“十项可用性原则”。尼尔森的十项可用性原则是尼尔森博士对 200 多个可用性问题的分析提取的十项通用原则。它是产品设计和用户体验设计的重要参考标准，值得深入研究和应用。

　　百度百科

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

　　1. 状态可见性原则

　　对于状态可见性原理的解读，我们将从实际案例中选取，结合原理进行讲解，让大家更好地理解和掌握状态可见性原理。

　　让用户知道系统在做什么

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

　　例如

　　例如，当页面刷新时，它会通知用户加载进度。当系统判断操作过程时，通知用户当前的操作状态。告诉用户当用户清除缓存时产品如何清除缓存。等等

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

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

　　例如

　　在闲鱼页面，我们系统的标题栏和TAB栏的提示贯穿始终，用户知道我们在哪个页面。比如认证提示，每一步都告诉用户去哪里。

　　让用户知道系统做了什么

　　让用户知道产品是做什么的，并且清楚地知道下一步该做什么。

　　例如

　　当您用闲鱼登录时，输入错误密码等情况，系统提示密码输入错误，您可以重新输入。

　　注销时，系统提示当前数据已保存，下次可以继续登录。

　　当您清除缓存时，产品显示将清除灰色、数量变化等。

　　让用户知道他们在做什么

　　当用户执行操作时，产品会及时反馈用户所做的事情。

　　例如

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