UX组织系统和导航系统（ux操作系统）

本文目录一览：

• 1、ui和ux设计基本原理？
• 2、ui/ux网站模型设计指南？
• 3、什么是导航系统
• 4、UI界面和UX交互设计之间是什么区别？
• 5、成为用户体验设计师要具有哪些能力
• 6、名词解释：UX、UI、UCD、Usability、IA等设计中的常见名词

ui和ux设计基本原理？

UI与UX,如果您进行了有关软件设计的任何类型的研究，您可能已经听说过“ UI”和“ UX”这两个术语。

UI和UX的区别是什么?

以最简单的形式UX设计是使界面有用的要素，UI设计是使界面美观的要素。对于UI，这包括视觉层次结构和界面元素的混合。要了解将好界面与好界面区分开的原因，必须了解UI设计仅仅是整个设计过程的一层。也许这就是为什么人们经常混淆UX和UI的原因。但是，在接下来的几段中，我希望作为听众或读者帮助您了解设计过程中差异之处。

根据Garrett在《用户体验的要素》中的介绍，可以从五个主要方面来理解UX。让我们从最抽象的平面开始：

产品设计的第一平面

从较高的层次看，第一平面实际上是产品设计的起点。在这里，您将采用不同的研究方法，包括用户访谈，竞争性分析，用户角色和其他研究方法，以了解：

您要解决的问题是什么?

您的用户需求是什么?

您的产品如何适应业务环境(产品目标)?

第二架飞机：

产品设计第二平面

在此阶段，您应该定义平台的功能规格和内容要求。换一种说法：

您如何通过平台解决问题?有哪些功能，您如何确定它们的优先级?

设计人员面临的挑战是在优先考虑功能的同时最大程度地权衡取舍。当然，您可能有数百个想法可以解决问题，但是您不能全部实现。

第三架飞机：

在此阶段，您的想法应开始形成结构。信息架构与应用程序中信息的组织方式以及用户如何认知地处理信息有关。用户流可以勾勒出用户通过该应用程序进行的特定旅程，以帮助解决他们的特定需求。它涉及使您的用户满足其需求的最合乎逻辑的步骤。

下一个层面是事情变得不那么抽象，更具体的地方：

骨架平面试图实现界面设计和信息设计的结构。界面设计与特定界面元素的布置有关，以使用户能够与系统的功能进行交互，而信息设计与信息的呈现有关，从而有助于理解。

在此阶段，您可能会发现UX或产品设计师在线框上进行设计，测试和迭代。线框的保真度非常低，通常是灰度模型，它们向用户展示了每个界面元素的意图。

最后，最具体的飞机：

顾名思义，水平面致力于获得出色的感官体验和视觉设计。设计师的目标是通过以一种凝聚力的形象成功传达品牌，产品，价值和功能，与用户建立内在联系。

在这架飞机上，您会发现UI设计师和视觉设计师使用诸如Sketch，Photoshop，Adobe Experience Design，Illustrator或Figma之类的工具来完成大部分工作。

接下来，让我们进入UI设计的一些基本原理。

原则1：清晰至上。

没有比应用程序中的歧义更糟糕的了。该按钮有什么作用?我怎么到这里了?我该如何回去?为了避免这种情况，设计人员应始终问自己：

为什么在这里?这有意义吗?我还能探索什么其他可能性?

优秀的设计师知道如何探索界面布局的各种可能性，每种界面的潜在权衡，以及了解哪种设计可以帮助用户最好地实现其目标。设计上的清晰度使用户在浏览您的应用程序时感到自信。

原则2：提供清晰，有意义的反馈

我们都使用了网站或应用程序来尝试单击按钮，并且我们想知道系统是否注册了该点击。

简而言之，每个动作都需要一种反应。例如，如果您是Web开发人员，则更改按钮的：hover状态是一种常见的反馈形式，它可以使您的用户了解其悬停操作。

一个很好的例子是Facebook使用其骨架加载状态。当用户等待其内容加载时，内容形式的加载状态会为用户提供有意义且相关的反馈，以使用户了解其内容正在加载。

原则3：一致性很重要。

当提到一致性时，我指的是整个产品中界面元素或语言的一致性。用户开始学习如何使用产品后，就不必重新学习它了。让我们来看一个不良一致性的例子。

