在此前的GDC演讲中，EA公司DICE洛杉矶事情室首席图形设计师Omer Younas指出，UI实际上只是UX的游戏内部分，他在分享中提到了3A游戏UI的设计理念，并根据详细案例先容了UI设计的很多方法。
以下是GameLook听译的完全内容：
Omer Younas：
本日我们有很多东西要说，这是紧张的内容列表，但我也希望本日的分享是互动的。我们本日不会提到移动运用研发，而是聚焦于3A游戏领域，紧张是在PC和主机设备。
开始之前，做一个大略的自我介绍，我在伦敦出生并终年夜，是四兄弟当中最小的一个，我的父亲是做电脑的，以是玩游戏是我儿时最紧张的娱乐活动之一。多年之后，我移居到了5500英里之外的洛杉矶，并且自此之后都在游戏行业事情，已经超过了10年。
左侧是刚入行时候的我，年轻、激情亲切、有络腮胡，右侧是在小岛事情室与小岛秀夫的合照。
这些是我从事过的一些游戏、就职过的一些事情室，第一张是在DICE洛杉矶事情室做的《战地1》，中间是在小岛事情室做的《合金装备5》，在此之前，我在英国的Crytek参与过《孤岛危急》系列的研发。
很多人认为UX和UI是同一件事，但它们并不是同一件事，UX是很大的一个观点，实际上从用户在商店购买你的游戏开始，到真正进入游戏体验，是一系列不断的互动。UI只是UX的一部分，从用户体验来说，UI影响的是游戏内的东西。
很多人听到UI可能都会想到菜单分布，但UI还是游戏的视觉识别符，通报游戏风格、调性以及每一个细节，通过声音、视觉、震撼等多种办法向玩家展现信息，以是也相称于用户反馈，你想在游戏里向用户表达的任何东西，基本都要通过UI来实现。
常日来说，人们想到UI，每每会想到HUD，也便是实际体验中的核心玩法，但我方向于把它看作两件事，由于我们还有前端和菜单。如果说HUD属于高下文环境式的内容，那么前端就像是游戏的详细构造。
我们都知道策划不是线性的，它就像是一团乱麻，你要不断迭代、调度，还有时候完备放弃之前做的东西。不过，我们试图让它更大略一些，通过对艺术方向和认知设计两个方面来看待，看我们是否能够让它更流畅、引领我们走出困境。
当我们谈到游戏的时候，并不肯望让玩家只看到UI，你既要让它看起来很好看，却又不能成为最前端和最中央的东西，由于你并不是想让人们玩UI，而是让他们玩游戏，UI是用来支持这些行为的。
如果没有艺术方向，你可能会做出这样的画面，所有东西都在屏幕上涌现，也没有连贯的风格，只是在同一个场景增加了数百样东西。当你想要提醒玩家康健值很低的时候，他们可能很丢脸到对应的提示，你要把主要的信息放在屏幕中间，并且让他们忽略其他滋扰信息。
一、理解你的情形
我们既要让UI具有视觉吸引力，又要担保它具有独特性。在之前的一个演讲中，有位有名设计师说要针对人的五种官能进行设计，包括触觉、听觉、视觉、味觉和嗅觉，当然这不是针对游戏行业，而且后两样在游戏设计过程中还不是主流，以是我们紧张针对前三种。
触觉指的是互动，这是游戏差异于其他媒体形式最主要的特点。
我们从平台的变革来理解游戏的输入办法，要知道这些手柄的输入办法会若何影响游戏UI，知道我们的游戏可以做若何的操作办法、以及它在屏幕上是如何呈现的。
PC平台的键鼠操作也是一样，不过还要照顾到玩家对键盘和鼠标的节制度，确保你的游戏尽可能做到原谅更多人。
声音占了用户体验的50%，你在看最喜好的电影时，可以把声腔调到0也不会有很大的影响，但游戏却弗成。只不过，我不善于声音领域的设计，以是本日我们不会提及。
我们聚焦的是视觉，这里须要理解一些关键领域的一些理论，我们如何让这些与游戏设计关联起来、如何让我们的图形具有吸引力？
这是《2049》当中的一个场景，对人的眼睛非常友好，颜色、明暗以及内容量设计都非常好，角色恰好在屏幕中间，你看到之后就能把稳到发生了什么。
在黑白模式下，这个场景也很不错，你要确保所有的内容都能起到各自的浸染，UI设计也是如此，你可以把视觉设计的这些理论直接用到游戏UI设计上。
同样，这张图可能就不那么好，虽然饱和度、光暗都不错，但对付你的眼睛来说，屏幕上有太多的东西，你要知道人们是如何认知这些信息和视觉成分的，为此，我们须要理解人类的眼睛是如何事情的。
光照到我们眼球，进入视神经，它是由很多杆状和锥状体组成，旗子暗记被传输到我们的大脑，锥状体有特定的颜色，并基于红绿蓝反响看到的颜色，我们可以从图形中看到大量的红绿颜色，蓝色则比较少。因此，我们的眼球对赤色是非常敏感的，因此在UI设计的时候我们也须要把稳，用赤色引起用户的把稳，比如危险或者主要的事情、信息。
大略来说，人们眼球聚焦的是中间红绿色的区域，向外是蓝色、黄色和亮度，这在设计UI的时候是很主要的，生物学已经见告我们在设计UI的时候该如何分布颜色。
我们将最主要的信息放在中间，次要信息放在外围。
接下来我们来看大脑对信息的理解办法，最初我们的大脑选择的是形状，因此，有特点的剪影、很大的形状随意马虎给人留下印象；第二是颜色，这和情绪以及品牌联系干系；第三是格式，这须要很永劫光才能形成，这便是我们的大脑对看到东西的理解。
在UI设计的时候，（生理学的）格式塔事理（Gestalt Theory）是非常主要的，对全体设计领域也很有影响力，我们可以遵照个中的一些规则来设计我们想展现的东西。
闭合定律（Closure），我们看到的只是一些点，但大脑很随意马虎把它理解成一个圆；靠近法（Proximity），当一些东西在一起的时候，我们的大脑方向于认为它们是一个群组的；连续性（Continuity），虽然这条线被横线隔断，但依然给人的觉得是高下流利的；相似性（Similarity），这里有很多灰色的方形和圆形，大脑会认为他们可能是一组的。
图形背景关系（Figure-Ground），只管这张图是2D，但你会看到3D形状，只是不知道哪里是前景、哪里是背景；外壳（Enclosure），你用这些灰色的圆圈将它们环绕起来，大脑就会方向于认为纵然被隔断，这些圆圈依然是一组的；还有便是对称性（Symmetry）阔别。
我们通过游戏案例来理解这些规则是如何被利用的：
这是《战地1》的一个截图，用的是不雅观察者模式，我们可以看到截图中的内容形成了闭合的场景靠近的东西都在同一片地方，包括icon也很靠近。然后是连续性，你可以连续看到不同的功能，相似性表现在强调内容都利用了同样的颜色并加粗。图形背景，这些框内的大小实际上可以变革，没有谁是背景；外壳，我们都利用盒子一样的形状将不同的功能包含在里面。
对称性可以冲中轴线看出来。
还有一些适用性方面的规则我们也该当把稳，在你设计任何屏幕的时候，都不要同时涌现7个以上的独特物品，这会让用户以为信息量太大。菜单的设计不要超过3层，功能可视性指的是一些功能要符合用户预期；你的UI还须要有一个聚焦区域，让人们知道他们在看的是什么。
你要让状态变革非常清晰，让用户点了按钮之后就可以看到明显改变；还要有页面流，让不同的内容制品级分布，还要供应帮助以及提示选择。
这是《合金装备》里的定制化，你可以看到屏幕里有7个物品，我们不肯望增加更多，由于怕让用户以为困惑。这些菜单只有3层，你只须要点击三次就可以实现定制化，每个按钮都有对应的功能，还有聚焦区域，状态变革也非常明显，内容分布也比较有序，我们还供应了帮助与提示。
实质上来说，我们设计是为了被用户高效率理解，但同时还希望视觉和谐，不能让不同的物品彼此冲突。
这时候我们就须要网络数据，最好是理解你的游戏，创意方向、艺术方向、目标市场，要将这些规律与艺术、代码、策划结合起来，确保所有人对游戏的目标同等。你须要问的是，什么是对玩家最好的？
你做的是一款游戏，但它会给玩家带来体验感，你还要理解游戏的特点，调性是什么、风格是什么？主题处于什么时期？这些都会影响UI设计。
你还可以探求参照物，比如视频、电影、书本、移动平台等等，由于你的参照物越多，就会对你的决策带来更多的信息。
你还要意识到设计趋势，业内有很多的趋势，你不肯望自己的设计被看作是PS2时期的产物，而是为新主机世代或者最新的设计方向。即便是系列游戏，也要确保每一款游戏看起来以及给人的觉得都是独特的。
二、UI处理过程
这部分覆盖的内允许多，但我们要从网格提及，它可以用于游戏里的很多方面，我们说的是20×13的网格。
黄金比例网格，你们都有手机，如果对照这个网格，就会创造它可以呈现非常令人舒适的布局。
还要把稳长宽比，目前我们关注的是16：9的比例，但你也要把稳4：3，如果人们没有最新科技的设备，你依旧要确保他们能够体验游戏，而不会看到很多东西重叠在一块。未来可能还有更前辈的科技，也不用除21：9的比例，以是你要对此保持关注。
其余，把所有主要的信息都保持在90%的屏幕之内，这个区域也被称为安全框架，比如笔墨、icon以及对UI非常主要的东西。
不要用信息填满屏幕的每一个地方，留一些空间作为内容缓冲带。
要保持UI的同等性和折衷性，纵然是右边的情形实际上也有提升的空间，要只管即便让UI布局只管即便有连贯性，加入尽可能多的锚定点。
这是《BF1》的截图，如果把它分成9块，我们可以看到9个锚定点。做UI的时候，很多信息随意马虎重叠，你要确保这些区域能够精准表达某些信息。这还意味着，当你的长宽比变革的时候，可以对应把这些锚定点和对应的信息转移。
排版
你们可以看到为什么选择对的字体很主要，我们须要看更多的信息，比如是否有法律问题、是否具有可读性，字体的风格、本地化方面的考量、预算等等。
这是《孤岛危急》的一个画面，实际上是实验中的，但由于利用的字体不适宜游戏风格，我们不得不重新选择。
6英尺规则
这条规则指的是，当玩家利用主机玩游戏的时候，他们离电视屏幕的间隔是6英尺旁边，这不仅意味着你要留神字体大小，还要确保所选字体在这个间隔范围内能够清晰地被玩家看到。
设计字体是有规则的，但我们最关注的事情是x-height，也便是o、p、b等字母同一个区域的高度。
比如这里的b和e在不同字体下的比例也是不一样的，字体越小越丢脸清，因此你要确保在更远的间隔下，游戏里的笔墨能够被玩家读懂。
不要只是大略下载免费字体利用，这在3A游戏里是行不通的，要确保你的字体支持外语字母，包括数学符号、分外字符等等。
常日来说，你要买下全体字体族，由于这对你会非常有用，专业的字体会有大量不同的表现形式，对付比较大的笔墨，利用正常字体，要担保字体不会太薄，以至于在屏幕上看不到，以是粗一些的字体适宜用于比较小的笔墨。
在同一个句子里，不要利用2种以上的字体变革，末了一行显然是个反面教材。
如果你对字体不理解，不知道该选哪一个，这个列表可以帮你开始，这些字体都是可以从主流字体网站得到的，虽然不足完美，但是不错的开始。
其余，请不要拉伸字体，由于这就像把图片中的人脸拉伸一样，人们不会喜好这样，如果要伸缩，保持比例。
在利用文本的时候，不要在同一行排太多字，最好的范围是每行60-120个字母，左对齐以便阅读。
本地化的时候，要留40%的空间用于不同措辞的字符超标（德语、土耳其语）。其余要把稳的是，阿拉伯语和希伯来语都是从右到左排列的。
这是《BF：Operation》英文版UI，右下角的箱子我们不得不重做，由于它太长了，以是在设计的时候要考虑不同措辞的UI布局。
可能很多人不知道这是什么，这是游戏标签长度的上限，比如在一句话当中，如果有很多内容组成，你就要考虑随机部分的长度，比如在玩家看到的对话中，如果要加入玩家名字，就要担保这个长度能够适宜。
这是技能是游戏标签设计最糟糕的场景，有的是用了别的形式，比如WMWM，但用这样标签是有问题的。
接下来我们要说的是形状措辞，它可以支撑你游戏的认知理解的部分，尤其是具有连贯性的形状，可以帮你的游戏形成特定的外不雅观和觉得，比如节奏、纹理、标志元素等等。
我们还须要确保形状具有连贯性，比如你在游戏里做打击动作，如果开始是上面的形状，结束是底部的形状，在UI当中就会给人很奇怪的觉得，看起来是不连贯的，角度和圆角也是一样，这些东西也要具有连续性。
这是《合金装备》里的截图，当你定制化的时候，这些元素给人觉得是它们原来便是一体的，没有什么形状给人的觉得是比较奇怪的，它们都比较适宜军本家儿题。
这是游戏里不同区域的一些东西，它们都是用了相似的形状措辞，颜色也比较同等。
这是《孤岛危急3》的截图，来自不同位置的截屏，我们可以看到不管是在哪个地方，给人的觉得都是在一个产品之内，让游戏体验具有连贯性。
图像学
要确保它们在最小化的屏幕尺寸下也能很好地展示，做到大略又不失落多样化，确保斜视情形下也能准确地看到形状，这才是好的icon，屏幕上的icon最大尺寸为1英尺 X 1英尺。
要得到出色的icon设计，你首先要有布局网格，以便让你的icon在UI当中显得自然而具有连续性。
你还须要设计icon参数，以便让人们为你设计icon，或者理解你的icon设计。
对付icon，我们还要做平衡，只管三角形和圆形没有占那么大的空间，但我们依然要对它的大小进行调度，让我们的icon看起来是连贯的。
比如这些icon，它们虽然霸占的空间不同，但尺寸都在同样大小的正方形内，只管在数学上并不完备相等，但至少它们给人的觉得是同等的，你在UI设计的时候该当把稳，这样做可以确保视觉和谐。
轮廓与可读性：测试icon不同视角的觉得，由于这会影响不同间隔下的icon效果，只管由于玩法的缘故原由它们之间的差别很小，如果不能第一眼就看出icon是什么，那么玩家很可能会错过一些主要的功能。以是，你要在游戏里测试不同的效果，看哪些有用，哪些不好用。
有时候icon给人的觉得还可能是模棱两可的，以是有时候可能须要用笔墨标注其含义，如果你没有看到这些阐明的笔墨，可能很多人不知道这些icon是什么意思。
这张图当中，有些icon可能会模棱两可，但有了注释之后，所有人都知道它们代表什么。
确保你的每一个icon都有连贯的风格，这不仅与形状措辞有关，还和游戏的视觉识别度有关，也便是把你的艺术方向展示到每一个icon当中，有时候它们乃至可以取代笔墨，有了识别度较高的icon，你可以节省大量的UI空间。
比如这些icon，它可以拥有不止一个意义，以是这类属于模棱两可的。
颜色生理学
颜色在情绪表达和品牌方面扮演很多的角色，我总体来说，我希望你们不要依赖于颜色，只管它对品牌推广有用，但颜色可能会被以不同的办法解读。
很多人可能都知道颜色理论，如果不知道，你们可以专门去搜索（Color Theory），很随意马虎理解。
但是，在不同的文化背景下，每个颜色都可能有不同的意义，以是在利用颜色的时候，你要把稳不让它搪突特定用户的文化习俗。由于你的游戏是3A，以是将会被环球玩家体验，以是在设计颜色之前要考虑颜色在不同文化当中的意义。
总体来说，我们还要限定利用的颜色数量，最好是5个以内，当然，每一个颜色最好都有其目的，避免完备饱和的颜色。
这是《孤岛危急》的另一个案例，我们利用不同颜色表示按钮的不同状态，这些颜色非常适宜军本家儿题，我们并不完备依赖颜色，但它们的确可以带来视觉理解上的帮助。
这张图的右侧我们可以看到，不同的背景色也会对形状带来很大的影响，以是在设计UI的时候要考虑到，设计独特形状的时候，不同背景下它们可能被用不同的办法解读，你最初的设计可能会行不通。
《孤岛惊魂4》截图
这是《终极抱负15》，他们在屏幕中央利用了赤色，很随意马虎引起玩家把稳。
色盲征象也是游戏不能过于依赖颜色的另一个缘故原由，以是我们在选择颜色的时候须要把稳。
这些是不同的色盲，包括红、绿和蓝色盲。
很多的3A游戏都会关注色盲，不过你也不肯望只为一小部分用户设计，以是最好是给用户自定义颜色的功能，让他们选择自己以为舒适的颜色。
UI呈现
这些看起来是非常高层次设定的东西，比如non-diegetic、diegetic，Spatial、Meta，前两个是与电影有关，它们的呈现办法和剧情干系。
常日来说，大多数游戏看到的是Non-Diegetic式UI，它与玩法关联不大，用户实际上不须要和UI互动，就像是游戏天下上重叠了一层UI。
Diegetic是和游辱弄法互动的，它们被设计在游戏天下之内、玩家们可以看到乃至能直接互动，我个人比较喜好这类UI。
Spatial UI常日与笔墨、角色轮廓等方面联系在一起，更多与效果有关，比如《末了生还者》和《神秘海疆4》都有角色轮廓。
Meta UI并不是要特意见告你什么事情，只是表达一种屏幕效果。
不过，很多游戏里利用的标准UI风格并不虞味着它便是最好的，比如这张图中的喷鼻香蕉（由于形状很像），它只是用2D素材呈现了3D效果，当我体验FPS或者TPS的时候，这些东西是2D的，你不知道某些东西是在你的上方或者下方，这些东西可以见告你方向，但无法呈现空间感，比如高下前后。
如果你要用2D办法表达3D信息，不要照搬所有人都在用的方法，最好是探求其他办法来呈现，由于这可能无法被玩家准确解读，比如《合金装备4》的办法就很不错。
2D美术:2D彷佛与UI的所有方面都有关系，比如具有识别性的东西，我们如何呈现给玩家,包括一些屏幕截图和加载界面。
引擎知识
理解我们的局限，做UI的时候我们须要知道引擎的限定，你须要什么样的技能、如何充分利用系统、如何做文档以及测试等等。
引擎方面比较好的一点是，我们可以利用着色器。
比如从最左侧的根本UI美术，逐渐加入阴影、模糊效果，到最右侧对眼睛越来越舒适。
这是加了扭曲效果的另一个案例。
我们在《孤岛危急》当中就做了类似的事情。
我们的UI被映射到了多边形中，我们将着色器效果运用到这些多边形中。
你还可以用引擎做更多3D方面的事情，比如场景，将你的UI与环境组合在一起。
在考试测验的时候会比较有趣，你可以将UI与玩法联系起来，可以常常测试，由于你不肯望UI与游戏无关。
三、实行
常日来说，实行UI紧张利用PS、AI和AE三个软件，我非常喜好用Illustrator。
光栅有它自己的局限，但你可以用vector乃至用Polygon。
而且你还可以用Illustrator做很多的模型。
做数据模型的时候，你希望搞清楚UI的不同部分，确定你的风格、主题，通过Illustrator你可以考试测验很多东西。
通过不同icon的效果，你可以让人们理解游戏里发生了什么，选择按钮的时候让它们具有连贯性。
UI总要尽可能大略，这是前端截图，包括形状措辞、字体、颜色等。
做事器界面看起来比较拥挤，但你须要让这些信息被用户很随意马虎理解。
定制化比较繁芜，但这里你可以增加很多的diegetic元素，将UI与玩法领悟在一起。
末了是回合结束。
这是《战地1》不雅观战模式早期的UI，界面展示的东西太多了。
动态模型也是很随意马虎引起玩家把稳力的一个元素，只须要大略的动画就好，它须要与你的美术风格同等，我们可以通过示例看到，动态UI对你通报的信息有很大的影响。
这是很大略的动画，但展示了你可以用很整洁的动画，也可以用夸年夜的动画，或者用科技感的动画。
有时候，展示动画比很多的描述都更随意马虎被玩家理解，比如这个案例。
即便是游戏发布之后，你的UI也是可以一贯提升的。
比如这是《孤岛危急3》的多人玩法UI，我们可以看到它的持续变革，终极版本与最初有很大的差别。
四、隐蔽成分
末了我们须要理解的是隐蔽的成分，这些东西是会影响UI的，因此你须要把稳。
比如本地化，你须要给有些措辞版本留出40%的文本空间，不同颜色在不同文化中的意义，以及一些可能在某些文化里比较具有搪突性的标志。
技能哀求，这与游戏要上架的平台干系，在研发主机游戏的时候，你须要清楚这些哀求，但还须要理解屏幕尺寸、输入操作、加载韶光等等。
末了要说的是，UI也可以做到没有UI，比如粒子效果、角色动画、音频提示等等，这些都可以替代UI。
设计UI的时候我们不能做令人困惑的布局设计，也不能直接从其他游戏里抄袭，你须要为自己的游戏设计独特的风格。
五、总结
首先是研究，你须要对设计有整体的理解，然后为你的游戏有针对性地设计风格、主题，在做任何事情之前，确保你理解这些设计理念。
视觉辨识度，排版、形状与icon以及颜色等多种元素的组合，可以让你的游戏拥有自己的风格，找到一些独特的东西，选择好的字体。
实行，在理解以上理论之后，你须要做不同的考试测验，让人们更随意马虎理解游戏的体验流程和UI布局。
考虑到一些隐蔽成分，比如平台限定、本地化可能带来的问题。
UI就像是个忍者，这是玩家们把稳不到的，但当被人们看到的时候，意味着你实行的很不错。