UI设计分析.docx

UI设计分析.docx

《UI设计分析.docx》由会员分享，可在线阅读，更多相关《UI设计分析.docx（8页珍藏版）》请在冰豆网上搜索。

UI设计分析

UI设计

UI到底是啥？

当你打开电脑时，是否想象过你熟悉的这些界面是怎么来的？

当你用媒体播放器播放音乐时，你是否会选择一个你喜欢的界面？

你是否曾因为漂亮的手机操作界面而决定买下手机，又或者你是否总喜欢下载最新的各种表情和图标？

要知道，这一切都是因为有了UI设计师。

用一句话概述：

UI是连接机器与人沟通的桥梁。

UI的中文名是用户界面（Userinterface），是指对软件的人机交互、操作逻辑、界面美观的整体设计。

举例来说，开车的时候方向盘和显示器就是这个界面，看电视的时候遥控器和屏幕就是这个界面，用电脑的时候键盘和显示器就是这个界面。

因此，UI设计师的工作范围非常庞杂，涉及软件界面设计、即时通讯软件界面设计、媒体播放器界面造型设计、游戏界面设计、桌面主题定制、软件图标设计、工具栏图标设计、logo设计、表情头像图标设计、手机界面设计、PMP播放器界面设计、TV端界面设计、PDA界面设计、车载设备界面设计等等。

我们现在使用的大多数设备界面也是现在大多数设计师所做的工作都是图形用户界面，即GUI（Graphicaluserinterface）。

我们通过这些可视化的图形界面来理解计算机，进行工作。

UI的由来

UI在中国真正兴起发展到现在不过短短的几年时间，对于UI的行业标准在不同的公司不同的行业也不相同。

可能很多人的对UI的认识还停留在传统意义上的“美工”，但实际上UI并不是单纯意义上的美术工人，而是了解软件产品、致力于提高软件用户体验的产品外形设计师。

我们最早使用的计算机，最初的界面可不像现在这么友好，那时的界面还是命令行界面，CLI（Commandlineinterface）。

计算机只是被政府或大型机构使用，在普通人眼中是完全不能理解的存在。

（命令行界面，BourneshellinteractiononVersion7Unix）

而乔布斯一直渴望计算机能进入寻常百姓家。

在1979年，他「命运般」地参观了施乐公司，然后做了一回搬运工……使得图形界面被应用在Macintosh上，还引入了鼠标。

苹果电脑大肆宣传其创新的交互界面，Macintosh的诞生开启了一个新的时代。

而那时的界面设计也奠定了现在的计算机界面。

你可以发现很多设计，过了几十年依旧被保留了下来。

（1984年面世的MacOSSystem1.0）

System1.0是苹果随同Macintosh128K的最初电脑操作系统，发布于1984年1月，是第一个麦金塔操作系统。

当时的System1.0含有桌面、窗口、图标、光标、菜单和卷动栏等项目。

这是最早的关于UI的理念。

随着计算机系统的不断发展，我们使用的界面也变得越来越人性化。

让我们看一下最新的MAC系统及Windows系统界面。

OS XEl Capitan

Win10系统

UI的职能及价值

一是图形设计，软件产品的产品“外形”设计。

漂亮的用户界面，能够让用户赏心悦目百看不厌，给人带来舒适的视觉享受，拉近人与商品的距离，是建立在科学性之上的艺术设计。

无论是谁都喜欢漂亮的东西，无论是什么只要是漂亮的，总会让你多看两眼，哪怕你现在用不上或者说不能用，至少让你记住了它。

界面也要像美女一样，脸蛋漂亮，凹凸有致，这样才能人见人爱。

但UI存在的价值不是单纯的美化页面。

好的UI设计不仅是让软件变得有个性有品位，还要让软件的操作变得舒适简单、自由，充分体现软件的定位和特点，是对软件的人机交互、操作逻辑、界面美观的整体设计。