Xfinity主页

Xfinity电视页面

Xfinity个人页面

上面的示例可能看起来像来自3家不同公司的3个网站，但实际上并非如此。是什么让人们觉得呢?好吧，每个页面的导航栏使用不同的颜色，布局和字体样式集。作为用户，这可能会造成混乱和迷惑，并且用户可能会忘记这些都在一个网站下。

作为设计师，您如何在整个应用程序中保持一致性?您可以使用一致的网格系统设计应用程序，例如在移动应用程序和图标设计中找到的常见8点网格系统。您还可以在整个屏幕上保持一致的配色方案和导航元素。这些元素都可以植根于样式指南中：

关键是：良好的一致性和结构会让您的用户有宾至如归的感觉。

原则4：如有疑问，请使用已建立的设计模式。

在这里请不要误会我的意思，即创新是令人敬畏的，而且值得鼓励，但创新不应该以牺牲用户体验为代价。如果车轮在完成工作方面做得很好，则无需重新发明车轮。例如，如果您不确定图标是准确还是直观地表示一个单词，则只需在该位置使用该单词即可。或坚持常见的颜色模式，例如红色阴影以警告/警告用户，或绿色以标记完成。

为什么要使用既定的设计模式?好吧，其中之一，许多已确立的设计原则都基于人类的感知。在读取内容块时，让我们采用F形读取模式或眼睛扫描模式。

F形阅读模式。

这是根据从眼睛跟踪实验收集的数据生成的热图。红色区域代表查看最多的部分，而蓝色区域代表最少的部分。如您所见，生成的热图在某种程度上类似于字母F。但这对设计师意味着什么?

这意味着您应该将最重要的内容放在左上角。

例如，通常会在左上角找到徽标。这使公司可以加强其品牌形象。在右上角，您通常可能会找到要导航的页面，或者可能是搜索栏。这使用户可以轻松导航不同的页面，而无需在整个页面中搜索导航元素。这是两个遵循此设计模式的示例：

随着您在页面上越走越远，用户的注意力可能会枯竭。因此，将最重要的内容放在顶部，并为用户提供大胆的标题，以使您的内容易于扫描。

原则5：使用视觉层次结构。

什么是视觉层次?嗯，元素的排列方式暗示了相对重要性。这是设计师尝试引导眼睛感知呈现的信息的顺序。

我们感知信息的方式是通过促成几个因素的影响如何，我们排名布局中的内容的层次结构。让我们跳入一些层次结构基础知识：

一，版式

什么是好的排版?两个主要因素是可读性和移植性。

易读性是一种字体的先天品质，它使每个单独的字母形式彼此区分开。这完全取决于字体，因此您无法做任何使字体更清晰的事情，因此请适当选择。

可读性取决于您如何操作特定字体以使其更易于理解。

注意顶部字体比底部字体难读吗?如果不…

现在呢?

决定某项内容易于阅读的另一个因素是行长。如果行太短，并且阅读器不断在行与行之间跳动，则阅读器很难吸收信息。如果线长太长，也会发生同样的情况-眼睛很快就会疲劳。

另外，切勿将大块副本居中。对于我们来说，阅读左对齐的文本块要容易得多，因为眼睛可以准确知道下一行的开始位置。

二。空格(又称负空格)

有没有人看过菜单/网站/界面，然后想到：“这看起来很棒，但我不确定为什么吗?”现在好了。答案是空格。空白有助于极大地提高可读性和理解力。一项研究(Lin，2004年)发现，在段落之间以及左右边界处充分利用空白可以将理解力提高近20%。读者发现更容易集中精力处理大量的内容。

正空格=狗。负空间=目录

许多人认为空白取决于“味道”。我认为这比这更客观。我们可以有意地使用空白来创建强大的层次结构。让我们看一下Helen Tran的网站，以及她如何有意地使用空白：

请注意如何有4个清晰的内容块。让我们进一步分解一下：

Helen使用行高，字体大小，颜色和空白的组合来分隔每个块本身内的内容。这使用户可以轻松自然地浏览这些内容块的各个部分。

三，颜色

颜色理论真的非常复杂。我的目标不是解释颜色理论的全部，而是为您提供一些广泛的概念，您也许可以立即在UI设计中加以利用。

