游戏

UI 设计的 15 项黄金法则

好友曾向我展示了最新的

iPhone 和 iPad 版《极品飞车》。游戏的渲染效果令人印象深刻，是款蓄势待发的优秀

游戏。但是，游戏的前端是典型的

UI 设计偏差案例。但界面中有大量的属性数据等内容，它在玩家没有时间做决

定时提供了过多的内容。这些内容能够显著改变他们的游戏体验，但却在玩家往往感受不到变化的时候呈现。
这促使我开始思考

UI 设计的黄金法则。以下是我认为创造最佳体验应当使用的 UI 设计方法。坦诚地说，这些规

则只是通用做法，并不完全适用于你的

UI 设计中的所有情况。

1、开始游戏所需按钮点击不超过 3 次。id 可以在网络游戏（游戏邦注：如《雷神之锤 3》）中实现这点，所以你
也可以做到。玩家不希望游戏不断地向他们呈现需要他们去理解甚至会影响到游戏的数据。玩游戏是他们的首要
想法。你不可在

15 分钟的首次游戏体验前添加长达 20 分钟的内容介绍，这会让玩家抓狂。

“

”

、隐藏复杂性。高级标签的作用就在于此。在将玩家引入游戏玩法体验时，所有当前不相关（游戏邦注：比如

任何默认且不太可能改变）的内容都需要被隐藏到其他对话框中。这种想法不是说要移除游戏的复杂性（这也算

是种恰当的做法），而是不需要立即呈现这些复杂内容。当然，你可以允许玩家改变参数，但是不必要求甚至强

迫他们查看能够改变哪些参数。那些想要做这件事情的人自然会找到可以帮助他们实现目标的选项，但是要记住
的是，试图改变参数的玩家比例不足

50%。对于 50%以上的玩家，你只要呈现无需他们更改的选项和功能，因为

过多的选择只会让他们备感困惑。

3、在同一个地方向玩家呈现所有信息。保持信息呈现位置的一致性。你需要引导玩家查看某个地方而且只需查看

这个地方就能够获得所有游戏信息。当然，信息呈现方面有个技巧，就是对信息内容进行过滤，这样玩家就无需

去注意过多来自游戏或其他玩家的信息，信息量过大可能会导致玩家丢失关键信息。但这是信息的过滤层面，留

待以后作深入探讨。必须注意，如果你只是高亮显示错误或遗漏的输入内容，也算未遵守这个规则。当你在网页
页面中填写表格时，它们经常采用的就是这种方法，这当然是允许的。但是，如果你要这么做，不要只使用文字

颜色来暗示错误，这会给色盲用户带来不便。你需要做的是反向高亮文字内容，所以不要只将不当文字显示成红
色，还要将背景显示为红色。这样，即便是色盲用户，也能够领会到输入错误。
4、过滤信息，呈现含义。能够呈现信息固然很好，但是你分享的信息越多就越好吗？从某种程度上来说，情况确

“

”

实如此。但是，如果信息大量涌向用户，他们就会感到反感。你确定要这么做？等重复性信息会成为垃圾信息，

会被用户忽视或直接点击，而垃圾信息过多会使用户忽略重要信息。设定重复性对话框的呈现冷却时间是种不错
的做法，比如

次呈现某个对话框后，在预设的时间内不再呈现该对话框，可以将预设时间设定为上次对话框呈

现的

5 分钟时间内。通过这种方法，用户就无需不断点击相同的对话框，也就不会受这些信息烦扰。

允许用户过滤某些信息类型也是个不错的做法。比如，允许用户忽略来自脚本系统的警告或信息。这需要对信息
进行恰当分类，这样系统才能识别其属于哪个类别。虽然麻烦，但却是可以采纳的做法。
而且，在某个地方保存所获得信息的列表（游戏邦注：指未经过过滤的所有信息），同时确保用户知道这个地方。
这样，如果他们需要这些信息，可以随时查看。
对于信息的呈现，还有点值得一提：将他们所做出改变的含义告知用户很重要，尤其是工具。如果用户在虚幻编

“

”

辑器中点击所有内容使用动态光照按钮，那么需要告知他们此等做法会对帧率产生的影响。使用在屏幕上通过

显示文本来解释每个按键作用的传统方法往往是不够的，因为内容或其他设置的不同经常导致某种控制产生的影
响发生变化。如果只是

2000 poly

“

”

场景中的单个对象，那么设置所有内容使用动态光照不会产生负面影响，只

有当在

10000 poly 世界中渲染 400 个对象时，负面效果才会明显。所以从根本上来说，我的观点是要对控制改

变可能引发的其他改变进行内部分析，将其与可能对用户产生极大改变的其他影响方法相比较。再次强调，注意
对话框和信息的呈现次数也是必要之举，因为总是会出现某些特殊事例，使得应用认为用户提出的是非意愿行为

要求，因此而不断发出警告。
5、保持所有 UI 呈现内容一致性是关键。有些做法是显而易见的，比如应用中可以使用单选按钮或复选框，但是

不可融合使用这两者，在所有对话框中，保持所使用文字类型、字体和大小的一致。但是，还有些更为精致的东

西。比如，如果你需要在工具中提供路径，保持使用浏览器按钮，不要期望用户会直接输入路径。

XCode 便是个

绝佳的反例。还有个不错的做法，使用滚动栏而不是要求用户输入数值，但可以仍支持用户使用数值输入方法。
数据输入最重要的部分之一是从一开始就避免用户输入不良或冲突性数据。应用程序中有许多代码可以处理不良
数据，但是从一开始就杜绝不良数据的输入是个更好的方法。这正是使用预设下拉菜单的原因所在，因为你就可
以确保程序不会获得拼写错误的单词以及不良的数据。
6、如果能够实现无需用户输入内容的话，就采用这种方法，这是第 5 点的扩展。预设下拉菜单标签或者在需要用
户输入的地方提供默认文本，这样如果用户不愿意的话，就无需自己动手输入任何文本。所有东西都应当有默认
选项。
7、可以设置通过多渠道查看相同对话框，Windows XP 在这一点上做得很好，允许用户通过多种途径打开相同的
控制对话框。这样做是可以接受的。应当注意，在使用这种方法时，应当保证对话框本身的一致性。无论你通过
何种渠道打开对话框，它们都是完全相同的，包括外观、表现和功能。
8、控制设置于相同且唯一的地方，这是第 6 点的扩展。同种控制只应当存在于单个对话框中，而且不可设置外观
看似相同但功能不同的控制，这会让用户在理解上遭遇困境。同样，

XCode 在这个方面做得很不好。

9、对话框深度不可超过 3 层。如果你制作的是 RPG 游戏的话，或许可以设置 4 层。对话框深度设置的底线是，不

可让用户对他们所处的位置、正在做的事情以及原因感到困惑。你还需要在对话框树中呈现他们所处的位置，添

加后退键固然不错，但是一个小的对话框树指示器会显得更好，可以参照

Windows 系统资源管理器的做法。