尼尔森的十大可用性原则是尼尔森博士在分析了两百多个可用性问题的基础上，提炼出的十项交互设计原则。被广泛运用于网页、APP以及各种人机交互领域。
要注意的是，这10项原则是启发式（heuristics）的、通用的经验法则，而不是具体的规定。
系统应该通过在合理时间内的适当反馈，向用户通知正在发生的事情或者当前的状态。
不要蒙蔽用户，沟通是所有关系的基础，无论人还是设备。
当系统响应时间小于1秒时，通常正常反馈即可；
当响应时间长于1秒时，我们通常会通过加载动画、分步加载、占位符加载等方式，减缓用户等待的焦虑感；
如果超过10秒还没有得到响应，那么通常会认为这次请求是失败的，需要给予用户失败提示。例如：刷新提示、新页面加载提示、支付提示、下载提示。
当然加载时间并没有固定的规定，有个例子是这样的：
某个APP的用户反馈说他们的页面加载太慢了，希望提高服务器反应速度……于是他们对此进行了优化，优化后用户的反应：新版很给力，很快！
那这个团队的优化方案是什么呢？
。
。
。
——他们把小菊花转圈的速度提快了
对用户操作的适当反馈是用户界面设计的最基本准则。让用户了解当前状态、位置、是否成功、进度如何，减少不确定性；并引导他们在正确的方向上交互，而不是浪费精力在重复操作上。反馈有：
·状态反馈
用户需要知道自己的操作是否被系统感知，所以用户操作后，应该第一时间给出反馈。最常见的就是各种按钮的不同状态，比如未点击、点击、不可用状态，以及选中、未选中状态。
就拿小说类批量订阅列表来说，起点通过明显的线面和颜色区分选中和未选中的章节；而长佩我买的时候是需要反应一下：免费不可选中是浅灰色、未选中是深灰色，选中是绿色……但是初始状态时深灰色看起来像是选中？？
·进度反馈
进度通常有页面加载进度、下载进度、视频播放进度等
比如下图的invision网站，在阅读文章时通过顶部进度条的反馈，让用户知道自己的阅读进度。
·位置反馈
因为网络空间中用户无法像物理空间那样感知到自己的位置，所以我们需要在视觉上进行提醒，以免用户迷失。
比如标签栏、导航栏通过选中状态来定位当前所在页面，阅读、看视频、听音乐时系统会记录当前的位置，下次打开后继续。
·反馈方式多样化
反馈可以通过元素的颜色位置、文字、声音和震动，甚至动效去表达变化。
比如京东，通过产品图缩小-加入购物车的动效来反馈“商品已加入购物车”，直观形象。
使用用户熟悉的语言，单词、短语、图形，而不是系统导向的术语；遵循现实世界的惯例来呈现信息。
这里的语言不仅仅包括文案层面的语言，还包括产品的设计语言（图形、配色和风格）。
产品使用的语言应该使目标用户能够清晰理解的。如果用户不能理解，他们会感到被忽视和受挫败，许多人将选择其他产品完成目标。
特别是现在很多公司选择耕耘细分市场的产品来分一杯羹，比如针对中老年、青年、儿童的产品，抑或商务、娱乐的产品，都要分别使用符合自己的定位的语言。
比如bilibili的设计语言和每日优鲜的文案语言——
模仿现实世界的产品或者使用映射，能够利用人们现有的知识，降低学习成本，使他们轻松快速的理解界面。
像早期拟物化的设计，以及MD的魔法卡片模拟了物理世界中的纸张。IOS的指南针也类似现实世界中的指南针，以便用户轻松的使用。
熟悉是这些体验让用户愉快的原因。
比如微信阅读打开书的动效就像现实世界的打开一本书一样、给medium文章进行标记就像我们现实中使用马克笔一样。
用户经常会在使用时发生误操作，所以产品需要一个非常明确的“紧急出口”帮助他们——即提供取消和重做的功能。
用户在使用产品时可以自由进退，遵循从哪里来就可以返回哪里去的原则；比如常用的各种二三级页面左上角必备的返回按钮。
当用户误操作时要给用户提供提供撤销、取消、重做等相关功能，比如聊天类产品的信息都可以短时间内撤销。
（突然发现这张图暴露了我每天点外卖的事实 ヽ(。>д<)ｐ
不可逆的操作需要给用户明显的提示，以免对用户产生严重的影响。比如删除功能通常需要二次操作，重要操作会有弹框类提示。
设计者应遵循一致性原则，统一标准能确保用户理解各个元素在设计中，并且知道去哪里寻找哪些功能。
移动市场成熟的今天，已经有很多约定俗成的惯例。和用户的习惯一致，意味着用户不再需要重新学习，各种应用的切换之间没有学习成本。这也是我认为设计的趋同化未必不是一件好事情的原因。
比如常用的几种操作手势、下拉刷新功能、我的/地图/购物车图标等
在同一个产品中，同一层级的信息应该使用一致的设计语言。
比如导航、弹窗、按钮、列表，这是我们推行设计组件和规范的一个原因。
除此以外，颜色、文字、圆角、阴影等也是需要注意一致性的。
△谷歌google visual guidelines-google ads
用户经常分心于手头的事情，因此需要通过提供建议、利用约束来防止无意识错误。
其实限制用户的选择并不是一个好主意，但是如果有明确的规则来定义可接受的选项，那么限制用户可以输入的类型是一个很好的策略。
比如订房时，对可订房日期进行限制，防止用户选错时间。
提供清晰的提示，也能防止用户犯错，提示包括标签、文字、颜色、以及反馈状态等。
比如IOS的键盘，选中的字母会放大，提示用户；输入文字光标会放大，防止用户操作失误。
比如负向操作通常为红色，红色是一种警示色，给用户预警防止误操作。
尽可能减少用户的记忆负担，向用户显示他们可以识别的内容，而不是自己记忆和填写。
选择和输入的操作成本相差巨大。产品应该给用户提供选项，让用户可以直接选择，而不是自己输入。比如淘宝填写收货地址
在用户使用产品的过程中，会有产生一些需要记忆的内容、或者操作路径，这个时候我们要避免用户记忆，把信息直接提取出来，送到用户手里。
比如自动读取短信验证码，比如bilibili会提醒上次播放的位置
内容可预期，减少用户操作路径，防止来回跳转。
比如起点章节付费时可以直接看到当前的余额、
比如京东金融首页直接显示了余额和代还金额（本来应该打个码的，但是想想我三位数的资产打码还不够费劲呢(ಥ_ಥ)
好的产品需要同时兼顾新用户和资深用户的需求。
对新用户来说，需要功能明确、清晰，对于老用户需要快捷高效使用高频功能。不可迎合某一种用户，把不必要的信息占据重要部分。
在首页放置常用功能，比如淘宝、支付宝、bilibili等等；或者提供自定义入口，比如猿题库可以自定义科目
对用户频繁使用的功能，提供重复操作入口或者模板。比如美团外卖，可以直接选择再来一单
通过提供系统默认选项，而减少用户多余的操作。比如美团、携程、每日优鲜等当地服务类产品，会默认选择当前定位的城市；购物会选择默认收货地址等
不要包含不相关或低频次的信息/操作。页面中的每个额外信息都会降低主要内容的相对可见性。
能够方便用户无障碍的浏览信息，越重要的内容越突出。
通过颜色、大小、字体的字重、对比度、元素的间距、特殊造型、动效等来表现。
页面中背景、装饰元素视觉过重的话，就会干扰到用户对于信息的阅读。
比如以图片为背景，我们要考虑图片上文字的识别性；列表页过重的分割线、页面内过多的装饰元素都会给干扰信息阅读……
比如下厨房菜单推荐的卡片，字体识别度特别差；移动掌厅的这个模块，字体色和背景色对比不清晰、以及字体太小，都会干扰用户识别信息——我们需要做的是降低这些干扰
错误消息应以简单的语言表示，准确指出问题，并提出解决方案。
当发生错误时，提示信息一定要直观，视觉上能够引起用户注意，可视化处理，文案要简单概要。比如账号密码错误、以及各种异常状态
当用户遇到错误时，不要只是报错，尽可能提供详尽的说明文字和指导方向，遇到了什么问题，以及如何解决等等。
帮助性内容有一次性提示、常驻提示和帮助文档。
多用在用户第一次使用，或者产品更新后，通常为气泡形式，或者snakebar的形式呈现。
用于操作时必须注意到的内容，在页面中以文本或者标签形式呈现。
一般用于解释规则或者热点问题，通常以超链接的形式存在于页面中；或者以集合形式位于设置页中，此时需要注意要易于检索。
本篇文章主要介绍了尼尔森的10大可用性原则，以及介绍了适用范围和案例说明。最后我们再来复习一遍加深记忆吧~
一个个看起来精致的页面也是由这些UI设计细节组成的。对于页面细节的处理也往往可以体现UI设计师的专业和严谨度，本文分享的这些设计细节，不仅新人设计师常常会忽略，就连有经验的设计师也时常会在这些细节上处理不当。
文字细节
A．文字行距
在做段落文本时，我们很少直接使用默认的文本行距，为了保证阅读的可读性和舒适性，必须设置比默认值更大的数值的行距。
具体的数值可以设置在字号的1.3～1.8倍之间，一般情况下，字号越小，需要的阅读空间会略大一些，特别是在设计一些阅读类需要阅读大段文本的产品页面时，一定要加大行距来提高文本的可读性和阅读舒适性。
B．文字对比度
在界面设计中，应该要保证任何文字的可阅读性，它应该有足够的对比度，即使是提示性文字也要保证在任何类型的显示器上都可见易读。
间距和边距
A．去掉多余的边框和分割线
用大量而明显的分割线和边框将模块分开，是UI设计新手常常犯的错误，但在设计的同时，可以停下来好好思考：用分割线分开一定是最好的方法吗？有必要吗？
有时用1px的边框和分割线确实是合理的，但也有其他的方法来进行信息的归类和分割，比如利用阴影和更大的间距。
B．避免不均匀的边距
在进行卡片式设计时要注意内容与卡片边缘的边距。如果你是以常用的从左上角到右下角的方式来布局内容，那就让顶部的边距比左侧的边距稍大一点，看起来会比四边都相等的边距更加舒适美观。
投影
在物理现实中，物体的投影绝对不会是黑色的，物体的投影颜色始终会受到其所处在的环境的影响。
应用在界面设计中，物体或是卡片的投影颜色应考虑其背景和环境颜色来进行结合设计，即不应选择纯灰色，而是选择带有背景色彩倾向的灰色，同时设置适当的透明度和模糊值，来营造自然舒适的投影效果。
内容填充
重复和随意的示例文本和图片放在设计图中看起来会很不专业，应该避免交付这样的设计稿，它会让人觉得你对自己的设计是不专业不用心不愿意花时间的，同时也反应了你对与自己的设计产出的重视程度。
此外，也已经有一部分插件可以自己自动选择填充内容，为设计师节省了这些素材的填充时间，所以在交付设计稿时，让自己的设计稿尽量完整专业，哪怕是为了演示效果，也应该放上相应的不同的内容标题、文本、图片，让整个设计看起来更加专业和完整。
以上提到的每一条规则都要结合具体的产品来进行具体分析和设计，但是可以适用在在大多数情况下，设计从来没有一个标准答案，对于设计新手要训练的是，如何找到那个最合适当前产品的设计方式，希望这篇分享能对你有帮助，感谢阅读。
当我们拿到网页设计需求时，首先要确定是不是要单独开发移动版本。因为响应式布局兼顾了手机端适配问题，但是受加载速度、手机浏览器、栅格化系统的限制设计发挥的自由度、等的影响很大。
栅格化设计：是针对网页设计师。主要是为了提高网页的规范性。
栅格设计系统：（网格设计系统，标准尺寸系统、程序版面设计）是一种屏幕设计的方法和风格，运动固定的格子设计版面布局，其风格工整、整洁。
栅格化布局：针对前端开发人员，指前端攻城狮使用的css框架，来实现页面的响应式布局。
设计师使用纵向的栅格（列）让页面元素垂直方向上对齐，使用横向的栅格（排）让元素水平方向上对齐。设计师结合基准网格（8pt）和纵向栅格（12栏 16pt）进行设计。
基于设备的逻辑像素进行UI设计——设计开始前UI设计师要根据桌面和平板手机分辨率大小，考虑最大最小响应的屏幕，给出响应的策略设置断点和次断点。
断点：(breakpoint)是页面改变布局的临界点，一个响应式网页可能会有一个或者多个断点。有时候网页也会设置次断点。
次断点：(minor breakpoint)并未对页面布局做很大的改动 只是对细节做了一些微调。
媒体查询：（media queries）是实现断点的一种方法，它提供了简单的逻辑方法来根据不同的设备特征（宽度 高度 像素比）应用不同样式，最常用的媒体查询变量是min-width和max-width。）
设计师根据网页的内容找到合适的断点。设置多少个断点由网站的内容决定，设置几个断点就需要设计几套UI设计图。设法避免列间空白太宽或太窄的情况。常见的设计尺寸1920PX（大屏电脑）、1440PX/1280PX（小屏电脑）、1024PX（横屏Ipad）、768PX（手机和竖屏Ipad）。（这些是根据市场常见的机型分辨率来的。再根据网页内容多少进行合理的增减。）
用chrome浏览器打开一个响应式网站，检查元素，右上角会显示视窗当前的分辨率，慢慢缩小视窗的宽度，找到页面布局的变化点，就是我们上面说到的断点或者次断点。）
这个当然不是了。这个视网站中每个页面的内容而定，甚至同一个页面的不同内容模块布局断点设置也不尽相同。在我的实践过程中，很多页面只需要设计三套，当然比较复杂的页面，在这五个分辨率上，都需要对布局做一些修改或者自动隐藏部分内容。
在UI设计中，很多设计师都苦恼于自己的界面设计“没有设计感”，感觉看起来“不高级”，到底是为什么呢？其实就是在一些细节的处理上略缺火候，掌握下面这15个小技巧，能让你的UI界面质感翻倍！
1、双重阴影，突出立体感
设计师在设计时，为了突出里按钮的立体感，往往会使用阴影效果。但其实在阴影效果上再叠加一层精细的边框，可以让阴影效果显得更清晰，而不会与原本的按钮混为一体。
2、只用一种字体，保持视觉一致性
为了让设计更美观，许多设计师会在一个界面使用多种字体，但实际上，一个界面里只使用一种字体更为美观，可以帮助界面产生统一的设计效果。
3、一种字体，不同字重
如果选择一种字体进行设计会稍显单调，那可以根据内容的轻重优先级，来选择不同的字重来做以区分。
4、适当留白
当内容丰富时，更需要适当的留白，才能让设计具有呼吸感，更加舒适。
5、提高文本与背景的对比度
很多过深或过浅的背景图上添加文本，总会让人阅读有困难，可以采取加粗、添加渐变等方式来处理文本，让字体更清晰。
6、交互按钮需要着重突出
为了增加用户选择交互按钮的可能性，应该使用颜色对比、尺寸或标签，来确保该按钮突出。
7、字号越小，行距应该越宽
字号越小，阅读起来障碍更明显，增加行高留出空隙会让它更易读。
8、下载页显示进度提醒
如果下载页的软件或其他安装包有一定的下载等待时间，建议给出进度提示，让用户可以随时了解下载进度，不会中途取消下载。
9、同个界面，文本长度尽量一致
基于人的阅读习惯，研究总结出，单列页面里，45到75个字符是被广泛认可的长度。
10、元素阴影不要太重
舒服的投影会增加你的设计的质感，和透气感。太重的投影会显得你画面比较脏。
11、使用递进分类加强对比度
加强对比度，可以明确突出所选元素。
12、标题的行高不要太高
与长格式正文文本（需要足够的行高以提高可读性）不同，标题通常要短得多，因此可以稍微缩小间距。标题的建议行高通常是文本大小的1到1.3倍。
13、大写标题，提高字间距
当标题全部为大写字母时，增加字母间距可以提高可读性，同时又增强了一丝设计感。
14、增添页面动态
可以在加载中添加一些提醒让用户理解当前运行状态，例如添加“缓冲”符号。
15、不要在下拉列表放置重要操作
用户需要采取的基本操作（例如，注册或登录），应该直接放在醒目位置，而非隐藏在菜单栏中。
一个个看起来精致的页面也是由这些UI设计细节组成的。对于页面细节的处理也往往可以体现UI设计师的专业和严谨度，本文分享的这些设计细节，不仅新人设计师常常会忽略，就连有经验的设计师也时常会在这些细节上处理不当。
文字细节
A．文字行距
在做段落文本时，我们很少直接使用默认的文本行距，为了保证阅读的可读性和舒适性，必须设置比默认值更大的数值的行距。
具体的数值可以设置在字号的1.3～1.8倍之间，一般情况下，字号越小，需要的阅读空间会略大一些，特别是在设计一些阅读类需要阅读大段文本的产品页面时，一定要加大行距来提高文本的可读性和阅读舒适性。
B．文字对比度
在界面设计中，应该要保证任何文字的可阅读性，它应该有足够的对比度，即使是提示性文字也要保证在任何类型的显示器上都可见易读。
间距和边距
A．去掉多余的边框和分割线
用大量而明显的分割线和边框将模块分开，是UI设计新手常常犯的错误，但在设计的同时，可以停下来好好思考：用分割线分开一定是最好的方法吗？有必要吗？
有时用1px的边框和分割线确实是合理的，但也有其他的方法来进行信息的归类和分割，比如利用阴影和更大的间距。
B．避免不均匀的边距
在进行卡片式设计时要注意内容与卡片边缘的边距。如果你是以常用的从左上角到右下角的方式来布局内容，那就让顶部的边距比左侧的边距稍大一点，看起来会比四边都相等的边距更加舒适美观。
投影
在物理现实中，物体的投影绝对不会是黑色的，物体的投影颜色始终会受到其所处在的环境的影响。
应用在界面设计中，物体或是卡片的投影颜色应考虑其背景和环境颜色来进行结合设计，即不应选择纯灰色，而是选择带有背景色彩倾向的灰色，同时设置适当的透明度和模糊值，来营造自然舒适的投影效果。
内容填充
重复和随意的示例文本和图片放在设计图中看起来会很不专业，应该避免交付这样的设计稿，它会让人觉得你对自己的设计是不专业不用心不愿意花时间的，同时也反应了你对与自己的设计产出的重视程度。
此外，也已经有一部分插件可以自己自动选择填充内容，为设计师节省了这些素材的填充时间，所以在交付设计稿时，让自己的设计稿尽量完整专业，哪怕是为了演示效果，也应该放上相应的不同的内容标题、文本、图片，让整个设计看起来更加专业和完整。
以上提到的每一条规则都要结合具体的产品来进行具体分析和设计，但是可以适用在在大多数情况下，设计从来没有一个标准答案，对于设计新手要训练的是，如何找到那个最合适当前产品的设计方式，希望这篇分享能对你有帮助，感谢阅读。
界面作为用户与APP交互的唯一接口，对用户的情绪和工作效率起着举足轻重的作用。因此需对用户界面设计一般原则进行探讨。
2、富有吸引力。
用户界面是由若干界面元素组成的，不是所有元素都一样重要，要确保重要的元素尽快显现给用户。重要的或频繁访问的元素应当放在显著的位置上，而不太重要的或使用频率小的放到不太显著的位置上。
一致的外观可以在系统中创造一种和谐。如果界面元素缺乏一致性，很可能使界面看起来杂乱无章、没有条理，甚至可能引起用户对系统可靠性的怀疑，失去对系统应用的信心。
当然此处的“白”并非指白色，而是指界面中没有被界面元素占用的空白区域。恰当地“留白”有助于突出界面元素和改善可用性，引导用户在不知不觉中进入系统的思维框架，从而顺利地、正确地应用这个系统。
6、保持界面简单明了。
界面设计中最重要的原则就是使复杂的问题简单化。如果用户觉得界面很复杂，则可能会认为系统本身也很难，而望而却步，所以与大而全的界面设计方案比较起来，简单明快的界面设计往往更可取。
7、慎重使用颜色。
列表框类元素有一个共同的特点，都可以设置滚动条。使在一个小“框”中阅读大文件成为可能。但也产生一个问题：如果阅读一个行列均很多的文件，用户就会反复拉动水平或垂直滚动条，给阅读带来诸多不便。设计时最好只使用一个方向的滚动条，即要么横向够宽，要么纵向够长。
11、控件隐藏。
时我们倾向于将我们的设计视为艺术品。但如果我们用这种方式来思考它们，就意味着它们不会准备好面对“现实世界”的不确定条件。但是，设计一个可以随时改变的界面也很美 - 而且，让我们承认它，接口确实一直在变化。我最喜欢设计移动应用程序的一个方面是，从最初的概念到你对所有界面细节进行微调和抛光的时候，这是一个包含许多步骤的过程。
我们是视觉思考者，拥有训练有素的眼睛。这就是为什么在开始一个新项目时有时会直接跳到可视化UI设计阶段的原因，这也是我们可能对其他任务感到厌倦的原因之一。
这也意味着我们经常推迟工作流程的其他重要部分：定义用户需求和目标，草拟任务流程，处理信息的所有细节和交互设计等。这些是同样重要的是，它们更抽象，更难以让人想象它们将如何成为最终产品的有形部分。
当我们正在进行视觉设计时，所谓的像素完美哲学可能是一个陷阱，使我们花费更多的时间来制作细节，直到最小的细节处于界面的“完美”位置。这导致一代设计师使用Dribbble和Behance主要显示应用程序和网站的精美屏幕，并且更关注外观而不是设计实际工作方式。在现实世界中，事情往往不如我们期望的那样好。
就个人而言，我认为最好的设计（当谈到用户界面设计时）不仅外观和感觉良好，而且还可以优雅地响应变化的条件甚至不可预测的情况。
在构建产品的漫长道路上，设计师需要更多的协作，而不是专注于视觉设计。这正是我为了这篇文章专注的地方。在接下来的几段中，我将向你提供一些提示和技巧，说明如何将你正在进行的应用程序设计用于测试，并了解它是否已准备好发布到市场。
在不完美中寻找美
当我在大学学习平面设计时，他们教会了我们平衡，对齐，比例和张力的美感，以及如何在空间中定位元素，使它们和谐悦目。凭借这些知识，我的生活发生了变化，我开始以不同的眼光看世界。后来，我开始设计界面，我试图将相同的原则付诸实践，屏幕上的所有信息都应该形成一个非常令人满意的视觉构图。
如果你将这些原则应用于移动应用程序设计，那么我们发现必须显示适量的信息。例如，如果一个屏幕必须列出人们的姓名，设计师通常会选择一些短而普通的名字，并将它们完美地排列在一起，没有留下任何可能破坏设计或使其在以后崩溃的意外长名称的空间。
这种方法基于这样的假设：在混乱和不完美中没有美，尽管这两个方面在现实世界中经常出现。但是视觉界面并不是一件值得欣赏的静态艺术品; 它们是动态的，功能性的空间，可以改变和适应每个人使用它们。我们不应该屈服于纯粹为美学设计的诱惑，因为我们永远无法控制界面必须呈现给人们的一切。
相反，我们必须设计变革！这就是日本人所说的wabi-sabi，一个“以接受短暂和不完美为中心的世界观”。
因此，以不同的方式思考和设计是很重要的：
● 尝试以多种方式在你的设计中呈现数据;
● 尽可能使用真实数据。
当你尝试以几种方式呈现数据时，包括一些不可预测的数据，你将能够测试界面是否已准备好处理超出设计“舒适区”的这些情况。此外，为极端情况做好准备。
如果你已经推出了该产品，这将更容易，因为你可以关注实际数据并将其用于你正在进行的设计过程中作为参考。但是如果你正在研究一些新的东西，那么你将不得不深入挖掘，做一些研究，并尝试了解以后如何信息。你还可以与后端团队的开发人员讨论此问题，他们将能够更好地向你解释将存储和呈现的数据类型。
我给你一个更具图形的例子，我的开发者朋友称之为“漂亮的朋友综合症”。当我们设计一个包含人物图片的屏幕时，如用户档案，我们倾向于使用在设计中看起来很好并且很漂亮的人的照片。然而，当他看到这样的设计时，我的朋友说：“我希望我有朋友这么帅。”
因此，“完美”图像的替代方案可能是使用不同肤色的人的更多随机照片。这样，你就可以测试重叠元素在不同背景下的外观，让你可以看到对比度和易读性是否仍然完好无损。
不要过于乐观
对于应用程序的工作方式，我们天生就是乐观主义者。我们认为一切都会快速顺利地进行，而且不会中断，因为......为什么不呢？这就是为什么我们有时会忘记如何设计和处理用户可能在以后遇到的一些可能不那么好的情况。
列举几例，如果突然互联网连接中断，会发生什么？或者，如果浏览器在执行任务时尝试连接到API时出错？如果连接速度太慢，是否会有加载指示器（例如微调器或进度条），或者在加载实际数据时是否会有一些占位符填充显示块？那么刷新应用程序的某些屏幕的可能性呢？什么时候（以及在哪种情况下）可能？
正如你所看到的，我不是在谈论用户所犯的错误（例如，在填写表单时犯了错误），而是关于不受其控制但仍然发生的错误。在这种情况下，与开发人员交谈，并了解不同屏幕上可能出现的问题，然后设计一种可以让用户轻松解决问题的方法，让他们可以选择稍后再试或者执行不同的操作。
无论如何，确定触发每个错误的特定条件并为每个案例设计有用的错误消息是一个好主意。这些有用的消息将帮助用户在每种情况下做出适当的响应，并知道下一步该做什么来解决问题。即使它有点麻烦，也不惜一切代价避免使用通用错误消息。
理解流程
界面包括许多元素，它们一起形成应用程序的整个布局。然而，当我们把重点放在用户界面上的一个整体，我们往往忘记了一些元素也有较小的任务来执行的总体目标做出贡献。
如果有一个触发某种交互的按钮或项目，那么请向前看并考虑下一步：在执行操作时是否会显示加载状态？它可以因某种原因被禁用吗？如果用户按住按钮一段时间该怎么办？会有任何反馈意见吗？就像整个屏幕有不同的状态一样，同样也适用于单个元素。
此外，请考虑产品的逻辑如何与用户的心智模型相匹配，帮助他们准确有效地实现目标并以有意义和可预测的方式完成他们的任务。
我要做的就是解决所有这些问题，就是停止我正在做的事情，暂停，退后一步，查看整个多屏幕流程的大局，并了解一系列步骤和动作。我将寻找导致该点的多条路径，以及远离它的多条路径。
你可以在使用原型时做同样的事情，慢慢地，认真地，谨慎地执行动作。如果这对你来说太具有挑战性，因为你之前可能已经多次这样做了，现在它变成了一种自动化的任务，并问同事，朋友或活跃用户看看设计或原型。看到其他人使用并与你的设计进行互动可能很有启发性，因为我们往往过于接近并且过于熟悉它，因此可能会忽略一些事情。
为您的屏幕设计
当我在设计时，我通常会将手机放在我旁边，以便我可以预览我的工作并实时进行调整。
我认为这是一个很好的做法，但这种方式也很容易忘记所有其他手机与人们可能使用的手机不同。有很多不同的屏幕尺寸（特别是在Android平台上）; 试着考虑所有可能的变化。
知道从哪里开始的一种方法是检查你的实际用户拥有哪种类型的设备。
在为各种屏幕尺寸和方向准备设计时，不仅仅是拉伸盒子和重新定位元素。仔细考虑如何充分利用每种情况，以及如何进行必要的调整，即使它意味着偏离原始设计。
在这些情况下，我们之前讨论过的相同原则仍然适用：不可预测的情况，不同类型的内容，可变数量的信息，缺少数据等等。你必须针对各种可能的场景进行设计。不要陷入将屏幕设计为产品的单独部分的陷阱，它们都是相互连接的。
这不仅对你有用，而且对开发人员也有帮助，他们需要了解许多可能的场景才能编写代码并准备界面来解决这些问题。
今天你需要什么，明天你可能需要
你可能已经注意到，本文中许多要点的目标是减少意外情况。即便如此，在很多情况下你也无法得到明确的答案。开发人员经常会问，“那么，如果我这样做会发生什么呢？”指出你以前没有考虑过的潜在结果。
如果发生这种情况，那么你只需要针对一个案例和一个屏幕来解决该特定问题。但总是尝试全局思考，并考虑如何将该特定问题的答案设计为以灵活的方式工作，以便你以后可以重用它。
毕竟，这就是我们UI设计师所做的 - 我们设计和定义适应未预料到的状态，条件和流程的灵活系统。将你的界面视为移动，更换智能部件的生动生态系统，而不是单个像素块的集合。
在此过程的这一部分中，你需要与团队中的开发人员密切合作，主要是为许多不同情况定义一组行为规则。但保持良好的平衡 - 尽量不要过度设计。用一点常识来设定自己的极限。你需要在功能和一致性之间取得良好的平衡。请记住，良好的设计系统是灵活的，并且在某些情况下为规则的某些例外做好准备。
另一方面，想一想你已经设计过的元素如何调整以适应新的情况。如果你创建一个设计组件库，你将会看到更好的结果，因此，只需快速浏览一下库，你就会知道是否需要从头开始设计某些东西，或者你可以使用现成的东西。
结论
基于设计系统的优雅解决方案具有明确定义的问题将使我们工作中的视觉设计更加有趣，因为我们可以专注于界面的改进，抛光和愉悦，而无需无休止地迭代。当我们过早地跳到视觉效果时，我们必须同时解决问题并制作界面，这通常会导致沮丧和倦怠。
改变你的工作流程可能在一开始就具有挑战性，但过了一段时间你会喜欢在限制范围内工作。这也将改变你的思维方式，并希望帮助你摆脱对视觉细节的关注。你将成为一个更加完善和有能力的用户体验设计师，使用适当的可交付成果，而不仅仅是生成无穷无尽的视觉模型和组合。
设计师需要每天解决问题，找到合适的解决方案需要深入研究和精心策划的测试。我们可能还没有答案，但我们确实知道我们有时可以采取的某些捷径。
“启发式”是一种简单而有效的规则，可以帮助我们形成判断并做出决策。我们可以将它们视为UI最佳实践的一般指导原则。
注意：这些规则有其时间和地点，并不能替代可用性测试。
我们今天要看看八大黄金法则，对设计会产生哪些影响。
1. 争取一致性
设计“一致的接口”意味着对类似的情况使用相同的设计模式和相同的动作序列。这包括但不限于在用户使用中在提示屏幕，命令和菜单中正确使用颜色，排版和术语。
请记住：一致的界面将使你的用户更容易完成他们的任务和目标。
2. 启用常用快捷方式
说到使用UI规则作为快捷方式，你的用户也将受益于快捷方式，特别是如果他们需要经常完成相同的任务。
专家用户可能会发现以下功能有用：
· 缩略语
· 功能键
· 隐藏的命令
3. 提供信息反馈
你需要让用户随时了解流程每个阶段的情况。这种反馈需要有意义，相关，清晰，并符合上下文。
4. 设计对话以进一步沟通
动作序列需要有开头，中间和结尾。任务完成后，如果是这种情况，请为他们的用户提供信息反馈和下一步明确定义的选项。不要让他们疑惑！
5. 提供简单的错误处理
设计一个良好的界面，应该尽可能避免错误。但是当错误发生时，你的系统需要让用户轻松了解问题并知道如何解决问题。处理错误的简单方法包括显示清晰的错误通知以及描述性提示以解决问题。
6. 允许轻松撤销动作
在发生错误后找到“撤消”选项可以立即解决。如果他们知道有一种简单的方法可以解决任何事故，那么你的用户就会感到不那么焦虑，更有可能探索各种选择。
此规则可应用于任何操作，操作组或数据输入。它可以从简单的按钮到整个操作历史。
7. 支持内部控制点
定义：
“在人格心理学中，控制源是人们相信他们能够控制事件结果的程度” - Julian Rotter
为用户提供控制和自由非常重要，这样他们才能感觉到他们负责系统，而不是相反。用户应该是行动的发起者而不是响应者。
8. 减少短期内存过载
我们的注意力有限，我们可以做的任何事情都可以让用户的工作更轻松，更好。我们更容易识别信息而不是回忆信息。如果我们保持接口简单和一致，遵守模式，标准和惯例，我们已经为更好的识别和易用性做出了贡献。
我们可以添加一些功能，以帮助我们的用户根据他们的目标。例如，在电子商务环境中，最近查看或购买的项目列表。
结论
虽然你应该始终采用基于启发式的决策，但遵循一系列规则和指南将引导你朝着正确的方向前进，并允许你在设计过程的早期发现主要的可用性问题。这八个原则适用于大多数用户界面。
你也可以使用它们作为灵感来创建自己的启发式方法，或者结合现有的示例来解决你自己的设计问题。
每当我找到一个看起来不错、干净且优雅的界面时，我都会保存它！
现在我收集了一千多张UI界面，经过反复的学习、使用或简单查看后，我认识到了一些共同点： 让我心动的颜色。
因此，在这里，我想总结一下如何在UI界面设计中创建完美颜色。
颜色就像语言一样强大。当你遇到一些设计、体验及交互很棒的app时，回想一下，视觉外观在很大程度上取决于颜色，颜色总是给用户第一印象。
那么，什么样的颜色用在实际产品上可以做什么呢？
颜色可以体现出品牌或产品的基本色调、心情、内涵、概念、品质、价值等作用。有研究表明，用户仅花50秒就可以在线对你的产品有一个心理评价，并且用户在最初的产品心理评价中有62％至90％的判断是基于产品的配色方案。 （请看下图）
正确的颜色选择可以更好的支持信息可读性。此外，它可以极大地提高可用性，例如增强号召性用语、增强导航、刺激直观的交互，满足审美需求和视觉解决方案。
总之，要创建一种清晰，和谐的颜色样式来满足用户的需求。 （请看下图，腾讯新闻利用颜色来做用户引导及导航引导，利用颜色层级更利于用户阅读。）
产品的外观是影响消费者购买决策的关键因素。研究表明，所有产品评估中的90％与颜色有关。
如今，许多公司将“颜色”（尤其是UI设计中的颜色）作为其营销策略之一。 (请看下图)
我们不能说一种颜色看起来“不好”，只有错误地使用颜色，颜色才可能看起来很糟糕。
假如麦当劳使用灰色和黑色而不是黄色和红色，你是否还有胃口？用户看到之后根本就没有任何胃口了，更不可能达成交易。 （请看下图）
女人在聚会上穿黑色连衣裙和黑色的唇膏，你是否觉得很奇怪？就不符合用户对事物的认知颜色了，给用户困惑。（请看下图）
可口可乐不再使用红色的标志改为蓝色，你还会喝它吗？喝进去你的心理上会觉得你是在喝漱口水。（请看下图）
不同的颜色传递出了不同的含义和感觉
方法①：在什么时间用户在使用你的产品，来确定你的产品颜色，比如晚上、早上、还是凌晨。再比如沉浸式体验应用晚上都会有深色夜间模式。
方法②：根据你的用户群体选择正确的颜色，你的产品是面向那一类用户，男人、女人、青年、幼儿、老年等这些人的对于颜色的认知是不一样的，比如幼儿对于颜色的认知是五颜六色，颜色亮度饱和度都偏高的，就像路边的喜洋洋1元摇摆车孩子都很喜欢。
方法③：根据产品的特性选择正确的颜色目标。产品的特性及固有特性，比如黄金就是金色的，蔬菜黄瓜就是绿色，天空就是蓝色我们不妨用产品的固有色来做设计及产品特性来做设计。
方法④：考虑颜色的心理属性，色彩对人类情绪和行为的影响在心理学分支称为色彩心理学。它指出我们的大脑对颜色有反应，而我们通常不会注意到它。当人眼感知到一种颜色时，我们的大脑就会向内分泌系统发出信号，释放出负责情绪的激素，每种颜色在我们的思维中都有自己的影响力。
红色：它象征着好和坏的感觉，包括爱，自信，热情和愤怒。
橙色：充满活力的温暖色彩带给你兴奋的感觉。
黄色：这是幸福，阳光，喜悦和温暖的颜色。
绿色：大自然的色彩带来平静和生机的感觉。
蓝色：它通常代表一些公司形象。与安全、可靠、科技有关。
紫色：是神秘和魔术的颜色。
黑色：它伴随着悲剧和死亡，象征着一个谜。同时，它可以是传统的也可以是现代的。
白色：颜色意味着纯净和纯真，以及完整性和清晰度。
为什么要谈论蓝色？
只需看看你最常用的Apps或网站、Facebook、Twitter、Microsoft，腾讯，菜鸟、新能源、智能设备、丁丁、旺旺、飞书、百度等，你会看到，它们都是基于蓝色。
蓝色是男人、女人、成人、孩子都喜欢的第一色，蓝色就像无处不在，在自然界中我们对蓝色的认知度最高，蓝色绝对是可以培养用户信任和接受的安全颜色，蓝色是UI设计中颜色的典型示例，如果没有更好的选择，我们可以使用蓝色。
我们在许多美观的界面中注意到的一件事是，它们通常在特定主色颜色上具有更深和更浅的变化。 （请看下图例子）
咱们来分析上面界面3个颜色色相、饱和度、明度的变化。就是我们ps软件里面取色器的HSB，h是色相，s是饱和度，b是明度。
通过上面的颜色分析，我们可以看出主色色相数值不发生变化还是蓝色，我们可以把主色降低明度和增加饱和度，可以使颜色变化更深。通过增加明度和降低饱和度，可以产生更明亮的色彩变化。
环顾我们四周环境空间的变化。每次扫视房间时，无疑会看到颜色饱和度和明度的变化，以及阴影和亮面的变化，作为设计师我们可以从现实中取色。 （举个例子：看下图）
总结上面的例子，我们以后在做设计的时候遇到这种纯色界面就可以利用主色的深浅变化，设计我们的界面，这种颜色搭配更和谐更美观更自然。
在进行UI界面设计时，你不能完全摆脱颜色组合。在UI设计中结合颜色很容易，但是如何避免混乱和过载呢？如何摆脱朴素并保持精致？
牢记以下两个原则：
第一个原则：
60％+ 30％+ 10％的原则是达到色彩平衡的最佳比例。通过培养一个平衡的色彩搭配，整洁，和谐的界面为用户带来愉悦感，此比例可以完美地发挥作用。而且，它可以减轻用户的视线，使其舒适地从一个点移动到另一点。 （举个例子看下图）
第二个原则：
这些规则与“黄金（6：3：1）规则”相匹配。这也是避免混乱并在配色方案中保持平衡的好方法。
1）基于“主色”，你可以在色环上创建许多变化的颜色。
有一个窍门：确定主色后，在主色的基础上添加白色即可得到亮色，添加黑色则暗色。在这里，我建议新手使用单色系方案，很容易把控。 （举个例子看下图）
主色系的搭配更容易把控，也更简洁，视觉信息容易聚焦
2）在令人难忘的时刻展示品牌主色，以增强你品牌的独特风格。在添加颜色以增强品牌在界面上的效果时，请考虑添加主色的位置、占比、数量，增强你的品牌效应，让用户对你的品牌颜色认知度更高。（举个例子看下图）
支付宝的蓝色大家应该都知道，这是支付宝首页主色的占比，只要有人给你提起支付宝你肯定会想到蓝色，这就是在界面设计里面主色的重要性
饿了么主色数量、占比、位置，增强了用户对品牌色认知
如果一个元素比另一个元素更重要，则它应该具有更高的视觉重量。这使用户易于快速浏览页面并区分重要和次要信息。 （请看下图）
汽车之家运用橘色色块和蓝色色块来做到信息视觉重量，区分视觉层级，引导用户重要信息
氧气app的顶部导航部分，新婚蜜月&内衣知识做了颜色的特殊处理，就是为了在导航部分视觉加重，引导用户点击探索
雪球理财app，一键添加按钮更加醒目，大胆的使用主色吸引用户的眼睛，引导用户添加自己喜欢的股票
在UI设计中巧妙地使用颜色可以创建漂亮的UI界面，但是创建漂亮的UI界面绝不是最终目标，实现出色的用户体验目标，使用户的生活更快乐才是关键。
因此，从UI的颜色选择和用法的角度来看，设计人员应始终记住该界面应高度可用且清晰，并以用户为中心来做我们的设计！
1. 前言
随着科学技术的快速发展和人们生活水平的急速提升，手持移动设备——智能手机、平板电脑等，已经在人们的日常生活中普及起来，特别是智能手机，已经成为几乎人手必备的产品。人们早已不局限于守着电脑来满足某项需求，通过智能手机中的APP移动应用，人们就可以获取或者发布信息，实现听音乐、购物、导航等功能需求。很明显，移动应用的内容和互动方式越来越丰富和复杂，它的普及和流行也无疑改变了人们的生活习惯，为人们提供了新的生活方式，同时也促进了APP移动应用程序的流行和发展。然而，移动应用在实际使用过程中却显露出许多不足，究其原因在于，早期的移动应用中通常直接将较为成熟的桌面应用直接套用与移动终端上。不可否认，这样做可以让桌面应用的成熟用户较为轻松、快速的使用移动应用。但缺陷在于，没有考虑到移动应用特有的交互方式和交互环境，导致可用性不高。很显然，智能手机上的移动应用和PC端的应用产品相比，有其特有的使用特性。只有充分了解移动端应用的使用特性，才能为移动应用的界面设计工作打好基础。
2. 移动应用的使用特性
2.1 使用场景
与PC端的使用不同，智能手机的使用场景较为多变，几乎不受限制。使用场所可以是室内或户外也可以是私人空间或公共场所，例如家、办公大楼、餐厅或地铁等。还可以以站着、坐着或躺着等姿态使用。正因为这样复杂、多变的使用场景，一些问题则不得不在我们的考虑范围之内。例如用户在公共场所使用移动应用时，私密性的保证；用户的使用场景发生变化时，使用的便利性和使用过程中断的可能性等。
2.2 硬件条件
近年来，为了满足用户的使用需求和提升体验感，智能手机的屏幕逐渐变大，“大屏幕”已经成为现代智能手机的一大卖点。虽然智能手机屏幕有越来越大的发展趋势，但与电脑屏幕相比，仍是相差甚远。同时，在复杂多变的使用场景中用户往往使用单手操作，与电脑的操作相比，控制精度较低，出现误操作的可能性更大。所以如何在有限的尺寸内，将内容完整且准确的呈现给用户，寻求功能和需求之间的平衡就成了需要反复思考的问题。
2.3 网络环境
用户使用智能手机移动应用的网络环境目前分为2G、3G、4G、WIFI和无网络五种。但用户在使用移动应用时的网络状况和较为稳定的PC端网络条件不同，移动端的网络环境并不是单一不变的，时常会因为环境的变化而变化。例如，某用户从家中出发，乘坐地铁要到某大型商场。其本身使用的手机为3G网络，但因为网络在地铁环境中信号不稳定，偶尔手机会变成无网络的状态。当用户到达大型商场，用户连接成功商场所提供的WIFI网络，那么用户使用移动应用则处于WIFI网络条件下。所以对移动应用进行设计时应考虑到各种网络环境的变化。
2.4 使用心态
移动应用作为一种用户贴身使用的工具，用户使用移动应用的初衷更多的是有定向和较为明确的需求点。用户希望打开应用、发布命令后，移动应用能立刻开始运作，完成任务。当操作中断或不断失败，由于智能手机移动应用的使用特性，用户很难有别的解决出口，大部分情况下，用户只能是除了等待还是等待。这样用户就极易失去耐性，最终放弃操作。很明显，快速、有效的体验过程才是用户需要的。特别是移动应用特殊多变的使用场景和网络环境，其操作的连贯性与WEB产品相比，显得尤为重要。
2.5 使用界面
在PC端上操作界面时，可以同时打开多层界面，界面与界面之间的切换转变显得较为简单方便，且PC端的显示信息较为丰富、充分。而在移动终端上对应用界面的操控就显然更吃力一些了。在有限的屏幕下，信息的展示更为局限，且实施多界面操作时较为不便，例如想实现从某一界面跳回到之前的某一界面，可能要经历多重步骤。
3. 移动应用界面设计分析
上述智能手机移动应用的使用特性正是影响和指导智能手机移动应用界面设计的重要因素，由此对智能手机移动应用界面的设计分析可得出一些设计要点，主要包括视觉层面和交互层面的设计要素。
3.1 界面的视觉设计
（1）充分考虑移动端的多分辨率
现有智能手机市场有多种系统存在，例如IOS系统、Android系统等，且不同系统的界面风格和界面交互习惯不同。同时，不同款式的智能手机持有不同的分辨率，而一款移动应用的设计是需要在其在不同系统或不同分辨率下都能适用。这就要求在进行移动应用的界面设计时，要考虑到设计画面中要表达的信息重点是否在任意分辨率下都能完整清晰的展示出来，设计的界面视觉风格是否与相应系统风格相符合。
（2）对控件的合理安排
由于智能手机的界面展示空间较小和人们对屏幕界面进行操控的精度有限，在常规控件的设计上，应考虑界面大小和用户的可触碰范围以及该控件的重要程度等因素来对控件进行设计。要做到设计出来的控件或图形易懂且易控。
3.2界面的交互设计
（1）合理精密的界面逻辑关系
智能手机的应用界面在使用时若出现逻辑上的不清晰或错误，从而需要退回至之前的某一页面是十分困难的。其次，由于展示空间的限制，在有限界面上来回寻找某项功能会让用户处于十分焦虑的状态，从而降低产品的体验感。同时，随着界面层级的加深，用户的流失量也会逐渐增加。所以，应用界面的布局和界面的层级有较为合理的逻辑关系，且将用户使用过程中出现中断、方便用户随时退出、让用户对于当下所处的位置有较清晰的认识等方面考虑其中，能使用户在使用应用时更为顺畅，有较高满意度。
（2）提升使用连贯性
当看见菊花转或进度条的界面时，我们就知道，界面中的内容正在被加载，我们需要等待。很显然在这样的加载页面前，用户将下意识将注意力投放到观察进度条的推进速度上。在复杂的使用环境下，网速变慢和信号变差是经常会出现的情况。当单调、枯燥的加载界面持续时间稍长，会给用户一种压迫感。因为用户没有办法进行别的操作，只能傻傻盯着进度条等待，最后除了取消操作，别无选择。在用户的潜意识中会形成这款应用本身就是很慢，使用起来感觉不好的印象。而针对这样的现象，近来很多应用开始有了新的尝试。从用户的心理层面出发，在一些细节上做出改善性的设计，提升移动应用的使用连贯性。例如，预加载、框架式加载、利用缓存、使用有趣的动画效果等达到提升应用使用连贯性的目的。
4. 总结
可见，用户在智能手机移动应用上的使用较PC端产品相比，在诸多方面都有所不同。智能手机移动应用的使用环境更为复杂，用户的注意力更难集中，影响操作感的因素更多多，分析、了解智能手机端上界面操作的特性对于设计出有良好体验感的应用产品尤为重要。抛开技术因素，无论在交互还是视觉方面做出细节上设计的优化，来提升产品使用的连贯性和体验感，让用户在心理层面上觉得移动产品使用起来很连贯、速度很快，这无疑是一种聪明的做法。从用户选择产品、发出操作命令、完成执行过程最后到接受操作结果，整个操作过程中的每个环节都值得设计师努力优化，减少甚至避免中断的间隙从而提升体验感。
蓝蓝设计的小编 http://www.lanlanwork.com