如果您凝视上面的图片，您会注意到左侧的蓝色方块感觉更远，而右侧的红色方块感觉更近。暖色朝您身上，而冷色则逐渐淡入背景。让我们在UI示例中看一下：

在上面的设计中，我们可以看到设计师如何使用暖红色将号召性用语(立即更新)向前移动，而如何使用较冷的蓝色将导航移到更远的背景中。左图中的情况相同。红色的闪电图标立即在界面的其余部分中脱颖而出。

您还可以使用颜色将相似的界面组件组合在一起：

最后，少即是多。颜色越多，每种颜色的影响就越小。一个很好的例子是Instagram最近的重新设计：

颜色的减少不仅使照片更加突出，而且还提高了通知的有效性，因为它们不再与顶部和底部导航栏中的颜色竞争。

相关推荐

ui和ux设计基本原理

成为一名出色的UI/UX设计师必备技能有哪些

UI设计先培训后交学费骗局

现在学ui设计都是傻子

ui设计培训后失业

零基础学ui设计真他妈惨

ui设计培训四个月骗局

ui/ux网站模型设计指南？

设计应用程序和网站带来了特殊的挑战：

1.促进复杂的任务和工作流程2.用户能够理解和管理复杂数据3.适应各种用户角色，需求和流程

设计的价值

成功的应用程序设计的关键不是一个好功能，一切都取决于用户体验（UX）和用户界面（UI）。

您的应用程序用户在打开应用程序时会首先看到什么？用户首先看到的是登录页面。什么是目标网页？这是用户了解应用程序或站点是否满足其要求并满足需求的起点。它必须具有吸引力，并包含一些号召性用语按钮，以使用户知道下一步该怎么做。

什么是UX设计？

UX（用户体验）设计是创建可为用户提供有意义和相关体验的产品，系统或服务的过程。这涉及获取和集成产品的整个过程的设计，包括品牌，设计，可用性和功能方面。它还包括人机交互和产品所有权的有意义和有价值的方面。UX处理内容和站点地图的体系结构。

UI（用户界面）设计，是UX设计的一个重要方面，它是UX设计的一个子集，因为UX设计涵盖了其他许多领域。信息体系结构（IA）是用户体验设计的第二个最可行的方面。

UX设计可帮助用户实现目标。它不仅专注于创建可用的产品，还涵盖了用户体验的其他方面。UX设计的主要任务是创建可以量身定制的产品，以满足用户的特定需求，但提供可预测的功能。换句话说，UX设计旨在研究用户行为并了解用户动机，设计更好的数字体验。

UX设计原理

1.层次

层次结构是设计师的重要内容之一，可帮助用户轻松浏览产品。它包括：a）信息体系结构b）视觉层次结构

2.一致性

在大多数情况下，可以通过使用一套针对如何为特定设备或格式设计产品的正式准则来实现。

3.确认性

需要防止错误，用户可以不小心做任何重要的或不可逆的动作确认。

4.用户控件

“撤消”，“后退”，“搜索”按钮以及键盘快捷键是使用户可以控制网站或应用程序的好方法。

5.辅助功能

对于尽可能多的人易于使用该产品至关重要。用户体验设计应该消除人们使用产品时的障碍，无论这些障碍是暂时的还是永久的。

用户体验设计过程

概括地说，下面是UX设计过程的步骤：

用户研究

设计

UX线框图、UX原型、UI设计（视觉和交互）

用户测试

UX设计部分

交互设计

创建具有深思熟虑的行为的引人入胜的界面。用户和技术之间的简单清晰的交流。交互设计负责使人与单个用户界面或多个界面（或系统）之间实现交互的功能。

线框和原型

在最终设计之前，演示网站的基本组件作为任务或交互式原型的模型。

信息架构图

有效且可持续的方式组织，组织和标记内容。

用户研究

通过观察任务分析和其他反馈方法来了解用户的行为，需求和动机。

什么是UI设计？

UI用户界面设计是为计算机和软件设计用户界面的一门学科，重点是响应性和美观性，最大程度地提高了可用性，以营造良好的用户体验。作为UX的一部分，UI设计更着重于颜色和版式。简而言之，UI设计是视觉设计和交互设计的组合。

UX设计着重于将按钮放置在哪里以便用户轻松找到它，而UI设计将考虑如何使此按钮看起来更美观以使用户想要按下它。

