《游戏界面设计》01 游戏UI是什么

YOUXIJIEMIANSHEJI68%[F:]25.1GB17.0GBFree多平台游戏UI设计从游戏类别到游戏UI设计游戏UI设计基本元素大集合游戏UI是什么YOUXIJIEMIANSHEJIYOUXIJIEMIANSHEJIYOUXIJIEMIANSHEJI游戏UI设计/选自暴雪娱乐公司开发的集换式卡牌游戏《炉石传说》一、UI概述UI的本义是用户界面，也称人机界面，泛指用户的操作界面，包含网页、移动APP等。UI设计主要是指对用户界面的外观样式、人机交互、操作逻辑等进行有效设计。YOUXIJIEMIANSHEJI网页UI设计软件UI设计/选自Adobe公司的图像处理软件PhotoshopYOUXIJIEMIANSHEJI二、GUI概述GUI是英文graphicaluserinterface的缩写，翻译为“图形用户界面”，又称图形用户接口，是指采用图形方式显示的计算机操作用户界面。计算机操作用户界面YOUXIJIEMIANSHEJIGUI也是在人和机器互动的过程中产生的一种图形用户界面。GUI在未来将被广泛应用，因为它极大地方便了非专业用户与机器的互动，使人们不再需要死记硬背一些命令来操作，只需要通过图形化的窗口、菜单、按键等即可进行简单的操作。机器人主控器YOUXIJIEMIANSHEJI三、交互设计交互设计的英文为interactiondesign，缩写为ID。它是定义和设计人造系统行为的设计领域，让两个或多个互动的个体能够互相交流、互相配合，从而共同达到一种目的。交互设计主要关注以人为本的用户需求，目标是从可用性和用户体验两个层面进行分析、研究，努力创造、建立人和产品之间的服务关系，从而让人在被服务时更舒适。YOUXIJIEMIANSHEJI按照作用的不同，界面可分为操作界面和显示界面两大类。操作界面通常包括鼠标、键盘、遥控器、操作手柄等。显示界面的主要作用是显示信息，用户通过显示出的相关信息做出判断。鼠标、键盘计算机显示界面YOUXIJIEMIANSHEJI人机交互与传统的人和人之间的交互不同。在人机交互的过程中，人要不断地与机器打交道。因此，人机交互界面逐渐成为一个独立的、重要的研究领域。游戏交互设计YOUXIJIEMIANSHEJI交互规范主要分为Web端、移动端以及其他配合产品所使用的设备端。移动端主要有Android和iOS两种系统。设计师在制订对应的交互设计规范时，一定要做好前期调研，进行有效的参考，如“Windows用户界面规范”“iOS人机界面指导手册”“Android人机界面指导手册”，并响应平台本身的特点。YOUXIJIEMIANSHEJI不管交互方式怎么变，它们的通用设计原则是不变的，那就是“三易两致”，使界面设计符合用户的认知心理和认知习惯。“三易两致”即易学、易见、易用，内部一致、外部一致。YOUXIJIEMIANSHEJI界面功能和内容要易于学习和记忆：一是要使用用户的语言而不是机器的语言，二是要对用户进行有效提示与帮助。界面信息与内容能够让用户一目了然：首先让用户控制界面，有“下一步、完成”等不同的选择提示，然后让用户明显地看到反馈与之后的状态。界面必须好用：一是具备导航功能，让用户学习方法，有效地按照自己的心意进行路径切换；二是有明确的错误提示，要主动去帮助用户防错和纠错；三是允许退出工作并及时保存；四是让用户随时知道自己所处的位置。YOUXIJIEMIANSHEJI四、UE概述UE是英文userexperience的缩写，翻译为“用户体验”，是用户在使用一个产品的过程中所产生的主观的心理感受。YOUXIJIEMIANSHEJI五、UI设计与认知心理学的关系从认知心理学的角度去理解UI设计准则会发现，人们对周围世界的感知往往并不是对外部环境刺激的真实描述，人们感知到的很大程度上是自己期望感知到的。影响人们感知的有以下几个基本因素：经验、环境和目标。经验会先入为主地影响人们的感知。不同的环境会使同样的短语、句子产生不同的含义。YOUXIJIEMIANSHEJI一、游戏UI设计概述游戏UI即游戏图形用户界面，与之相关的所有工作统称为游戏美术。在游戏中，游戏UI会根据不同游戏的特性，在游戏的主界面、弹窗界面、操控界面上展现不同的相关信息，最后根据合理的设计，引导用户进行简单的人机交互操作。【微课视频】1.游戏UI设计概述2.游戏UI发展史YOUXIJIEMIANSHEJI游戏UI设计/选自游戏《尼尔：机械纪元》游戏UI设计/选自虚拟现实工作室的原创游戏《你的名字》/2018年/何静YOUXIJIEMIANSHEJI一款优秀的游戏产品不仅需要界面美观的整体设计，还需要将游戏交互的合理性、玩家的体验感把握得恰如其分。合理的游戏UI设计就是在人机交互的操作方式中营造出操作简单并具有引导功能的美观的人机环境。游戏UI设计/选自芬兰游戏公司SupercellOy推出的策略类游戏《部落冲突》YOUXIJIEMIANSHEJI游戏UI设计的工作方向可根据工作内容划分为图标UI设计和辅助UI设计等。游戏UI设计师的具体工作内容可以从以下5个方面去阐述：负责与策划进行有效沟通，参与前期游戏的交互设计、UI和图标原型设计的讨论；负责与程序设计师讨论游戏UI在实践项目中的功能实现与原型还原；负责整个游戏研发项目的界面、图标、游戏推广图、游戏Banner等美术资源设计工作；负责确认游戏效果图和游戏UI切图是否符合程序的需要，游戏功能和交互功能是否满足策划与用户的需要；后期日常的游戏UI设计更新。0102030405YOUXIJIEMIANSHEJI二、游戏开发过程从游戏的开发过程来看，对应4个工作方向，分别是程序、设计、美术、音乐。在一个标配的游戏开发团队中一般有三大总监：创意总监、技术总监、艺术总监。换一种说法，其实就是主策划、主程序、主美。这三大总监上面还有制作人。在游戏公司里，制作人上面还有总经理，而总经理上面还有董事会。【微课视频】游戏UI工作内容及方向YOUXIJIEMIANSHEJI一款游戏的研发，首先会由创意总监来决定游戏往哪个方向设计与制作，并对设计上的分歧进行最终的决断；然后由技术总监采取相应的技术方案，来制定游戏所需的功能和系统；最后由艺术总监负责领导制作游戏的美术资源，以确保游戏画面的美观性和统一性。制作人会相应地提供三大总监所需要的资源与帮助，并保证游戏项目的正常推进、运行与最终发售。（书中图1-12所示为一款游戏的开发过程）YOUXIJIEMIANSHEJI游戏研发公司开发一款游戏会经历4个阶段：立项原型包装（视觉设计）游戏测试与迭代YOUXIJIEMIANSHEJI（一）立项一个游戏项目的开始一般会有3种模式。①市场：大型公司一般都会有市场部门，专门收集、研究市场数据，分析下一个项目应该做哪种类型的游戏。②其他企业人：部分企业的高层可能没有接触过游戏领域，但是他们有梦想，有经济实力，就可以组建团队、成立公司，用来设计、研发游戏。③游戏设计师：有想法的游戏人，出于对游戏的热爱而投身于游戏事业中。YOUXIJIEMIANSHEJI（二）原型一般一个游戏项目成立之后，就会进入原型阶段，去检验这款游戏的玩法和开发的可行性。主策划要向程序负责人阐述游戏的玩法框架、游戏中的系统。技术人员则进行功能和玩法的实现。有时设计师会在此阶段做出游戏的可视化效果。不过一般在游戏原型阶段做出的游戏都比不上最后上线的版本。游戏UI设计/选自虚拟现实工作室的原创游戏《海域危机》/2018年/黄雪莉YOUXIJIEMIANSHEJI（三）包装包装（视觉优化）就是在游戏玩法已经确定的基础上对游戏进行视觉化的美术设计，包括游戏角色原画、游戏场景原画、游戏模型、游戏动画、游戏UI、游戏特效、游戏音效、游戏音乐及配音等。在游戏的视觉和听觉的双重包装完成之后，就会进入下一个阶段。游戏角色原画三视图/2019年/卢思琪/指导教师：桂风娇YOUXIJIEMIANSHEJI游戏角色原画三视图/2019年/焦媛媛/指导教师：桂风娇游戏角色原画/选自《怪物猎人：边境G》原画集YOUXIJIEMIANSHEJI游戏场景原画/选自游戏《寻龙诀》概念图选/2014年/徐天华游戏场景原画/选自重庆工程学院的《旧城时光》/2017年/李欣YOUXIJIEMIANSHEJI游戏角色模型/选自游戏《艾洛亚》游戏UI设计/选自育碧娱乐软件公司的音乐舞蹈游戏《舞力全开》YOUXIJIEMIANSHEJI游戏UI设计/选自虚拟现实工作室的原创游戏《你的名字》/2018年/何静游戏特效YOUXIJIEMIANSHEJI（四）游戏测试与迭代这个阶段主要是对游戏进行全方位的验收，最需要耐心，因为要对游戏中的每一个按键、每一个功能进行测试，找到所有存在异常的地方并进行修复。YOUXIJIEMIANSHEJI三、游戏UI交互设计从早期的投币、摇杆、按钮式街机，跳舞机，有手柄和按钮的家用机，有鼠标和键盘的个人计算机，有按键或全屏多点触摸的手机，到现在的体感交互的Wii和Kinect，以及最新的VR（虚拟现实）、AR（增强现实）、MR（混合现实）技术，交互方式在不断地变化。交互设计/2017年/聿山YOUXIJIEMIANSHEJI游戏UI设计并不是控件越多越好，画面越漂亮越好，主要还是看游戏的用户黏度。为了增强用户黏度，游戏UI交互设计就必须更加注重用户的体验和交互体验。YOUXIJIEMIANSHEJI四、游戏UI设计在游戏开发中的作用游戏UI设计是一个跨学科、跨专业，涵盖计算机科学与技术、设计学等多学科的综合性工作。因此，游戏UI设计师的工作要求非常高，工作内容也非常繁杂。YOUXIJIEMIANSHEJI五、游戏UI设计与游戏原画设计的区别游戏UI设计是指游戏UI设计师对游戏操作界面的设计与制作，包括读取界面、登录界面、主界面以及界面中所呈现的技能图标和控件按钮等的设计与制作。目前涉及UI方向的职位有很多，包括网页UI设计师、软件UI设计师、游戏UI设计师。YOUXIJIEMIANSHEJI游戏UI设计/选自模拟经营类游戏《了不起的修仙模拟器》YOUXIJIEMIANSHEJI游戏原画设计是游戏研发制作前期的一个重要环节。游戏原画设计师根据游戏策划文案的要求设计出整款游戏的美术方案，设定游戏整体的美术风格，包括游戏角色设计、游戏场景设计、游戏道具设计、游戏武器设计和游戏美术宣传图（概念图）设计。游戏角色原画设计/选自国产角色扮演游戏《古剑奇谭》YOUXIJIEMIANSHEJI六、游戏UI设计与其他UI设计的区别游戏UI设计是UI设计这个大类下面的一个分支。UI设计大类除了有游戏UI设计外，还有其他的应用UI设计。虽然都是UI设计，也都分别应用在各大平台上，但游戏UI设计与其他UI设计相比，还是有以下几个方面的区别：视觉风格不同、复杂程度不同、学习内容不同、工作岗位职责不同。【微课视频】游戏UI与其他UI的区别YOUXIJIEMIANSHEJI（一）视觉风格不同应用UI可以独立于其内容来进行视觉风格设计，游戏UI则必须结合游戏本身的内容来进行视觉风格设计。游戏UI设计需要在游戏原画这个已有的美术风格范围内做设计，设计师需要掌握基本的手绘能力、设计能力和对游戏的理解能力。POS收银系统管理软件UIYOUXIJIEMIANSHEJI（二）复杂程度不同游戏有着庞大的世界观。美国拳头游戏（RiotGames）开发、中国大陆地区腾讯游戏代理运营的英雄对战竞技网游《英雄联盟》就具有完整的世界观和极其复杂的故事，因此在视觉、逻辑和数量上都比其他类型的UI设计要复杂。YOUXIJIEMIANSHEJI（三）学习内容不同游戏UI设计学习的软件主要是Photoshop。高级游戏UI设计师还需要会Axure、AdobeIllustrator、Unity3D、AfterEffects等软件。除此之外，游戏UI设计师还要不断提高手绘造型能力、动效设计能力和材质表现能力。YOUXIJIEMIANSHEJI（四）工作岗位职责不同游戏UI设计主要针对的岗位是游戏公司里的游戏UI设计师，除了需要具备游戏UI的整体视觉风格把控能力、交互设计师的交互能力，以及较强的手绘能力、平面设计和UI设计创意能力与扎实的美术功底之外，还需要具备Unity3D软件基础。YOUXIJIEMIANSHEJI一、游戏UI设计的基本原则游戏UI设计应该注意以下两个基本原则：游戏界面的布局合理并有明显的视觉顺序，游戏界面的视觉风格统一。YOUXIJIEMIANSHEJI（一）游戏界面的布局合理并有明显的视觉顺序在界面框架图绘制阶段，游戏UI设计师要对界面的内容进行归类并合理布局。设计师在布局一些功能性按钮和图标时，一定要符合用户平时的行为习惯，把一些重要的按钮放在玩家能够轻松看到的地方。游戏UI设计/选自腾讯出品的休闲棋类手机游戏《QQ五子棋》YOUXIJIEMIANSHEJI游戏中图标和文字的辨识度要高，引导性要强，要有明显的逻辑和视觉顺序，让用户进入一个界面之后能快速知晓“接下来要干什么”。游戏UI设计/选自益智策略类塔防御战游戏《植物大战僵尸2：奇妙时空之旅》YOUXIJIEMIANSHEJI（二）游戏界面的视觉风格统一游戏UI设计中，从造型到色彩搭配再到质感表现上，都应该保持协调、统一。颜色反差不要太大，必须保持一致的视觉风格。好的色彩搭配会锦上添花，给玩家带来较好的视觉体验。游戏UI设计/选自育碧娱乐软件公司的音乐舞蹈游戏《舞力全开》YOUXIJIEMIANSHEJI二、游戏UI设计的主要形式游戏UI设计是UI设计的一个细化的分支。UI设计是指人和机器的交互、操作逻辑、界面的整体设计。游戏UI其实就是玩家和游戏进行交互时的一个平台。通过这个平台，玩家和游戏之间可以进行情感交互、共鸣，以此来实现游戏为用户服务的目的。YOUXIJIEMIANSHEJI以功能性和使用性为核心游戏UI设计最主要的目的就是为了让玩家与游戏进行交互，所以设计师在设计时就必须以游戏的功能性和使用性为核心。以情感表达为核心通过合理的设计，游戏UI可以让玩家与游戏之间产生一种情感的互动。以营造环境为前提游戏产品的设计从来都离不开整体环境的氛围渲染。010203YOUXIJIEMIANSHEJI一、游戏UI设计的工作流程一款游戏的UI设计流程大致分为前期的交互设计阶段和后期的视觉优化阶段。设计师在具体设计与制作一款游戏的UI时，会先根据策划的要求进行前期的需求解读，然后分析并设计与制作游戏流程和界面框架图，最后才会进入视觉优化阶段。【微课视频】游戏用户界面设计流程YOUXIJIEMIANSHEJI（一）项目需求解读项目前期，游戏UI设计师需要对游戏的投放平台、尺寸、分辨率、美术风格进行需求分析，同时参考优质的同类游戏产品，分析游戏项目的目标用户，包括用户的年龄、性别、爱好、收入、教育程度、需求和使用场景等。YOUXIJIEMIANSHEJI（二）设计分析与定位执行项目初期，对需求进行分析之后，即可进行游戏界面框架的方案设计以及核心系统的交互框架设计。最后的执行阶段包括交互原型设计、草图设计、界面信息框架设计等。游戏界面框架图设计/2019年/张惠馨/指导教师：桂风娇YOUXIJIEMIANSHEJI（三）调研验证及设计跟进项目中期，通过对不同的游戏UI设计方案进行实践调研验证，确定更适合游戏项目本身的方案。项目组确定视觉风格后，游戏UI设计师则根据交互原型和设计稿进行更加完善的游戏UI视觉设计。在这个过程中，游戏UI设计师还必须与程序设计师沟通，确保切图文件的最终效果实现。游戏UI设计/2019年/张惠馨/指导教师：桂风娇YOUXIJIEMIANSHEJI（四）用户验证反馈与设计验收项目后期，最后确定的设计方案即可推入市场。但此时游戏UI设计的工作并没有结束。产品上市以后会得到很多用户反馈，这时就需要根据用户的反馈进行梳理，为以后的更新做好准备。YOUXIJIEMIANSHEJI二、视觉设计前的准备世界观中的历史背景能为游戏的美术风格、系统玩法、剧情等的设计提供有效的依据。游戏世界中所有的元素为什么会是这个样子，为什么会有这样的剧情发展，其实都是根据世界观中的历史背景设计的。（一）了解游戏的世界观游戏UI设计/选自暴雪娱乐公司的多人在线角色扮演游戏《魔兽世界》YOUXIJIEMIANSHEJI游戏UI的设计风格取决于整款游戏的美术风格。游戏UI设计师一般都是按照游戏的原画风格去设定UI设计风格的。多变的游戏风格要求游戏UI设计师具有超强的设计能力和扎实的手绘功底。（二）确定游戏UI的设计风格超写实风格游戏截图/选自Rockstar公司的动作冒险类游戏《荒野大镖客：救赎2》YOUXIJIEMIANSHEJI1.超写实风格超写实风格源于超写实主义（hyperrealism，又称高度写实主义）。它是绘画和雕塑的一个流派，可以看成照相写实主义，在游戏中可以理解成游戏中的所有画面与真实世界很相像且还原度很高。超写实风格游戏UI设计/选自Rockstar公司的动作冒险类游戏《荒野大镖客：救赎2》YOUXIJIEMIANSHEJI2.暗黑风格暗黑风格（diablo-like）一般会出现在西方的魔幻游戏中，是ARPG游戏（动作类角色扮演游戏）的一种设计风格，从整体画面风格上看，色调昏暗，局部有绚丽的特效光线，让玩家仿佛置身于魔幻的世界中。暗黑风格游戏截图/选自暴雪娱乐公司的动作类角色扮演游戏《暗黑破坏神3》YOUXIJIEMIANSHEJI3.涂鸦风格涂鸦风格源于“涂鸦”（graffiti）一词，是指在墙壁上乱涂乱写的图像或画。文字在涂鸦中占的比重一般较大，其中包含形象的符号和标志等。图形也是涂鸦中经常见到的内容。涂鸦风格的游戏画面一般给人感觉轻松、自然，能够让玩家在游戏中回味童年。涂鸦风格游戏UI设计/选自手绘图形的飞行射击游戏《涂鸦飞机》YOUXIJIEMIANSHEJI4.卡通风格卡通的英文为cartoon，原意是指时事、政治类的单幅或短篇的讽刺漫画，从广义上来说就是对所要表现的对象进行归纳、夸张、变形等处理后完成的视觉作品。卡通风格的游戏一般整体色彩明亮，给人一种轻松、活泼的感觉。卡通风格游戏UI设计/选自育碧娱乐软件公司的游戏《英灵乱战》YOUXIJIEMIANSHEJI5.未来科幻风格未来科幻风格既不局限于卡通，也不局限于写实，也可以说不管是卡通还是写实作品，都可以表现出未来科幻风格。未来科幻风格游戏UI设计/选自暴雪娱乐公司的团队射击游戏《守望先锋》YOUXIJIEMIANSHEJI三、原创休闲益智问答类游戏开始界面框架图设计案例《加油，唐七七》是一款益智问答类游戏，主要运行环境有Windows、Android、iOS，针对目前患有糖尿病的儿童而设计，让他们在娱乐的同时，可以学习与糖尿病相关的知识，达到寓教于乐的目的，并让他们在此过程中获得互动的乐趣。（一）案例简介YOUXIJIEMIANSHEJI在游戏中，玩家将扮演一个7岁左右的儿童“唐七七”。某一天，他突然发现自己身体不舒服，到医院检查之后发现患有糖尿病并需要药物控制和健康辅导，于是住进了医院。经过一段时间的学习，“唐七七”已经基本掌握了控制糖尿病的相关知识，但是医生不太放心，安排了一次出院测试，只有通过测试才能离开医院，回到家里。（一）案例简介YOUXIJIEMIANSHEJI（二）案例制作过程1.项目需求解读在项目制作过程中，游戏UI设计师通过对策划文案，以及甲方的要求和游戏目标用户（患有糖尿