检验一个界面的标准既不是某个项目开发组领导的意见也不是项目成员投票的结果，而是终端用户的感受。

二是交互设计，主要在于设计软件的操作流程、树状结构、操作规范等。

一个软件产品在编码之前需要做的就是交互设计，并且确立交互模型，交互规范。

合理的信息结构，可以将产品的主要流程，主要业务等很明显的曝露在用户面前，可以让用户在一瞬间就知道我们的产品是做什么的。

除此之外，信息与信息之间还需要有层次，一个好的UI，是有韵律的，是有节奏的。

三是用户测试/研究，这里所谓的“测试”，其目标恰在于测试交互设计的合理性及图形设计的美观性，主要通过以目标用户问卷的形式衡量UI设计的合理性。

良好的用户体验，让用户了解到我们的产品以后能够很轻松很简单的就能使用。

她“善解人意”，她“温柔体贴”，能够知道你现在可能需要/要做什么，你以后可能需要/要做什么。

研究界面

图形设计师GraphicUIdesigner

国内大部分UI工作者都是从事这个行业。

。

这些设计师大多是美术院校毕业的，其中大部分是有美术设计教育背景，例如工业外形设计，装潢设计，信息多媒体设计等。

人与界面

交互设计师interactiondesigner

在图形界面产生之前，长期以来UI设计师就是指交互设计师。

交互设计师的工作内容就是设计软件的操作流程，树状结构，软件的结构与操作规范（spec）等。

一个软件产品在编码之前需要作的就是交互设计，并且确立交互模型，交互规范。

交互设计师一般是软件工程师背景居多，也有视觉设计师转行进入的。

研究人

用户测试/研究工程师Userexperienceengineer

任何的产品为了保证质量都需要测试，软件的编码需要测试，自然UI设计也需要被测试。

这个测试和编码没有任何关系，主要是测试交互设计的合理性以及图形设计的美观性。

测试方法一般都是采用焦点小组，用目标用户问卷的形式来衡量UI设计的合理性。

这个职位很重要，如果没有这个职位，UI设计的好坏只能凭借设计师的经验或者领导的审美来评判，这样就会给企业带来严重的风险性。

用户研究工程师一般是心理学人文学背景比较合适。

综上所述UI设计师就是：

软件图形设计师、交互设计师、用户研究工程师。

我们要做的就是：

尽一切所能，留住用户。

GUI工作内容

谈到UI设计师都在做什么，便涉及到平台问题。

现在有这么多的系统，PC端的、移动端的，有Web、APP。

每一个平台的设计原则、设计规范、交互、布局都不尽相同，存在着很大的差异化，每一个平台也决定着UI设计师的发展方向。

当然视觉设计和平台差异的问题并非最难的，更重要的是通过设计解决用户的问题，发挥软件的效用。

理解用户体验，考虑商业需求，了解技术难点，并从整个服务全局思考问题，是真正对UI设计师的考验。

具体工作内容如下：

Ø负责软件界面的设计、创意工作和制作工作；

Ø根据各种相关软件的用户群，提出构思新颖、有高度吸引力的创意设计；

Ø对页面进行优化，使用户操作更趋于人性化；

Ø维护现有的应用产品；

Ø收集和分析用户对于GUI的需求。

设计原则

1.简易性

界面的简洁是要让用户便于使用、便于了解、并能减少用户发生错误选择的可能性。

2.用户语言

界面中要使用能反应用户本身的语言，而不是游戏设计者的语言。

3.记忆负担最小化

人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。

人类的短期记忆极不稳定、有限，24小时内存在25%的遗忘率。

所以对用户来说，浏览信息要比记忆更容易。

4.一致性

是每一个优秀界面都具备的特点。

界面的结构必须清晰且一致，风格必须与游戏内容相一致。

5.清楚

在视觉效果上便于理解和使用。

6.用户的熟悉程度

用户可通过已掌握的知识来使用界面，但不应超出一般常识。

7.从用户习惯考虑

想用户所想，做用户所做。