UI设计精心设计了一种通用的视觉语言和层次结构，可增强用户与您的产品互动的方式。UI汇集了交互设计，视觉设计和信息体系结构中的概念。

UI设计原则

1.结构。它关注整体用户界面架构，并且模型应该清晰，一致，可识别，并且将相关的事物放在一起，将不相关的事物分开，并使相似的事物彼此相似。

2.简单性。设计应该使简单，通用的任务变得容易，以用户自己的语言清楚，简单地进行通信。

3.能见度。没有多余的信息。设计应使给定任务的所有所需选项和材料可见，而不会分散注意力。

4.意见反馈。以清晰，简明的方式告知用户并了解所有相关操作，状态或条件的变化，错误或异常。

5.宽容性。设计应具有灵活性，以允许通过撤消和重做来减少错误和误用。

6.重用性。设计应重用内部和外部组件和行为，保持目的的一致性，而不仅仅是任意的一致性。

UI设计过程

1.功能需求收集。

2.用户和任务分析。

3.信息架构。

4.原型制作。

5.可用性检查。

6.可用性测试。

7.GUI（图形用户界面）设计。

8.软件维护。

UX设计师的典型任务各不相同，包括用户研究，创建角色，设计线框和交互式原型以及测试设计。

简而言之，UX设计人员参与了广泛的用户研究，制定信息体系结构以及创建用户个人资料。UX设计师不一定具备视觉或图形设计技能，但是必须了解心理学和系统设计。

UI设计师同时尝试将复杂的结构分解为易于理解的简单格式，以方便最终用户。因此，UX / UI设计人员都致力于为用户提供有效的体验。

什么是导航系统

GPS[1]是以全球24颗定位人造卫星做基础，向全球各地全天候地提供三维位置、三维速度等信息的一种无线电导航和定位系统。GPS的定位原理是：用户接收卫星发射的信号，从中获取卫星与用户之间的距离、时钟校正和大气校正等参数，通过数据处理确定用户的位置。现在，民用GPS的定位精度可达10m以内厶GPS具有的特殊功能很早就引起了汽车界人士的关注，当美国在海湾战争后宣布开放一部分GPS的系统后，汽车界立即抓住这一契机，投入资金开发汽车导航系统，对汽车进行定位和导向显示，并迅速投入使用。 汽车GPS导航系统由两部分组成：一部分由安装在汽车工的GPS接收机和显示设备组成；另一部分由计算机控制中心组成，两部分通过定位卫星进行联系。计算机控制中心是由机动车管理部门授权和组建的，它负责随时观察辖区内指定监控的汽车的动态和交通情况，因此整个汽车导航系统起码有两大功能：一个是汽车踪迹监控功能，只要将已编码的GPS接收装置安装在汽车上，该汽车无论行驶到任何地方都可以通过计算机控制中心的电子地图上指示出它的所在方位；另一个是驾驶指南功能，车主可以将各个地区的交通线路电子图存储在软盘上，只要在车工接收装置中插入软盘，显示屏上就会立即显示出该车所在地区的位置及目前的交通状态，既可输入要去的目的地，预先编制出最佳行驶路线，又可接受计算机控制中心的指令，选择汽车行驶的路线和方向。 随著计算机技术的快速发展, 汽车系统已成为计算机软硬件的必争之地。汽车导航系统是其中最为突出的应用之一。从应用的角度，汽车导航系统可分为两类。第一种方式是汽车拥有独立的GPS导航装置，可以进行自主导航。例如，全球导航系统领先者VDO公司开发的MS6000系统，将音响和导航技术融为一体，采用直观的菜单和易操作的遥控装置，只要输入目的地，并在它提供的最多8条路线中选定一条，就可在导航系统指引下轻松上路。它会通过车载喇叭，播放行驶方向的语音提示，并在大型彩色显示屏上显示导航图像。日本松下公司推出的多用途汽车GPS导航仪，配备了CD驱动器和5.8英寸TFT液晶显示器。第二种方式是公众信息服务性质的车辆定位跟踪、监控系统。它由车载GPS接收部分和监控中心GPS定位导航部分组成，使用专线或公共网络进行通信，为行驶的车辆提供导航信息、跟踪调度、保全防盗、信息查询与救援等项服务。北京的“ 奥星天网” GPS信息服务系统、南京的110报警巡逻车GPS系统等，统统属于此类之例。 目前，汽车导航系统的理论研究与实践探索已经呈现出方兴未艾的蓬勃趋势，许多软件公司都已开发除了自己的汽车导航系统。汽车导航系统的不断发展和成熟也必将为社会经济的发展带来更多的收益，为人们带来更多的方便。

