浅谈软件界面设计原则

　　在设计软件的界面时，咱们每每以为界面的变化万千，须要根据具体的业务逻辑和功能来设计界面，简而言之就是具体状况具体分析。有时还要靠灵感、创意。同一软件不一样人设计出来的界面每每也大不相同，软件的界面多是没有统一套路的。但我总结了一些套路，有了这些套路，可让你在大的方向上不会错，帮你节省时间。在套路的基础上发挥灵感与创意，更可能设计出好的软件界面。

一些原则

• 美观、大方、易用、既要高大上，还要接地气 (本文不讲这些)
• 不能反人类，好比左右相反，上下倒置，旋转角度。好比鼠标往上移，光标却往下。好比软件上显示的文字上下相反。
• 界面上要让用户看到后能直观地理解，软件想告诉用户什么信息。
• 界面要让用户知道操做哪里，怎么操做会获得想要的结果。
• 操做要尽可能简单，这里列出一些原则：
  • 能选不填。能让用户选的就尽可能不要让用户填写。
  • 选项之间老是要有必定的顺序
  • 选项多到必定程度要分组。还记得QQ的好友分组么？
  • 选择很是多，要有搜索功能
  • 有规律的选择，采用专用控件，支持滚动。好比选择日期。

数量与输入方式

　　只有有限的几个值，不要让用户填，而要让用户选择。
　　二选一：采用2个单选框，或者1个复选框，不让用户去填，好比填“对”和“错”。打字没有选择方便，何况还要写逻辑去避免用户乱填。
　　少许有限值：单选列表或复选列表。地方（可用于显示的面积）够大就铺开，不够大就收起来，收起来便是下拉列表。由于下拉列表老是要先点一下展开列表，而铺开不须要，因此在有条件的时候仍是铺开，让用户少点一下，方便用户。选项总数范围参考：3~20

　　当选项超过20~40个时，要将一次选择换成屡次选择。好比要选择一个区，一般是先选省，再选市 ，最后再选区。好比Windows的菜单，也是分多级。选项总数范围参考：20~100。并且每一级的选项最好在5~20这个范围，太少了选择的效率低，意味着更多级的选择，太多了难选难操做。好比100选一，就推荐设计成两级。

　　当选项超过50~70个时，每每还要提供搜索功能，模糊搜索。

　　当填写的值有不少个的时候，好比某会员系统的会员卡号可能达到几百几千个，则不合适经过选择来完成，就得让用户填写了。能够在用户填写了一部分时，列出可能的列表，让用户从中选一个，避免用户输入太多字符，同时若是用户输入错误，则得不到列表，能及时帮用户发现和纠正输入的错误。

　　有规律的，连续的值，既要支持选择，也要支持手输。如日期、时间。距离近的选择快，远的手输快。好比日期默认是今天，要想定位到昨天，用选择的快，要想定位十几年前某天（如生日），仍是输入的快。有些软件强制用户“只能选择不能输入”，这种作法不可取。

　　图片的放大缩小，永远要保持纵横比。图片的观看要容许左右旋转90度。通常还要支持放大与缩小。

　　输入一个比率，能够进滑动条或进度条，若是要支持精确，能够显示数值和接受输入数值。

状态与操做

　　两个状态之间的切换的样子有不少，好比灯泡的亮与灭，播放与暂停。这里面有个状态与操做的关系。灯亮时只有关的操做是有效的，灯来时只有开的操做是有效的。若是同时显示灯的状态和操做按钮，固然没问题，只是不够简洁。许多状况下要合并状态与操做成为一个控件，一般是一个按钮（或等价于一个按钮），那么按钮显示什么呢？好比灯灭的状况，是显示“灭”(状态)仍是显示“开”(操做)呢？不一样的软件的作法出现了分歧。多数是显示“操做”，好比播放器暂停时显示的不是“暂停”，而是“播放”，就是那个向右的三角符号。而点了按钮后状态变成“播放中”，但显示变成“暂停”，便是两竖线。

 

 

　　手机上的二态开关则是这么作的，想一想那个“飞行模型”的开关。当状态为开的时候，显示绿色，小圆点在右边，反之状态为关的时候，显示为灰色，圆点在左边。能够看做是用两种颜色来表示状态，而且不使用文字或符号来表示操做，而是统一的图形（圆点）的左、右两个位置来表示操做（其实也能够看做是状态），巧妙地避开了状态与操做的不一致性。

　　一些软件中，仍是简单地使用文字，有些文字表示状态，有些文字表示操做。图案也和文字相似，而且有些状况看起来是相反的。之后遇到二态的状况，要留意喽。别让用户摸不着头脑。

　　三选一，一般是作成下拉列表，在非下拉的时候，显示什么呢？就是显示当着选中的那个。好比音乐播放器的：顺序、随机和单曲循环。好比当前是“顺序”，用户点了“顺序”，再选择其它项。这个也能够推广到三个以上的状况。但若是选项不多，好比5个之内，能够在用户点击时直接切换到下一个，前提是这种切换不会产生反作用。好比用户想从“顺序”变成“单曲循环”，点了一下变成“随机”后，再点一下变成“单曲循环”，中间的“随机”状态不会带来反作用。假如切换到“随机”时随机播放了另外一曲，则再切换到“单曲循环”时就不是用户想要的那个单曲的，这个就是反作用。

键盘与鼠标

　　键盘的优点是键多，能够充分调动10个手指，因此打字时键盘速度远超鼠标。鼠标的优点是能跟随手的物理移动速度，既能在大范围内快速移动，也能在小范围内精肯定位。若是用键盘定位，就得使得不一样的按键对就应不一样的速度，好比方向下键光标下移一行，而PageDown键光标下移一页，这种办法除了不能移动0.5行之类的问题以外，还有一个很大的缺点是不一样的速度须要按不一样的键，操做很是不便。好处是，一行就是准确的一行，不会是0.9行。若是鼠标来打字，就得有虚拟键盘。鼠标难以快速准确地点击虚拟键盘来打字，大概是这几个缘由：1.鼠标是按键是跟着鼠标跑的，相对于手不动的，因此鼠标的移动变成了点击虚拟键盘正确与否的关键。2.键盘是有触感的，鼠标(光标)在虚拟键盘的两个键之间移到是没有触感的。3.键盘的键大小与距离是按照人手指来设计的，有标准尺寸的，而鼠标移动多大距离对应虚拟键盘中两个键的距离是没有标准的，受多种因素影响（调节）的。4.键盘打字时，移动的是手指，鼠标打字时移动的是手掌，二者的惯性大小不同，须要的能量不同，敏捷度也大不同。
讨论键盘和鼠标，是经过分析二者的特性，更好地选择它们在不一样场合为输入带来方便。有机会再铺开来说。

其它输入方式

　　录入文字，除了键盘和鼠标，至少还有两种输入方式。第1种是语音输入，便是经过麦克风将收到的声音经过AI翻译成文字。在环境声音干扰不大，AI训练成熟，说话人发音标准的状况下，正确率很高，接近百分百。速度比键盘输入要快不少。遇到偏僻字，或冷门词语，正确率就大打折扣。第2种是图片识字，一般叫OCR。与语音输入相似。字越工整，图片越清晰，识别率越高。甚至有些OCR软件还能识别必定的格式，好比表格。

 

 　　前端交互设计我不是专业的，懂得很浅。就当我是个用户，说的是我从用户的角度体验到的关于界面的道理。我把本身仅会的那点知识，整理记录下来。时间仓促，水平有限，请不吝指正。本文会继续完善的。