为什么一致性在UI设计中很重要，我们平常挂嘴边的一致性原则到底是是什么？一致性原则如何影响用户行为？价值在哪里？本篇文章将探讨我们在处理界面的时候，如何遵循一致性原则，该如何去做.

“ 我们平常挂嘴边的一致性原则的关键要素有那些？作用是什么 ”

先谈它的作用

我们遵循一致性的原则目的是为了减少用户认知负荷，用户能够轻易上手使用你的产品，熟悉的导航路径，熟悉的设计模式，我们应该知道，我们的用户是忙碌的，没有耐心，他们不愿意花更多时间来学习使用你的产品，所以我们在做设计时候，就尽量多遵循常用的Ui Patterns，它是什么？是一种常用可用性问题的一种通用解决方案。但是如果一味遵循常有的Design Patterns,会导致我们界面看起来无创新，那么该什么时候突破这种界限，下面我会简单举例说明。

一致性原则的关键要素

颜色，间距，字体大小，图标控件一致性，规则一致性，交互操作等，我们在做界面设计的时候如何把控这些。

这里就要告诉大家一个常用的设计法则“重复”“节奏”“韵律”，学过平面设计的同学应该知道，这几个点吧，在平面设计中运用比较多的种设计方法。举一个例子？重复如何运用在UI设计中？

重复间距

airbnb

上图是airbnb的Gird layout图，我们看可以看出他们设计采用的间距都是基于8的倍数，且标题上下重复使用48px的间距，栏目之间的间距是96px,图片与文字间距重复使用16px.有节奏，有韵律，重复使用这些元素产生节奏美。

那控件呢？

product hunt

上图是product hunt app的界面截图，虚线框按钮倒脚一致。

布局规则

某厂视频应用

上图是某厂视频app界面截图，我们可以看到他们在布局上制定了一些规则比如栏目与栏目之间才有重复使用相同布局，1x1,2x2（指单个栏目摆放视频数量），然后接着下面栏目就是2x2，下面又接着1x1,2x2，后面再接一个单独1x1的栏目来打破这种死板的布局，然后再重复运用上面布局。

布局拆解图

这样重复的网格布局，对我们产品有什么好处呢？大家有木有发现目前市面上的视频类和音乐类的产品差不多这样布局吗？ （这其实就是外部一致性原则） ，因为用户已经熟悉且掌握这种模式，不再需要重新学习，那么如何在这种同质化的产品中脱颖而出呢？布局中可以使用对比，突出核心功能体验，又如还可以内容优于同类产品，品牌穿透，这里问个问题？看动漫会去哪里找，综艺呢？脱口秀？好声音？等等（这里稍微有点跑题）

那么剩下的一些要素我就不在这里一一举例，希望大家能举一反三。

“ 一致性原则如何影响用户行为？我们在日常产品设计中其实这样的例子还是很多 ”

比如导航模式，一级导航，二级导航，如果采用常用设计模式，用户基本可以很轻松的找到自己想要的内容。

再来说下颜色如何影响用户行为， 比如系统里面定义蓝色是可点击的颜色，那么我们在做设计是时候就要注意，哪些可点击，颜色使用是否合理，同类颜色，表达相同的含义，就不能用在其他意义的元素上。

大原则：相同含义的元素在不同的地方执行相同的操作时候，反馈机制需要一致。

左边ios/右边安卓

上图左边是ios的开关，右边是materials design 材质设计系统的开关，这两种开关大同小异，它符合用户心理表真，我们日常生活中家里灯开关不就和这个类似吗？所以在我们设计这些就可以尽量遵循用户的心里表真，保持内部外部一致性。

再比如在ios系统里面在对应列表上左滑动是可以对该列表操作的，那么在安卓里面的列表设计就需要慎用左滑操作。

“ 一致性元素的重要，我们如何在设计中运用，保证我们的产品易用，好用，不无聊 ”

1. 颜色－ 在使用颜色上需要严格去定义，比如绿色用于正确颜色，红色用语错误颜色，蓝色是可以点击颜色，这些都是常用的设计模式。

2. 布局／排版－ 布局遵循最小化设计原则，导航路径清晰可见，一级导航和二级导航一定要区分清楚，二者不可混用，排版布局上尽量遵循格式塔心理学原理。

3. 字体－ 一个app使用一种字体贯穿整个产品设计，字体大小运用重复原则，重复可以使其保持一致性。

4. 交互－ 这里我简单说下，操作模式，反馈机制要符合用户心理表真，常用功能操作流程要和外部环境保持一致性，比如我点击界面上蓝色文字这时候就要有正确反馈机制，而不是出一个弹窗。

5. 图标－ 图标一致性我相信大家都懂吧，上上周写了一篇关于图标规范的，有兴趣的可以去看下。

简单说两句：保证功能相同的图标元素一致，外观视觉一致性。

OK, 看完了你掌握了多少？一致性是视觉分析的其中一种关键环节，再结合我之前写的“认知负荷”可以拿自家APP 去分析一下，现有版本有那些视觉问题，这样可以锻炼自己分视觉析能力！

作者：TonyDesign

关键字：UI设计, 设计, 一致性

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！