UI界面和UX交互设计之间是什么区别？

现在越来越多公司都在提倡UX体验设计，那么到底什么是UX体验设计？和UI有哪些区别？

感觉这个词语熟悉又陌生，那么今天我和大家分享下我的理解，仅代表我个人的观点和大家互相交流探讨，如有不对的地方欢迎多交流。

一、什么是UI？什么是UX？

1. 什么是UI？

简单理解就是界面+交互。

什么属于UI呢？

这个我想大家都已经很熟悉，就是我们每天使用的产品的界面外观设计，无论是视觉效果，还是品牌个性，还是页面的交互设计，都属于UI范围内。

很多同学会问，交互设计不是属于交互么？怎么划分在UI了？

其实，UI是用户界面设计的统称。随着时代的发展，纯UI的时代已经过去了，今天的UI设计师，除了掌握视觉设计还需要具备一定交互设计能力。

从百科中对于UI的定义也是如此：负责产品的人机交互、操作逻辑、界面视觉的整体设计。从字面大家也可以看出-用户界面，除了界面还包含用户和界面之间的交互。

如果你觉得不好理解，一个简单粗暴的理解方式就是UI=交互+视觉。

2. 什么是UX？

UX我们可以把它理解为用户任务流程设计，今天我们用户注册我们一个新的产品，需要那几个步骤？

——用户通过朋友圈看见我们的商品广告，通过那几步到达购买页，最后转化付费，这些我理解为UX，

引用百度百科的资料UX核心是用户，体验指用户在使用产品以及与产品发生交互时出现的主观感受和需求满足。

UX设计师研究和评估一个系统的用户体验，关注该系统的易用性、价值体现、实用性、高效性等。

举个例子：我们去银行的ATM提款机上取钱，看到的界面和每一步操作数据UI设计。但是如何存钱？如何更改密码？如何转账汇款？

——这些流程的设计属于UX设计，他关注这个产品是否好用和易用。

UX我更多理解为用户的行为表达，UX设计是在用户直接或者使用服务时候感受到的体验，比如反馈，和任务指引的整体设计。

比如之前我们去星巴克买咖啡时候，如果遇见人很多，我们就必须排着很长的队。但是今天，我们去店里人很多，直接可以手机上操作，手机上排号，大大提升了效率。

那么这个体验的的优化就是UX工作，它可以改变我们生活的体验，类似这样的UX改变生活的案例还有很多。比如越来越多餐厅也可以通过微信排号，无须店门口等待，只需要关注他们公众号，到时候会有排号提醒。

3. 解决问题的视角不同

UI和UX大家本质都是在解决用户问题，只不过站位不同视角不同，UI更多是解决用户第一印象，这个设计好不好看，交互逻辑合理不合理，结构清晰不清晰，页面功能层次表达是否合理。

而UX更多是定义了产品目标流程，UX更多解决产品的深度，而UI是产品的宽度，两者都很重要。

互联网行业发展了这么多年，用户体验已经融入到了我们生活中点点滴滴，UI和UX尽管本质不同，UI更加具有视觉性，UX更多是逻辑系统性。

但是他们一般都属于一个团队，只不过大家运用不同的技能，不用的工具，不同的问题处理方式——但是最终都是把我们产品体验做好。

二、UI与UX的区别有哪些？

1. UX让界面更好用，UI让界面更好看

这句话很好理解，UI设计师的价值是让我们的界面好看符合用户审美趋势，同时交互上符合用户逻辑，符合产品想传递的功能优先级，没有大的交互原则问题。

UX是让整个流程更好用，更好引导用户完成任务，达成我们的商业目标。这中间两者使用的技能也不相同。

2. UX让用户实现目标，UI让界面提升品牌感

UX帮产品实现产品目标，很好理解，今天任何的产品都需要有商业目标，无论是刚上线的新产品，还是老产品都有用户目标。

