APP设计当中不容忽视的20个小细节

在非常感谢来自腾讯的庄晓文设计师的精彩语录。

1、一致，一致，还是一致 

你能做的最重要的事情就是保证用户界面运作的一致性。对于列表框来说，如果双击其中的项，使得某些事件发生，那么双击任何其它列表框中的项，都应该有同样的事件发生。所有窗口按钮的位置要一致，标签和讯息的措辞要一致，颜色方案要一致。用户界面的—致性使得在用户对于界面运作建立起精确的心理模型，从而降低培训和支持成本。

提炼：一致性体现在 色彩搭配和运用、字体的运用、相同的交互效果等。

一般我们使用的色彩不超过3种。交互效果也不超过3种。

2、建立标准并遵循之 

在应用软件中保持一致的唯一途径就是建立设计标准并加以遵循。最好的办法是采取一套行业标准，对自身特殊的需要加以补充。已有的行业标准，如IBM标准(1993)与Microsoft标准(1995)，通常可满足95％到99％的需要。采用行业标准，只需利用已有的成果，也使你的应用软件看起来或感觉上更象用户已购买或建立的其它应用软件。应当在定义基础构造阶段就建立用户界面设计标准。

严格按照移动APP规范来设计，比如字体的大小、间距、图标的大小等等。

3、阐明设计规则 

用户要知道怎么使用你为他们开发的软件。软件运作的一致性表明，规则你只需解释一遍。这比一步步详细讲解如何使用应用软件每个特性要容易得多。

可以制定属于你的一些工作方式和设计规范。

4、同时支持生手和熟手 

图书馆目录符号对图书馆系统的一般用户来说，也许就够用了，但对熟手用户，如图书管理员，很可能就没有那么有效了。图书管理员是受过专门训练，能够使用复杂的查询系统找到信息，因此，应当考虑建立一套查询界面以满足他们的独特需要。

 

 

5、UI界面间切换很重要，也必须重视 

如果从一个屏幕转换到另一屏幕很困难，用户会很快灰心并放弃。当屏幕流程与用户想完成的工作流程相符，此软件对用户才有意义。由于不同用户工作方式不同，应用软件需要有足够的灵活以支持他们不同的方式。在建模阶段，界面流程图可用来模拟屏幕之间的流程。

6、界面上的布局很重要 

在西方，人们是自左而右，从上而下阅读，基于人们的习惯，屏幕的组织也应当是自左而右，从上而下。屏幕小部件的布局也应以用户熟悉的方式进行。

7、讯息和标签措辞要适当

屏幕上显示的文本是用户主要的信息源。如果文本措辞很糟，用户的理解就会很糟。要使用完整的措辞和句子，而不要用缩写和代码，使文本易于理解。讯息措辞要积极，显示用户处于控制之中，并提示如何正确使用软件。

如，下面哪一条讯息更吸引人： “你输入了错误信息”还是”帐号应为8位数”?此外，讯息措辞要一致，在屏幕上显示的位置要一致。尽管这样的讯息”须输入名字”和”应输入帐号”分别来说措辞上没问题，放在一起就不一致了。

根据第一条讯息的措辞，第二条讯息更好的措辞应当是”须输入帐号”，这就使得两条讯息措辞一致了。

8、了解小部件工具 

为恰当的任务使用恰当的小部件，首先可以帮助增强应用软件的一致性，可能使得应用软件很容易构造。学会如何正确使用小部件的唯一途径是阅读和理解你们所采用的用户界面标准及准则。

9、对其它软件不盲从 

除非你知道一个应用软件是遵循了你们的用户界面标准和准则，否则你绝不能认定它做的都是对的。尽管看看人家怎么做，从中获得些主意是不错的想法，但在懂得怎样区分用户界面设计的好坏之前，你得留神。太多的开发者错误地模仿其它应用软件的用户界面，而那些界面却设计得很糟,最好将界面设计的美工外包项目请专业的设计外包公司来完成。

10、颜色使用要适当 使用颜色要谨慎 

如果使用了，也要使用指示符。问题就在于有些用户可能是色盲一一如果在屏幕上使用了颜色来突出显示某些东西，假若想让色盲的用户注意到，那么需要做些另外的工作来突出它，如在其旁边显示一个符号。颜色的使用也得一致，以使整个应用软件有同样的观感。此外，在不同平台上，色彩的表现不尽人意一一在一个系统上看上去很好，在另一个系统上常常看上去很糟。展示会上我们经常听到展示者这样说： “在我家中的机器上看上去可是很好的呀。”