用户总是按照他们自己的方法理解和使用。

通过比较两个不同世界（真实与虚拟）的事物，完成更好的设计。

如：

书籍对比竹简。

8.排列

一个有序的界面能让用户轻松的使用。

9.安全性

用户能自由的作出选择，且所有选择都是可逆的。

在用户作出危险的选择时有信息介入系统的提示。

10.灵活性

简单来说就是要让用户方便的使用，但不同于上述。

即互动多重性，不局限于单一的工具（包括鼠标、键盘或手柄、界面）。

11.人性化

高效率和用户满意度是人性化的体现。

应具备专家级和初级玩家系统，即用户可依据自己的习惯定制界面，并能保存设置。

设计流程

确认目标用户

在UI设计过程中，需求设计角色会确定软件的目标用户，获取最终用户和直接用户的需求。

用户交互要考虑到目标用户的不同引起的交互设计重点的不同。

例如：

对于科学用户和对于电脑入门用户的设计重点就不同。

采集目标用户的习惯交互方式

不同类型的目标用户有不同的交互习惯。

这种习惯的交互方式往往来源于其原有的针对现实的交互流程、已有软件工具的交互流程。

当然还要在此基础上通过调研分析找到用户希望达到的交互效果，并且以流程确认下来。

提示和引导用户

软件是用户的工具。

因此应该由用户来操作和控制软件。

软件响应用户的动作和设定的规则。

对于用户交互的结果和反馈，提示用户结果和反馈信息，引导用户进行用户需要的下一步操作。

一致性原则

设计目标一致

软件中往往存在多个组成部分（组件、元素）。

不同组成部分之间的交互设计目标需要一致。

例如：

如果以电脑操作初级用户作为目标用户，以简化界面逻辑为设计目标，那么该目标需要贯彻软件（软件包）整体，而不是局部。

元素外观一致

交互元素的外观往往影响用户的交互效果。

同一个（类）软件采用一致风格的外观，对于保持用户焦点，改进交互效果有很大帮助。

遗憾的是如何确认元素外观一致没有特别统一的衡量方法。

因此需要对目标用户进行调查取得反馈。

交互行为一致

在交互模型中，不同类型的元素用户触发其对应的行为事件后，其交互行为需要一致。

例如：

所有需要用户确认操作的对话框都至少包含确认和放弃两个按钮。

对于交互行为一致性原则比较极端的理念是相同类型的交互元素所引起的行为事件相同。

但是我们可以看到这个理念虽然在大部分情况下正确，但是的确有相反的例子证明不按照这个理念设计，会更加简化用户操作流程。

可用性原则

可理解

软件要为用户使用，用户必须可以理解软件各元素对UI设计应的功能。

如果不能为用户理解，那么需要提供一种非破坏性的途径，使得用户可以通过对该元素的操作，理解其对应的功能。

比如：

删除操作元素。

用户可以点击删除操作按钮，提示用户如何删除操作或者是否确认删除操作，用户可以更加详细的理解该元素对应的功能，同时可以取消该操作。

可达到

用户是交互的中心，交互元素对应用户需要的功能。

因此交互元素必须可以被用户控制。

用户可以用诸如键盘、鼠标之类的交互设备通过移动和触发已有的交互元素达到其它在此之前不可见或者不可交互的交互元素。

要注意的是交互的次数会影响可达到的效果。

当一个功能被深深隐藏（一般来说超过4层）那么用户达到该元素的几率就大大降低了。

可达到的效果也同界面设计有关。

过于复杂的界面会影响可达到的效果。

（参考简单导向原则）

可控制　　

软件的交互流程，用户可以控制。

功能的执行流程，用户可以控制。

如果确实无法提供控制，则用能为目标用户理解的方式提示用户。

设计产出物：

视觉设计稿，视觉设计标注规范，视觉设计规范文档，视觉切图等

设计工具：

Photoshop，Sketch，Illustrator，Fireworks，markman