拿618，双11这些大型活动来说：很多电商都各种营销，那他们的商业目标是什么？

——是GMV成交额，所以UX的目标是怎么让GMV最大化，那么这中间就涉及到：用户入口、用户路径和链路的完整设计，每一个环节的漏损都应该考虑在里面。

那么UI就是用户在使用产品过程中，心情是否感觉愉悦，没有任何的使用负担，体验时候特别友好。

同时界面和交互时候不会感觉冗余，同时用户界面的表达有温度，如上图google的情感化表达一样，UI就是建立用户和商业这件的情感品牌桥梁。

3. UX核心目标引导用户完成任务，UI不是

另外一个不一样的点是，UX核心是引导用户完成用户目标和任务。

比如火车票软件，虽然它的交互视觉很糟糕，但是相对比这个更重要是如何帮助用户完成目标，UX的优先级高于UI,如果产品无法满足用户价值，对用户没有意义，那么UI做的再好其实意义也不大。

历史上有很多昙花一现的产品都是如此，比如早期的Path、Paper等产品就是UI视觉交互很都很好，但是在商业层面以及UX上没有那么完美，没有很好的用户价值，最终页难躲过消失的命运。

4. 交付的成果不一样

UI和UX的交付产出也有很大的不一样，UX的输出包括UX体验报告、功能定义、功能规划、项目进度、概念设计、需求评估、市场研究、数据研究、可用性测试、用户体验地图、流程图、交互原型图等等。

这是大概一些产物，当然还包括一些通用的比如汇报、提案等。

UI的交付大家都比较清楚，包括视觉和交互、视觉设计、品牌设计、动效设计、组件设计和设计语言等等，当然方案汇报提案也是一样的。

5. 职责不同

UX设计师还一个重要角色就是策略制定和内容设定，任何产品内容是核心。

拿电商来说：人、货、场，货就是内容非常的主要，这个内容如何和用户互动，同时被用户接受，和用户互动，这个中间UX设计师扮演着非常重要的角色。

一般来说，UI和UX都会用到这些工具

1. Mason

现如今，视觉稿（Mockup）和原型（Prototype）是网页和 APP 设计过程中最常用的方法。两种方式都很有效，不过也都可能会在时间和花销上对整个项目产生压力，影响团队和项目的整体推进，尤其是在时间和精力都非常有限而项目又非常复杂的情况下。

Mason 提供了一个更好的解决方案，它让你无需设计线框图、原型和视觉稿，而直接拿现成的组件来编辑和设计，并且确保最终输出的产品既具备功能，也是像素完美的，最后通过 Mason 的平台进行部署，甚至你都不需要有代码编写的经验。

Mason 的设计方法看起来很激进，但是实际上非常的易用。无论是调整还是维护，Mason 都能确保控件和元素都很容易处理。在 Mason 中修改、发布，然后就能正常使用。无需亲手编写代码，诸如注册、登录等各种常见的功能都能够正常输出使用。

这款工具并不会限制你将网站投放到特定的平台或者托管环境下，你可以在你最熟悉的服务器或者服务商那边部署。这可以大幅度节省管理费和时间，并且你会发现团队协作更加高效了。

2. Overflow

设计师讲述故事最有效的办法之一，是将故事中的节点连在一起，将用户历程线性地呈现出来。这样的方式会让访客更好的理解他们所看到的内容，同时能够更加专注于细节的呈现，并且构建有效的反馈机制。

作为世界上第一个为设计师量身定制的用户流程图工具，Overflow 可以帮助设计师更好地讲述故事。它为设计师提供了一种全新的方式来更好的呈现作品，讲述故事，以交互式的流程同用户进行沟通，吸引用户的注意力。

Overflow 是一款跨平台的工具，可以与目前最流行的设计工具无缝地集成起来，允许设计师在同一个平台上完成设计、展示、共享和打印他们的用户流程。

3. UXPin

UXPin 可能是目前对于设计团队来说最理想的快速原型工具，尤其是当产品的 UX 设计和研发高度依赖快速反馈循环机制的时候。UXPin 可以让设计团队在向开发交付原型之前，充分地进行设计、共享和测试。

开发人员所需要的数据，实际上在每个项目设计完成之时，就会自动生成。所以，在将设计交付给开发人员之前，甚至可以使用检测工具，验证一下产品的部署是否和设计元素相互匹配。

