认识UI设计

认识UI设计--UI设计基础理论UI设计是什么？-软件设计为两个部分：编码设计与UI设计。UI的本意是用户界面，是英文Userinterface的缩写。含义是研究用户、界面还包括用户与界面之间的交互关系。界面设计，在漫长的软件发展中，界面设计工作一直没有被重视起来。做界面设计的人也被贬义的称为“美工”。其实软件界面设计就像工业产品中的工业造型设计一样，是产品的重要卖点。一个友好美观的界面会给人带来舒适的视觉享受，拉近人与电脑的距离。界面设计不是单纯的美术绘画，他需要定位使用者、使用环境、使用方式并且为最终用户而设计，是纯粹的科学性的艺术设计。检验一个界面的标准既不是某个项目开发组领导的意见也不是项目成员投票的结果，而是最终用户的感受。所以界面设计要和用户研究紧密结合，是一个不断为最终用户设计满意视觉效果的过程。我们在做什么？游戏界面美术设计，我们关注视觉。UI美术的能力——意识和技能。用户体验的5个基本要素。•有用（符合目标用户的需求）•易用（一看就懂，不需要说明书）•友好（通过各种细节表达出平等的感觉）•美观（传递信息，产生吸引力，创造出用户黏度）•品牌（4个基础要素直接影响品牌效果）人机交互的过程中的一环就是界面，可分为感觉（视觉、触觉、听觉等）和情感两个层次。人机交互的发展历史，是从人适应计算机到计算机不断地适应人的发展史人机交互的发展经历了几个阶段：早期的手工作业阶段作业控制语言及交互命令语言阶段图形用户界面（GUI）阶段网络用户界面的出现多通道、多媒体的智能人机交互阶段虚拟交互界面人机界面设计原则。美术应用简单解释。费解的、逻辑混乱的、不诱人的界面会让本来优秀的游戏功能变成一个杯具。从用户思考和使用的方式出发，设计优美的、符合直觉的界面与程序功能相辅相成，给玩家留下良好的印象。图形界面发展过程。一，美。不是无止境的追求更高更刺激的视觉享受，而是适当适合的美感。一般情况下，设计时首先要保证符合功能，让玩家能轻易看懂界面目的和功能特性，其次才是突出美术风格和新奇的设计。忽视前者会让玩家迷惑，不知道怎么使用和操作这个界面。游戏玩家都期待非常漂亮的界面，并充满探索趣味。要注意设计元素的层次，确定最高级的功能和次要的功能，根据层次弱化降级设计的复杂程度。二，一致性。保持一致性可以让玩家逐渐形成习惯，减轻大脑的负担，玩起来更轻松。除了必须的美术风格一致之外，影响的方面还有很多。比如，我们的游戏中按钮的颜色，红色系一直表示危险、注意、战斗、关闭、减低，绿色系一直代表通过、成功、安全、增加。玩家会形成习惯，在出现绿色按钮时快速的点击，而在红色按钮时停下来看看情况。文字的字体、大小、颜色、字体，也能形成理解的习惯。比如，标题和页签文字一直使用某种字体的美术字，玩家看到这种美术字就会认为是标题，如果乱用就会让玩家混乱。三，直接控制。玩家直接触摸、点击、滑动、旋转屏幕上的物体，能更深的投入在游戏中，也更清楚地理解他们行为的结果。手势能使用户体验更强的操纵感。首先要弄清楚我们的游戏能支持哪些手势，与策划和技术沟通在哪些界面和情况下使用哪种手势，配合手势设计最合适的图形、动画表现。比如最常见的拖拽图标的动作和调节音量时拖动指针的动作、翻页、放大缩小画面的手势。四，反馈。告诉玩家他们的操作有什么结果，让玩家知道程序在运行中在响应操作。人们期待操作时即刻的反馈和较长流程中状态的提示。UI界面不是静止的，设计时要考虑动态的效果。按钮的几个状态。或者点击一个标签页的页签，页签变亮窗口显示内容刷新成其中的内容，同时之前的页签变暗。利用动画、特效突出变化。点击一个按钮，同时从画面一侧伸出一个面板，再点击面板就收回去了。声音，这种反馈不是很主要，只用声音做反馈是不行的。因为玩家很容易出现关掉声音或者不能带耳线等设备的情况。五，暗喻。虚拟物体的外形和动作与真实世界中的物体一致，这样的暗喻会让玩家马上明白怎么操作。美术设计时特别注意不要使用错误的暗喻，例如一个抬起的按钮玩家很轻易就认为应该去点击使它按下，下陷的按钮看起来就是不可点击或者已经开启的状态。暗喻也需要适当，引导玩家理解操作之后会发生什么就可以了，不要过分执着。六，用户控制。平衡用户操作权帮助用户避免犯错。给用户简单直白、熟悉的、可预测结果的操控感。给用户足够的机会取消进程。执行破坏性动作（例如消费一些珍贵道具）时一定要给确认的机会。可以终止运行中的进程。--123原则-UI美术层次概念简单了解下扁平化设计概念扁平化就是完全的二次元。这个概念最核心的地方就是放弃一切装饰效果，诸如阴影，透视，纹理，渐变等等能做出3D效果的元素一概不用。所有的元素的边界都干净利落，没有任何羽化，渐变，或者阴影。尤其在手机上，更少的按钮和选项使得界面干净整齐，使用起来格外简洁。可以更加简单直接的将信息和事物的工作方式展示出来，减少认知障碍的产生。优点一、更加简单，减少认知障碍。二、更好的适应性。相比较拟物化在各种屏幕尺寸和分辨率下都比较好看。缺点扁平化设计需要一定的学习成本，传达的感情不丰富，甚至过于冰冷。在Win8metro界面中，使用了完全的扁平化设计；在苹果产品及IOS系统部分扁平化设计；Android准扁平化设计；越来越多的网站设计已在UI上走扁平路线。在IOS7、Android中我们体验良好，但在Win8metro中受到的评论不这么乐观。不管是属于什么设计，设计的美在于是否适合。不能说扁平化设计就比谁好，非黑即白并不适合，设计师的思维要保持弹性。简单介绍下，Metro风格的来源，和windows推崇这种风格的理由。现在改名叫WindowsUI。1来源于地铁和超市都会用到的大方格的信息板。优点是直观，你想要的信息都在一格中集中显示。2理由，考虑它是现实中已有的设计能使用户很好接受。个人感觉问题是没考虑国际化的事情，有的国家对这种东西并不熟悉。===================================================================UI美术层次概念了解极简的扁平化设计有助于我们分析界面的视觉层次。介绍下123原则，abc原则。1，一个目的（一看就懂），两秒等待（停顿的时间/玩家等待刷新时不会产生烦躁的时间），三个层次2，字间距行间距留白间距三个层次，体现在UI美术上，除了明显的层次关系外，设计或图形复杂度的变化也属于这个范畴。复杂度即是2次元到3次元的过度，越接近3D质感图素的层次级别越高，越接近2D、扁平化、无质感图素的层次级别越低。级别高的能吸引玩家的第一个视觉焦点，然后随着级别下降图案复杂度跟着下降，引导玩家逐级阅读。级别低的更简约清晰，适合做设置和在按钮较多的界面以及空间不足时出现。清晰的界面层次能让玩家更容易的理解玩法，突出想要重点表现的元素。反之，图素就会互相抢夺注意力出现画面花、碎的问题，让玩家感到茫然。-以上是一些UI意识理论，制作时我们还要处理很多实际的问题，请期待下次关于UI制作的分享。