11、遵循对比原则 

打算在应用软件中使用颜色，要确保屏幕的可读性。最好的方法是遵循对比原则：在浅色背景上使用深色文字，在深色背景上使用浅色文字。蓝色文字以白色为背景很容易读，但以红色为背景很难辨认。问题出在蓝色与红色之间没有足够反差，而蓝色与白色之间则反差很大。

12、字体使用要适当 

老式英语字体可能在莎士比亚的剧本封面看上去很合适，但在屏幕上却很难认。要用那些可读性好的字体，如serif或Times Roman。此外，字体的使用要一致。节俭、有效地使用两、三种字体的屏幕看上去远胜于使用五、六种字体的屏幕。要记住每次改变了字体的大小、风格(粗体、斜体、下划线，……)、样式或颜色，都是在使用不同的字体。

13、灰掉而不是移走 

在某些时刻，用户经常只能访问应用软件的某些功能。在删除一个对象之前，要先选中它，由此加深用户的心理模型，软件应当用删除按钮及(或)菜单项去做一些事。按钮应当移去还是灰掉?灰掉它，决不能移走!当用户不该使用时就灰掉它，可使用户对如何使用应用软件建立精确的心理模型。如果仅仅移走一个小部件或菜单项，而不是灰掉它，用户很难建立精确的心理模型，因为用户只知道当前可用的，而不知道什么是不可用的。

14、使用非破坏性的缺省按钮 

通常每个屏幕定义一个缺省按钮，如果用户按了回车键调用此按钮。问题是有时用户会意外敲击回车键，结果激活了缺省按钮。缺省按钮决不能有潜在的破坏性，如删除或保存(也许用户根本不想保存)。

15、区域排列 

当屏幕有多个编辑区域，要以视觉效果和效率来组织这些区域。如图1所示，编辑区域左对齐是最好的方法。换句话说，要使编辑区域左边界在一条直线上且上下排列。与之相应的标签则应右对齐，置于编辑区域旁。这是屏幕上组织区域的一个整洁有效的方式。

16、数据对齐要适当 

对一列列的数据，通常的作法是整浮点数右对齐，字符串左对齐。

17、屏幕不能拥挤 

拥挤的屏幕让人难以理解，因而难以使用。实验结果显示屏幕总体盖度不应超过40％，而分组中屏幕盖度不应超过62％。

 

18、有效组合 

逻辑上关联的项目在屏幕上应当加以组合，以显示其关联性。反之，任何相互之间毫不相关的项目应当分隔开。在项目集合间用间隔对其进行分组／或用方框也同样可做到这一点。

19、在操作焦点处打开窗口 

当用户双击一个对象显示其编辑／详情屏幕，用户的注意力亦集中于此。因而在此处而不是其它地方打开窗口才有意义。

20、弹出菜单不应是唯一的功能来源 

如果主要功能被隐藏起来，用户就不能学会怎样使用软件。开发人员最让人灰心的作法是滥用弹出菜单，也称作上下文相关菜单。一种使用鼠标的典型方法，是用来显示一个隐藏的弹出菜单，提供针对当前工作的屏幕区域特定功能的访问。

这20个在APP设计当中不容忽视的小细节，仅供大家参考。毕竟每个人都有各自的一些看法和理解。

最后老谭同学再跟大家分享几个APP设计知识点： 

1、AI线框,PS视觉是比较常用的，在这里推荐下FW，线框视觉都是可以的，也比较方便。就是用得人不多，但是这个软件上手快,可以推荐使用。

2、Icon当然要按合适尺寸做，但是你要打出来的话,分辨率要在300，而UI的分辨率一般是72，分辨率还是要改一下，否则打出来没法看，不管怎么样，保存好源文件。IOS系统界面里,工具栏及图标的大小，建议题主找一下设计规范，没有特别固定的值，但是不能差太远。

3、Icon：桌面图标114*114，标签栏图标<=60，导航条图标40*40，APPstore图标1024*1024

控件：状态栏40 标题栏 88 标签栏 98 导航栏按钮 60 列表高度〉=88

字体：大 40 中 34 小 24（如果太小就看不清）

文章来源：25学堂