UXPin 还提供一个完整的设计系统解决方案，帮助你保持整个产品的 UI 元素的一致性。而每个产品的 UI 组件都可以使用一段代码记录下来，因此可以更加轻松快速的扩展产品的功能。

4. Creately

UI/UX 设计当然不仅仅是线框图和视觉稿，它是动态的，系统化的，而这也是 Creately 这款工具的价值所在。这款图标工具适合生成工作流程，支持不同的图表类型，包括流程图、思维导图、UML 图标、线框图等。它所提供的图表功能和协同工作的功能，可以帮助设计师完成一半以上的工作。

使用 Creately 来创建图表，可以轻松创建出足够漂亮的图表，其中配备的1000多个专业的设计图表模板，可以快速地完成各式各样的 UX 设计项目。

5. PowerMockup

有许多 UX 设计师会使用 PowerPoint 来构建交互式原型，有了 PowerMockup 之后，你再也不需要寻找其他的工具来辅助你的工作了，它就可以帮你创建高效可共享的交互式原型。

在构建原型的时候，只需要从 PowerMockup 不断增长的资源库找到对应的形状或者设计元素，拖拽到 PowerPoint 当中，然后进行设计即可。为了实现互动，你所需要调用的也无非是 PowerPoint 当中的幻灯片和动画功能，很简单。

6. Visual Inspector

Visual Inspector 让设计师、开发者和负责维护的人员能够实时地在网站中检查和解决各种 UI 问题，并且同其他的工作人员随时共享信息。

这款工具不需要你懂得代码，只需要几秒钟就可以启用 UI 工具，并且几乎可以任何类型的网站（使用 HTML 代码，或者 WordPress 系统的）进行协同工作。这款工具不是免费的，终身授权的版本只需要付费49美元即可。

7. Fluid UI

Fluid UI 是一款可以用来设计线框图、原型图和视觉稿的综合性工具，它还为项目经理和分布式设计团队提供了非常完善的协作功能。它拥有非常全面的组件库，横跨桌面端、iOS 和 Android 等主流的、必须的平台。

8.摹客

这款国产的工具快速易用，Sketch / PS / XD / Figma / Axure / Mockplus设计稿一键上传 ， 设计评审讨论 ， 自动标注一键生成，手动标注自由发挥 。

成为用户体验设计师要具有哪些能力

用户体验设计师（UX Designer）的角色可以说的复杂的、多面的同时也是责任重大的.尽管 UX设计是产品开发的一个必要环节，但由于它相对来说比较新，所以很多人来说并不确切的知道UX设计师的责任和工作。

如果说用户体验是用户与产品所有交互的体验，那么用户体验设计就是，设计师试图确定的体验的过程。尽管在不同的公司，不同的项目，UX设计师工作职责差异很大，但大都包含以下内容：

产品研究

产品研究包括用户和市场研究，是每个UX设计师开始一个UX设计项目的起点，也是优秀设计的基础。让设计师能够基于真实的数据做决定而不是凭空假设。之所以将产品研究放在首位是因为通过产品研究能够获取和了解用户的行为、目标、动机和需求。

产品研究帮助UX设计师理解行业标准，识别特定领域产品面临的风险和机遇，同时有利于在众多的产品功能和特性中，做出合理的优先级排序。

创建用户画像和产品使用场景

用户画像是真实用户的虚拟代表，是建立在产品和用户研究获取的大量真实数据之上的目标用户模型。将用户区分为不同类型，抽取出典型特征，赋予名字、照片，一些人口统计学要素，场景等描述，就形成了一个人物原型。人物角色是虚拟的，但能代表一类真实用户的行为。

当确定用户画像后，便可以分析和编写用户使用场景，使用场景需要描述产品是如何融入用户的生活。具体的用户使用场景分类包括使用时间、地点、使用时的心理状态、使用设备、周边环境。

信息架构设计

信息架构（IA：Information Architecture），是美国建筑师沃尔曼 （Richard Saul Wurman）先生在 1975 年提出的。包括调查、分析、设计和执行过程，它涉及到组织系统、导航系统、搜索系统和标签系统的设计，目的是帮助人们成功地发现和管理信息。

