后使用快捷导航没有帐号？
　论坛入口：
　　|　　　|　　　　|　　　|　
《英雄联盟》游戏中界面交互研究(下)：UI更新
游戏类型：端游/微端&　　设计类型：【功能/模块/UI】&
u=&fm=21&gp=0.jpg (15.2 KB, 下载次数: 10)
10:38 上传
　　文/Olic!
　　关于UI圈，最近流行这几件火热的事情
　　第一件是朋友圈热传的【2016 UI设计失业潮来了！】
　　后来又看了庞门正道门主的【2016我要失业了？我(UI)自己特么都不知道！】
　　两位的名字一看都是网络上的大神级。小编只能说“段子手”无处不在。
　　言归正传，今天我们接着来聊聊《英雄联盟》界面更新的交互设计。首先，接着上次的话题，继续来看看游戏中界面ui更新交互研究。
QQ截图55.png (346.29 KB, 下载次数: 9)
10:32 上传
　　装备栏从左下角移动到了中间下面偏右的位置，很多玩家也对这样的处理表示出不习惯，Riot在做这样的调整时候，目的是想将决定战术性思考的信息集中在正下方的位置，便于玩家进行查看且能够将界面更加简洁而使得游戏战斗场景的可视范围更大，更好的在游戏中体验。
　　装备栏的本身结构没有变化，只是在位置上做了一个调整，只要玩家多玩几盘适应了以后对装备界面就有了一个习惯。
　　技能状态栏
　　这一个状态栏对于玩家来说是最重要的，从历史的版本来看，都一直放在画面的中下部，玩家对这些信息的把握非常重要，所以要给予玩家更多的辨识度。5.14版本针对以前的版本，在技能的升级、冷却和魔法值不足情况下的三种状态做了不同的调整。首先是对升级时的技能状态，如图中可以看到，新版本是直接在技能icon的上方有一个图标表示，用向上的箭头隐喻可以进行升级，相比较之前的用＋号，从格式塔心理学的角度上来看，能够更好的理解升级图标与技能图标之间的关系，并且他们的关联度更高，让玩家一眼就能够了解其之间的关系，这里的表现更加符合用户的视觉习惯和使用习惯。而老版本是在技能栏框的上方做的“＋”号表示，这里两个内容的相关性就不会有之前的那么高了。
4.png (105.95 KB, 下载次数: 9)
10:30 上传
5.png (127.28 KB, 下载次数: 9)
10:30 上传
6.png (123.83 KB, 下载次数: 9)
10:30 上传
技能cd表现对比
QQ截图16.png (265.82 KB, 下载次数: 9)
10:34 上传
　　再看看冷却和魔法值不足情况下的改变，在老版本当中，技能冷却的过程与是用的紫色底和白色字来进行区分。在紧张激烈的游戏战斗过程中，玩家对于这些信息的识别一般都是扫一眼后就决定了自己的行动，战斗场景中，玩家的注意力全部在中央的区域。精神集中在战斗画面。5.14版本做了一个优化，将非cd和cd技能做了黑白和彩色的区分，并且用浅蓝色的圆和对比度比较高的数字来进行表示，这个版本相对于之前的版本，在使用体验的过程中，我们依然能够感受到对这里信息的获取有一些困难，非填满整个技能icon的颜色区分并不能有效的将信息传达给玩家。所以在之后的版本，设计师对这里的设计进行了优化，用增强对比度的方式（颜色，字体等）对技能的几种状态做了更好的区分，能够让玩家更好的获取这些关键信息，从心理学的角度上来看，人们对周边区域的变化是非常敏感的，所以加大对比度能够让玩家更好的去把握游戏和自己的状态，更好的参与到战斗中。
　　影响策略性思考的信息
　　这里的信息主要是那些决定性信息（比如技能状态、血量、魔法值）以外的但又对场上局势有很大影响的信息。就像笔者之前举的例子，也许你打够了钱，可以在第一次回家时就买到暴风大剑。在你回城之前，你会有几个问题要考虑：战线的推进情况如何？对方的打野在哪？你的辅助到6级了么？和你的对线对手相比，你的跟进能力如何？龙刷了么？这些信息也左右我们的行为和决策，在老版本的游戏内用户界面中，这个信息分散在整个屏幕上，从小地图到右上角，屏幕左侧，甚至是TAB菜单中。通过这次用户界面更新，官方的说法是正在将这些问题的所有答案都集中到小地图上，因为玩家会自然而然地去那里获取此类信息。我们认为这个群集创造了一个汇集了各类信息的策略指挥中心，并且能够让玩家更好地知晓地图整体状况。官方希望把所有的信息整合，方便我们能够更好的去获取信息，而不是在界面的四周来寻找，比如说我们正在下路打钱，这个时候我们看了下小地图，发现上路正在开战，这个时候我们想去看一下队友的状态，目光转向界面的左边，寻找队友的状态，看到其中一个队友濒临死亡，我们想快速前去救援，然而这一来一去发现已经来不及了。所以在新版本（5.15）中将队友的头像集中于小地图的上方，这样信息的整合有利于玩家做出更好的操作和对战局有着关键作用的行动。5.15同时将比分和KDA的信息也整合到了地图上，也是因为这样的一个原因。然而在使用的过程中发现，玩家对于这些信息的获取并不好，字太小，很难查看到，图标太小，点击不到，这些都影响到了玩家的游戏体验，玩家在查看这些信息的时候反而要花去更多的注意力和精力，这反而有悖于设计者的初衷。所以在之后的版本上，将KDA和比分等信息重新放回了右上角，将队友的头像加大放在了地图的上方，这样的优化笔者认为是非常出色的，这里小地图信息的整合，从设计理论的角度以及从用户体验的角度做了一个综合，顾及到玩家的习惯和对设计本身的思考。
7.png (186.95 KB, 下载次数: 9)
10:30 上传
　　同时在队友的头顶上增加了队友大招的cd图，帮助玩家更好的把握队友的状态而做出决策性的行动，这里的设计有助于玩家对战局整体信息的知悉和与队友的配合时机，对于游戏战斗是非常有用的。
　　其他易用性的信息优化
　　1. 记分板的再设计
　　记分板的移动，水平地列出两支队伍，并且增加了拖拽功能，好让玩家们能够改动排列顺序，例如以中单对中单等顺序排列，或者凭自己的想法排列等等。新的记分板还会按价格顺序列出玩家的装备，也就是说你可以看出谁的输出是最高的，或者谁最能够承受住敌方坦克们的猛烈攻势。最后，防御塔的信息也压进了记分板中，也就是说玩家们可以在按下TAB键的时候看到所有重要信息了。
8.png (134.79 KB, 下载次数: 12)
10:30 上传
9.png (230.18 KB, 下载次数: 9)
10:30 上传
　　这样的优化不仅对信息的知悉有了一个策略性的认识，同时能够知道战局中很多细节信息的把握，而这些信息对于整个游戏过程的战术安排和决策都会有有些影响。
　　2.发信号的优化
　　我们在游戏中可以在地图上发信息来使得队友知悉当前的一些战斗情况，5.14版本取消了发信号的符号，而直接可以点击发送，从官方的说法上来看，设计师对于玩家在游戏中的行为，在发送信号的时候并不会用这些符号信息，所以为了更加快捷方便的游戏体验而取消掉了这些符号的显示，然而许多用户已经习惯了这些信息的显示方式，并且在游戏中也会频繁的使用这些符号，在新的版本中（5.15），LOL又把这些信息重新添加上来了。
10.png (124.39 KB, 下载次数: 9)
10:30 上传
　　英雄联盟历史版本的比较与分析
　　英雄联盟从11年到现在已经有4年的时间，而作为一款长盛不衰的产品，其乐趣能够让玩家一直向往，也是游戏行业需要学习的东西，其界面的演变也基本上有了四个版本的变化，我们可以看一下其变化的方向和趋势。从界面上我们能够很明显的察觉到界面其他元素的减少和对信息的整合处理，这是否是一个设计的趋势或者潮流？我们从几个方面来对这样的设计进行一个研究。
　　（第一代版本）
11.png (406.54 KB, 下载次数: 9)
10:30 上传
　　（第二代版本）
12.png (377.46 KB, 下载次数: 9)
10:30 上传
　　（第三代版本）
13.png (345.31 KB, 下载次数: 9)
10:30 上传
　　（第四代版本）
14.png (308.55 KB, 下载次数: 9)
10:30 上传
　　1.游戏元素
　　Jesse Schell在其著作《the art of game design:a book of lenses》中对游戏元素分为四个分类：实现技术、游戏机制、故事设定和美学表现。这些游戏元素在最好围绕一个独立的主题进行设计，好处是游戏中所有元素会为乐同一个目的而运作，而且会互相加强。比如在英雄联盟游戏中，主题之一就是游戏中的战斗，我们所有的游戏机制，视觉表现无一不是在为战斗做准备，那么在这样的一个主题下，我们的界面从最开始的版本到现在的版本有了一个非常大变化，而这些变化的初衷就是要提高用户的战斗体验，让玩家更好的融入到游戏战斗中来，有更多的注意力在战斗中。从游戏的第一个版本到现在的版本，界面从繁到简，信息的不断整合和优化，让现在的界面看上去有很少的视觉障碍，所以在整个的设计变化过程中，游戏元素之间的相互结合来对游戏主题的不断加强才能让玩家更好的体验到游戏的乐趣。
　　2.游戏体验
　　更加规整的游戏界面和信息的整合帮助玩家更好的沉浸在游戏的战斗中，最初的游戏界面有些繁琐，对于新手玩家来说确实很难一下子就掌握，有较高的学习曲线。而经过版本的不断迭代，界面的简洁化也让玩家能够较容易的理解界面内容，并且为更多中间用户的玩家提供更好的信息支持。从界面动效的表现上，也让玩家有更多惊奇的发现，提升玩家的兴趣，调动玩家的情绪波动。越发简洁的界面能让玩家更好的沉浸在游戏中，而那些主要信息的呈现在玩家需要的时候又及时的给予反馈，提升玩家在游戏中的体验。
　　在新的界面当中，我们可以看到设计师为这些改变的初衷和动机，确实是为了更好地实现游戏ui的易用性和清晰度。“在试用的过程中，确确实实地感到了不适，作为一个交互设计工作者，我也在思考，明明在做设计的时候考虑得很周全并且做了很多的换位思考，而且从职业角度来看，这是很出色的优化，但为什么会这种不适（大范围的）。”一位交互设计师在这次ui变化的反馈中提到。
　　“摒弃设计的规范和原理，无视所谓的易用或者策略性思考，我发现自己是对于界面整体的不平衡而感到不适应。前一版本的界面和优化版本相比信息分布在屏幕四周，似乎是太不够紧凑，也有影响视野的嫌疑，但是将精神集中在屏幕的玩家来说，这样四周分布的感觉，是平衡的，存在于视野的边缘，也隐身于视野的边缘。稍一定神就可以看到对应的信息，然后再聚焦在屏幕战斗区域的某处，这个转换是很迅速的。新版的信息结构是很紧凑且合理，但是在游戏时将视线聚焦在战斗区域的时候，右下放界面的存在，就好像一块卡在喉咙里的鱼骨，不断提升着自己的存在。而真的需要在这个区域寻找对应的信息时，我个人的感受是如果不用多一点精力来适应的话，是比较耗费时间的。”
　　在游戏的界面设计中，我们很难去真正定义UI到底是个什么样子，以用户为准，难免会被用户的一些习惯和个性所影响，以设计思维为准，真正的玩家对于界面的感受也不容忽视。我们需要从多方面考虑，兼顾玩家和设计者的心智模型。来对界面进行深入的思考。
　　交互和视觉要为我们的游戏主题服务，包括音乐，音效，操作等等，如何加强我们游戏的主题，比如英雄联盟的游戏主题之一就是战斗，让玩家沉浸在这种团队的合作与战斗当中。如何让游戏带调动玩家的情感和情绪，这是设计师在游戏设计的过程中需要重点考虑的。
　　1.信息通道及其属性的思考
　　信息通道时数据传递的一种途径，比如说在屏幕顶端的中间位置，在屏幕的右下角，或者游戏的音效、游戏的音乐等等，不同的信息优先级可能会有不同的信息通道来输出。这些通道通常都会有各自的属性，比如屏幕中间的信息显示字体大小、颜色、字体类别或者美术表现等等。
　　在设计的过程中，交互设计师需要对界面所呈现的信息做一个类别和排序管理，哪些信息是玩家任何时候要知道的，哪些信息是在特定的情况偶尔会让玩家知道的，我们更多的需要思考什么信息是玩家需要得到的，并且只需要不经意间看一眼就知道知道了，这些信息是否会阻碍玩家与游戏的交互体验？哪些数据是最重要的？哪些通道又是最适合这些信息的。所以在这次改版的过程当中，相信设计师在针对玩家的体验和强化游戏主题的过程中有着很深入的思考，对于界面信息的重新设计能够提升玩家在游戏中的战斗体验。而在手机游戏的设计当中，在信息通道有限的情况下，我们更需要思考信息的优先级，同样又要思考有哪些信息通道可以支持我们的信息输出，在这种情况下，与策划的沟通就显得尤为重要，需要了解策划对这些信息的看法，界面的呈现与这些信息的重要性密切相关。
　　2.界面“隐于”游戏是游戏ui设计的趋势
　　对于游戏的界面设计来说，我们需要从游戏的主题出发，让游戏中的元素更好的体现和加强主题。JesseSchell认为玩家的体验与自身的思想有着密切的关系，这些思想包括：心智模型、专注、移情、想象、动机和评价。最理想的状态就是让游戏界面不可见，这样会让玩家的想象力完全沉浸在游戏世界当中。“让界面隐于游戏，在需要的时候能够快速的呈现在用户的面前。”而尽量能够做到这样，我们需要思考玩家想要什么？界面是否足够简单？能够让玩家通过一些练习就可以不用思考的使用？新玩家是否觉得界面很直观？是否在所有情况下界面都能很好的工作等等。界面能够帮助玩家更好的沉浸在游戏当中。
　　3.从玩家的角度出发来思考
　　我们需要倾听玩家的声音，从玩家的视角来看问题，从受众群体来分析这些问题，你也许会说玩游戏的都是大众群体，我们不需要做群体分类以及市场划分，也没有必要，我们的设计只需要为大部分的人群设计即可，但是我们所需要的是根据这些人群的群体特征来做设计，比如英雄联盟有13～18岁的青少年在玩，同时18～24岁的成年人也是很大一部分人群，然而这两个人群却对游戏有着不同的思考方式，青少年喜欢尝试新的体验，追求竞争和征服，但是它们确没有什么资金来供自己游戏；而18～24岁的成年人会有自己喜欢的游戏类型，明确自己的口味，并且他们会有比较多时间和金钱。对于同样的界面他们的感受也是不同的。密切关注不同人群的群体特征，才能够得以平衡游戏，并使其适合所有的人群。
　　我们做的任何事情都能从马斯洛的需求层次找到出发点和根本动机。游戏活动大多是关于成就、征服、地位等，这些活动位于马斯洛需求模型的第四层——自尊需求，但有些活动所在的层级更低，而多人游戏的吸引力和持久力能够产生的原因就会突然变的清晰——它们满足了比单人游戏更根本的需求。所以我们可以看到为什么很多玩家在游戏中会花费更多的成本来购买一些虚拟的道具，其实是他们对自尊需求的需要。
　　所以游戏中界面的设计，我们更多的要从游戏的主题出发，界面为游戏主题而服务，多从玩家的角度来问题，让玩家更好的沉浸在游戏的乐趣当中。
　　相关阅读：
关注我们官方微信公众号
下载我们官方APP-游戏行
关注手游动态微信公众号
《冰汽时代》上线3天营收2500万的底气何在五一微信“小游戏”迎来爆发式增长，多款产SLG产品的困局与思考（深度好文）又一款女性向手游？阿里还能在这条路上走多深度思考：在中国如何才能诞生3A游戏？腾讯欲斥29.6亿元投资《绝地求生》开发商
微信扫一扫关注我们→新版本游戏界面UI更新 血条技能栏视觉优化
友方血条显示为蓝色，持续恢复为浅蓝色，护盾为白色&
天赋系统换成了淡紫色的风格，UI相比以前略小
技能快捷栏更精简，天赋主动技能图标更清晰
　　让我们来回顾下补丁文档中的详细改动
　　游戏内界面
　　技能及主动天赋快捷列
　　翻新技能快捷列的美术效果，使其视觉上更精简。
　　翻新主动天赋快捷列的美术效果，略为增大图示。
　　英雄名牌及状态条
　　英雄名牌现在会显示以下状态效果：变形及静滞
　　英雄状态条视觉更新及最佳化。
　　盟友的血条从绿色改为蓝色。
　　英雄血条更清晰呈现 1000 及 250HP 的段落。
　　在英雄血条上，防护罩将以白色呈现，取替蓝色。
　　伤害、持续伤害、快速治疗等特效在英雄血条上更清晰明瞭。
178游戏网声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。
打开微信，点击底部的“发现”，使用“扫一扫”即可将网页分享至朋友圈。游戏UI与应用UI哪个更有前景
目前，国内最有前途的行业，要数IT和游戏行业了。IT行业早在几年前已被人们所重视，游戏行业的火热不过是近几年的事，而游戏行业中的UI设计师又是最热门的一个岗位。当手机族群日渐庞大，用户的需求正井喷式蔓延，炫酷的手机游戏、高端的界面享受、智能的互动体验，UI界面是俘获用户的关键。
莱茵教育UI培训讲师表示，2016年UI设计师月薪平均已达到10910元，职业前景可见一斑。UI设计师薪资一路看涨的原因，主要在三个方面：一是稀缺性，二是专业度，三是游戏UI供不应求。
由于国内多数高校尚未开设UI设计专业，导致UI设计的专业人才供不应求。另一方面，培训学校在专业度、培训周期、投入产出上更“懂”企业的用人要求，更能将学员与企业联系起来，做到真正的学以致用。还有最重要的一点就是目前UI设计中的游戏正成为UI设计的主力。
纵观全国的UI设计培训机构，无非分为两种：一种是应用UI，一种是游戏UI。那这两个方向哪个才是更有前景呢?
一、应用UI
首先我们来看看应用UI，现在很多培训机构推出的应用UI班其中包括：ICON设计、网页UI界面、ios界面、安卓界面、电视车载系统界面、软件系统、独立平台、人机交互界面......其实罗列了这么多，这些都是相互重复的。
例如iOS界面和安卓界面，其实做设计这行，与系统无关，同样都是设计，这与我们的是iOS系统还是安卓系统并没有绝对关系，只不过在视觉风格上会有些差别;再如电视车载界面和独立平台，其实车载本身就是一个独立平台，将这些分类其实没有什么意义。
再如ICON(图标)设计，UI设计本身是包含了图标设计的，而且在手机界面设计中就包含了ICON设计，不管是ios还是安卓，都是会涉及这块......其实应用UI设计会流行起来，总的来说也是因为国内智能App开发数量多了起来，所以总而言之，应用UI设计大致上来说是离不开app的，所以他的就业也比较单一。
二、游戏UI
再来说说游戏UI，很多人不知道游戏UI到底是要画什么。这里我给大家看看游戏UI到底包括了哪些。
1、游戏界面
你会发现，其实游戏UI里面很多东西都是需要你画的。也许你会说画炉石的这种界面太难了，那画这些小图标是否可以呢?
2、游戏道具以及图标设计
3、游戏中的登陆或者开始界面
游戏中的UI设计是无处不在的，而且都是需要UI设计师一个个的画，可以说游戏UI比应用所包含的东西多得多，也更加多变。
三、二者对比：
首先我们来看看其中图标设计这一块
应用UI手机界面
不管设计师设计出来的是小清新还是可爱风，我们都可以一眼看出，其中的相机、短信、拨号、时钟、录音机等图标设计。这些图标再怎么设计都逃不出事物本身的特性，要是你设计成这样妖怪主题的，恐怕没有显示字没有几个人知道那些图标代表了什么。这就是用户体验，要让人知道你画的是什么。这既是应用ui的局限性也是一个优点。
而游戏UI就不同了，同样的东西你可以发挥你的想象，设计成你自己想要的样子，但是前提都是要考虑用户体验。人机交互永远都是Ui设计的主旨。
图标的设计可以根据游戏的情景相应变化，或者根据游戏人物的需要，同样一个物件，可以百变。又如第二部分说到的登陆界面一样，不同的游戏登陆界面也有多种，而这种界面的好坏不是根据画的像不像，而是用户的体验。
来源：天涯社区
责任编辑：
声明：本文由入驻搜狐号的作者撰写，除搜狐官方账号外，观点仅代表作者本人，不代表搜狐立场。
莱茵UI设计全新升级，包括UI设计，交互设计，用户体验等，关注微信，了解更多详情
html5，CSS3，JavaScript前端开发，教您打造酷炫+易用+好看的产品
今日搜狐热点当前位置：&&&&正文
找好玩手机游戏，上&
游戏界面全面更新 《CF手游》年度版本即将来袭
在本周五迎来新版本大更新的为玩家们爆料了全新版本的界面，从游戏开测以来就拥有众多玩家的喜爱，而本次界面风格将会是游戏公测之后的第一次改变，一起来看看吧！
版本更新内容大全抢先看：
【UI升级2.0】
穿越火线-枪战王者界面2.0全面来袭，采用全新动态渲染技术，让登录场景全面升级，背景不再只是一张图，让你未进游戏便能感受BOSS战的魅力，快来进入游戏体验更震撼更炫酷的游戏体验吧！
大厅全面升级进入2.0时代，让整个游戏更简洁且富科技立体感，更宏大的场景塑造和更精致的细节提现，每个按钮的细节设计上都经过多次打造，力求给玩家最爽快的游戏体验，给大家介绍2个特色系统：
（1）全新的动态大厅背景，背景不再冷冰冰，赶紧下载最新版本体验下背景的枪林弹雨、电光火鸣吧！
（2）全新的角色互动系统，角色不再冷冰冰，快来跟可爱的灵狐妹子打个招呼吧！
【仓库系统优化】
CF手游的仓库系统自从上线以来以其易简洁、易用的特点受到广大玩家的支持；在新版本中，CF手游在保留原有仓库特点的同时升级仓库功能，全面升级仓库界面表现，浓厚金属风格更适合CF战士使用，界面更加简洁，操作更加；并开放广受CF玩家喜爱的戒指系统，并升级戒指技能，让戒指更适合手游竞技使用！
【丰富背包武器】
在原CF玩家积极建议下，CF手游攻克多项技术难关，将CF的背包装备系统原汁原味的还原到CF手游只上，将手雷、闪光、烟雾装备位整合到背包之中，让背包的武器搭配更加丰富，闪光冲锋、烟雾狙也可以真真正正在CF手游上体验到！
【商城升级】
CF手游商城全面升级：商城首页更大的广告图，更多推荐热门商品让玩家选择；普通商城同屏展示更多商品，挑选商品更容易！
<font color="#99CF手游QQ交流群欢迎你加入：
掌握CF手游攻略、视频、礼包等，下载&&&
游戏下载4399手游官方微信(微信号：sj4399)要你好玩，要你好看！独家礼包，新鲜爆料！
热门游戏推荐
热门关键字
热门游戏专区
扫描二维码,关注4399手游微信优秀设计联盟-SDC-优设网-设计师交流学习平台-听讲座，聊设计，找素材，尽在优设网
下一篇 继续涨姿势
阅读本文需 9 分钟
大家好，我是Jack，今天突然接到一个任务，给个游戏分析UI，满脑子很疑惑是哪个游戏，当拿到任务卡，发现是“暴风英雄”，并看了相关游戏截图后，立马痛快的接受了这个任务。哈哈，暴雪游戏一直是我的最爱，能有幸分析一下自己喜欢的游戏是一件很快乐的事情，谢谢7.game主编大人给予机会让我和大家分享这个UI设计。
让我们先来了解下这个游戏背景吧。
《风暴英雄》（英文：Heroes of the Storm 简称：Heroes，台服译为：暴雪英霸） 是一个由暴雪娱乐开发的一款运行在Windows和Mac OS上的在线多人竞技游戏。游戏中玩家所扮演的英雄全部来自于暴雪三大经典游戏系列：《魔兽世界》、《暗黑破坏神》和《星际争霸》。它与《星际争霸2》同属一个团队开发，基于同一个引擎。《风暴英雄》为免费游戏，官方将通过英雄、皮肤和坐骑进行收费，是暴雪在多人竞技领域的新尝试。日，网易公司与暴雪娱乐联合宣布，网易获得暴雪娱乐《风暴英雄》在中国大陆的独家运营权，为期三年，并同时开启内测申请
百度相关词条介绍：
这是一张游戏中战斗界面的截图，作为一个合格的UI，在拿到项目相关的游戏截图就应该能马上在脑子构思整体UI的大致创意、风格、颜色和表现样式，不知道大家有没有这个习惯：）
在分析这个游戏UI之前我认为大家看看视频会对这个游戏的世界观，玩法，ＵＩ表现形式和交互有个大致的了解，送上两个不错的视频传送门。
相关视频观看地址：
游戏简介：
游戏片头：
等等，这个简化，高科技的UI不符合暴雪的习惯，早期的是什么样呢？
带着疑问Jack在网上搜索了这个游戏的相关大量视频来“补课”，终于我发现了几年前的早期版本UI，他还保留着老版本暴雪游戏的布局和一些UI表现效果，见下图：
大家都知道游戏研发是一件非常通苦的事情，年初我参加北京的CDC 2014游戏者开发大会了解到腾讯一款游戏UI能改版10多次以上，最终才上线，然后是大卖，对于暴雪这款游戏我不知道研发人员换了多少版UI，我只能说我很喜欢他们的最终这版效果，简约、时尚、大气，颜色丰富，细节到位，很现代，符合目前简约突出功能至上的设计理念……
好了，让我们来欣赏下这个游戏的UI的相关截图吧。
先是海外版和中国版的logo对比。
官网的宣传海报
好科幻的登录界面哦，让我想起“WILDSTAR”游戏，附上一个他们的登录对比，UI同学一定不会陌生，哈哈。
如果希望了解这个“WILDSTAR”游戏，可以看我博客相关介绍，我详细展示分析了下UI和相关原画，传送门：
人物选择界面，嘿嘿，暴雪出品的魔兽、暗黑、星际争霸三个游戏我们喜欢的英雄和BOSS都有的选，
来个我暗黑天天为了暴装备被虐的DIABLO，哈哈：）
这个设计很棒，最大化展示选择人物，其它需要选择的人物卡牌化处理，突出重点，以后大家设计选人布局，同学们也可以学习这种方法哦。
让我们来欣赏一些其他的界面。
是不是看了上面的游戏截图已经感觉很棒了！
再分析一些该游戏UI的交互和设计细节，如果是初学UI的同学可以拿小本本记下这些设计技巧，后期你们工作中肯定能用上。
当有需要玩家点击操作的时候，游戏会自动压黑下面游戏背景，方便玩家选择，这在UI里面是一个很巧妙的技巧，避免因为信息量大，让玩家找不到操作按钮，这样XX再也不需要担心我的UI信息量过多，按钮不突出啦~~
按钮悬浮态在鼠标滑动时有一个轻微的加亮效果区分，目前有很多按钮开始尝试加入底纹细节，不知道同行UI朋友发现这一趋势没有，连Mike大神也是如此哦。
下面２图为Mike作品，是不是叠加图案已经是国外趋势了，有莫有？
来个Mike的小作品
下面的创意有点眼熟不，哈哈，果然是“英雄所见略同”，恩恩：）
VICTORY！，欧耶，再也没有小星星了，简洁明快，真爽。
战斗UI的一些细节表现，圆形头像框和渐变底板搭配，让战斗UI更好的融入战斗场景，避免UI设计生硬感问题。
血条设计，生命突出（血条粗），魔法次要（血条细），左右加了2个黄色亮光设计，立马设计高大上了，哈哈。
地图设计只突出英雄和玩家单位，把以往地图显示其他信息弱化了，很直观，英雄面板突出攻击力，简单暴力。
这个游戏的UI和相关按钮我原画人“UI的那点事”做过视频分享，教大家制作了，如果有喜欢的朋友可以访问我的优酷地址，里面大量视频分享UI界面和图标设计，希望对大家有帮助 ：）
优酷网观看地址：（视频分享）
谢谢支持Jack的UI分享，最近这款游戏马上中国将开始测试，喜欢暴雪游戏的同学也请速度关注吧：）
最后分享下这款游戏的暴雪开发团队视频和截图。
我很认可国外的开发环境和工作态度，国外的游戏完全是以玩家至上理念去开发的，游戏中每个细节都设计的很好，认真-永远是精品游戏的必备条件之一。
开发者访谈：
如果喜欢可以看看该游戏试玩视频，特地给大家找了个中文解说的，30分钟左右，游戏介绍的很详细，给解说点个赞。
游戏试玩视频：（中文配音）
如果喜欢UI的同学也可以加我群一起交流学习：（没有广告，招聘的纯技术群，不欢迎HR，猎头哈，望理解）
我个人的一些地址，如果喜欢的朋友可以认识下。
Jack博客：
Jack微博：
花瓣画板：（图片分享）
优酷网观看地址：（视频分享）
游戏好文合集：
超劲爆的游戏官网放送！
游戏大咖秀！设计师的北漂之旅！
游戏中的优秀引导模式范例！
【优设网 原创文章 投稿邮箱：】
================关于优设网================
&#8220;优设网&#8220;是国内人气最高的网页设计师学习平台，专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：。
设计微博：拥有粉丝量83万的人气微博 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的&#8221;福利&#8221;吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加：
他山之石可攻玉！一个美国高管眼里的中国电商
编者按：在互联网风起云涌的这20年间，电子商务随着互联网快速成长了起来。不同的国情、市场格局和用户习惯使得中美两国的电商成长轨迹不尽...
今年下半年以来，互联网公司纷纷宣布裁员、减招，BAT首当其冲。 由此，互联网行业进入“求职寒冬”的声音喧嚣日上。 12月04日腾讯科技一篇《大规模倒闭、裁员...@畅游VC ：当原画素材分辨率或者精度不够，不能展示人物细节，何不尝试利用打造氛围来提高主视觉的质量。下面是举了一个主要利用照片拼接来配合人物原画打造氛围的...编者按：场景说起来简单，事实上有很多设计师会忽略，本文提到的百度谷歌也中枪了。今天@ME网易移动设计 给同学们聊聊场景的3个功能，如何用场景探索功能，用场景...编者按：今天这个游戏场景无论是层次感还是渐变都特别棒，而且难度不大，有基础的同学都可以来试试。 优设最新的AI 教程： 《AI教程！手把手教你绘制一组清新简...@畅游VC ：悬念站相信很多做游戏网页的朋友应该都遇到过，这种网站往往通过充满神秘感的场景或者氛围来暗示或者引出即将发布的内容。悬念站的表现手法有很多，今天...网易UEDC – 王业 ：这篇文章讲述了我对产品设计的一些个人理解和看法。用户参与设计，指的是在有限的设计引导下，要给予用户或是体验者主动的情绪引导和操作体...报名方式 在优设微信公众号回复&#8221;讲座&#8221;，即可进入报名环节。? 温馨提示 请先关注优设微信公众号：youshege （扫描上方二维码亦...
我们的团队
大家在关注
一扫"掌"握！
把好文章收藏到微信
打开微信，扫码分享学设计 优设网 在这里}