关于信息架构的内容很庞杂在这里不展开叙述，对于用户体验设计师需要设计结构、决定组织方式以及归类，好让用户容易寻找与管理，在设计的过程中需要依赖经验，直觉和创造力，同时也要愿意冒险并相信直觉。

名词解释：UX、UI、UCD、Usability、IA等设计中的常见名词

1、IA(Information Architecture)—-信息体系架构

信息体系结构，或简称为IA，是高层的信息结构设计，它规划出了用户最终将如何从系统获取信息和知识。信息体系架构师可以被认为是用户体验团队的“系统工程师”，这意味着他(或她)将对内容是如何被组织的、在任何给定时刻哪些页面元素需要可见或可用以及其它的较高层次的决定负责。信息体系架构师直接和用户体验团队的主任一起工作，以便将商业需求和用户需求转换为系统原型。这些原型通常是以一个对系统或过程的描述图表的形式交付的。一个优秀的信息体系架构师的知识背景通常会略微侧重于工程而非设计，同时他们在进行信息结构设计时更倾向于采取以一种较为务实的观点，而非追求创新。

2、UCD(User-Centered Design)—-以用户为中心设计

一个成功的交互系统必须能够满足用户的需要。这意味着不仅要能够识别各种用户群，而且还可辨别各个用户所掌握的技能、经验以及他们的偏好，但是设计人员并不是想象中的那样了解目标用户。

关于以用户为中心的设计的构成内容尚未达成明确的共识。但是 John Gould 和他在 IBM 的同事于 20 世纪 80 年代开发了一种称为

Design for Usability (GOU88) 的方法，它包括了最为普遍接受的定义。它从若干交互系统的实践中发展而来，其中最著名的系统是 IBM

公司的 1984 Olympic Messaging System (GOU87)。

该方法由四个主要部分组成，如下所述：关注用户、集成化设计、初期用户测试、迭代式设计。

3、UI(User Interface)—-用户界面

在人和机器的互动过程(Human Machine

Interaction)中，有一个层面，即我们所说的界面(interface)。从心理学意义来分，界面可分为感觉(视觉、触觉、听觉等)和情感两个层次。用户界面设计是屏幕产品的重要组成部分。界面设计是一个复杂的有不同学科参与的工程，认知心理学、设计学、语言学等在此都扮演着重要的角色。用户界面设计的三大原则是：置界面于用户的控制之下;减少用户的记忆负担;保持界面的一致性。

GUI(Graphical User Interface)图形用户界面是UI一个部分

4、Usability—-可用性

可用性(Usability)是交互式IT产品/系统的重要质量指标，指的是产品对用户来说有效、易学、高效、好记、少错和令人满意的程度，即用户能否用产品完成他的任务，效率如何，主观感受怎样，实际上是从用户角度所看到的产品质量，是产品竞争力的核心。

ISO

9241-11国际标准对可用性作了如下定义：产品在特定使用环境下为特定用户用于特定用途时所具有的有效性(effectiveness)、效率(efficiency)和用户主观满意度(satisfaction)。其中：

有效性 -用户完成特定任务和达到特定目标时所具有的正确和完整程度;

效率 -用户完成任务的正确和完整程度与所使用资源(如时间)之间的比率;

满意度 -用户在使用产品过程中所感受到的主观满意和接受程度。

可用性工程(Usability

Engineering)是交互式IT产品/系统的一种先进开发方法，包括一整套工程过程、方法、工具和国际标准，它应用于产品生命周期的各个阶段，核心是以用户为中心的设计方法论(user-centered

design -

UCD)，强调以用户为中心来进行开发，能有效评估和提高产品可用性质量，弥补了常规开发方法无法保证可用性质量的不足，九十年代以来开始在美、欧、日、印等国IT工业界普遍应用。

5、UXD/UED(User Experience Design)—-用户体验设计

“用户体验”，UX(User Experience)指的是软件应用和审美价值，是以用户至上的观点作为基石的。主要由以下四种因素构成：

印象(感官冲击)

功能性

使用性

内容

这些因素相互关联，不可分割，共同形成正确的用户体验。这些因素也是一个软件成功，所必不可少的主要因素。其中“印象”也可以归结成这个软件塑造的一个“品牌”效应。UXD就是指围绕UX而进行的一些列设计。