一个完整的UI设计流程是怎样的？

发布网友发布时间：2022-04-22 09:28

我来回答

共5个回答

热心网友时间：2023-09-13 23:35

设计流程

一、确认目标用户

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

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

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

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

不同类型的目标用户有不同的交互习惯。这种习惯的交互方式往往来源于其原有的针对现实的交互流程、已有软件工具的交互流程。

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

三、提示和引导用户

软件是用户的工具。因此应该由用户来操作和控制软件。软件响应用户的动作和设定的规则。

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

四、一致性原则

设计目标一致

软件中往往存在多个组成部分（组件、元素）。不同组成部分之间的交互设计目标需要一致。

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

元素外观一致

交互元素的外观往往影响用户的交互效果。同一个（类）软件采用一致风格的外观，对于保持用户焦点，改进交互效果有很大帮助。遗憾的是如何确认元素外观一致没有特别统一的衡量方法。因此需要对目标用户进行调查取得反馈。

交互行为一致

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

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

对于交互行为一致性原则比较极端的理念是相同类型的交互元素所引起的行为事件相同。但是我们可以看到这个理念虽然在大部分情况下正确，但是的确有相反的例子证明不按照这个理念设计，会更加简化用户操作流程。

五、可用性原则

可理解

软件要为用户使用，用户必须可以理解软件各元素对应的功能。 [1]

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

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

可达到

用户是交互的中心，交互元素对应用户需要的功能。因此交互元素必须可以被用户控制。

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

要注意的是交互的次数会影响可达到的效果。当一个功能被深深隐藏（一般来说超过4层）那么用户达到该元素的几率就大大降低了。

可达到的效果也同界面设计有关。过于复杂的界面会影响可达到的效果。（参考简单导向原则）

可控制

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

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

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

扩展资料

设计原则

1、简易性

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

2、用户语言

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

3、记忆负担最小化

人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。人类的短期记忆有限且极不稳定，24小时内存在约25%的遗忘率。所以对用户来说，浏览信息要比记忆更容易。

4、一致性

它是每一个优秀界面都具备的特点。界面的结构必须清晰且一致，风格必须与产品内容相一致。

5、清楚

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

6、用户的熟悉程度

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

7、从用户习惯考虑

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

通过比较两个不同世界(真实与虚拟)的事物，完成更好的设计。如：书籍对比竹简。

8、排列

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

9、安全性

用户能自由的作出选择，且所有选择都是可逆的。在用户作出危险的选择时有信息介入系统的提示。

10、灵活性

简单来说就是要让用户方便的使用，但不同于上述。即互动多重性，不局限于单一的工具(包括鼠标、键盘或手柄、界面)。

11、人性化

高效率和用户满意度是人性化的体现。应具备专家级和初级玩家系统，即用户可依据自己的习惯定制界面，并能保存设置。

参考资料来源：百度百科-UI设计

热心网友时间：2023-09-13 23:36

一.UI设计参与完成的流程。
UI设计的工作流程会根据公司性质、规模、项目性质、项目规模、UI职能要求等的不同有所区别。
UI设计参与完成的流程大致为：
1. 参与需求评审，理解PRD
2. 用户调研、情绪板梳理（主要针对一些对体验、视觉要求很高的产品，需要更加多关注人的设计，不是必要流程）
3. 交互设计
4. 视觉设计
5. 视觉评审（视觉稿确定过后）
6. UI走查、验收（开发提测后，发布前）
在工作过程中，可能会组织团队成员对设计方案、项目进行复盘，这样细致的分工会把每个环节都打磨得非常到位。我们再来细分工作中的每一步，具体的工作内容是什么？
1.参与需求评审，理解PRD
一个项目全员开始动工，应该就是从需求评审开始。在产品理清楚需求后，会输出PRD或者原型草图，依据PRD或者原型草图来和项目组的全体成员澄清需求。在需求澄清会中，项目组成员会对需求、操作流程、业务逻辑等提出不同的问题，产品完善问题。需求澄清不会一次就让项目组全体成员清晰的明确所有需求，产品会根据大家的疑惑去不断完善需求内容，在多次的需求澄清后，大家达成一致的共识，正式开始动工。
在这个过程中UI设计需要：
（1）反复和产品沟通，确认，协助产品给出原型草图。
（2）协助产品明确产品的市场定位、产品定义、客户群体、运行方式等。
2. 用户调研、情绪板梳理
产品、UI、UE等相关人员会依据产品的定位、竞品分析、目标用户的使用场景、需求、心理等提出用户的研究报告。
在这个过程中UI设计需要：
（1）参与讨论，输出纸稿线框稿、用工具制作线框图。
（2）协助产品初拟产品设计方向和思路，提出可用性设计建议。
3. 交互设计
交互设计阶段一般由交互设计师（UE）和产品一起制定，根据可用性分析结果制定交互方式、操作流程、跳转流程等。在线框图阶段去设计交互流程，可以减少由于交互流程改变而带来的视觉设计的改变。这个阶段会输出原型图，以支持后面做详细的视觉设计。很多公司没有专职的交互设计师，交互设计由产品或者UI完成。
在这个过程中UI设计需要：
（1）这个过程，UI可以依据上一个流程中的输出，初步设计产品的风格，然后和产品不断推敲。
（2）原型设计的不断完善，纸质草图-线框图-低保真-高保真（高保真原型成本较高，很多小规模的公司都不做高保真原型设计）。
4.视觉设计
视觉设计阶段，UI根据界面原型，对界面原型进行视觉效果的处理。该项目组的UI在明确界面风格、要求后，开始制作所有界面的视觉设计
在这个过程中UI设计需要：
（1）确定整个界面的风格、界面、窗口、图标、色调、按钮的表现。
（2）完成所有界面的视觉设计，交出最终的视觉稿。
5. 视觉评审
在视觉稿确定之后，UI设计组针对界面做一致性测试、简洁性测试、美观度测试、用户体验测试、行业标准测试等。然后召集项目组所有人员召开原型的可用性测试评审会，发现可用性问题并提出修改意见。当视觉评审过了之后，配合技术部门实现界面设计的实际效果。
在这个过程中UI设计需要：
（1）针对提出的问题，对界面进行不断的完善。
（2）参与视觉评审全过程。
（3）配合技术部门实现界面设计的实际效果，给出最后的界面效果图，标注好距离、尺寸、颜色、文字大小等。
（4）输出前端开发工程师需要的切图。
6. UI走查、验收
在发布前，测试会针对可用性、用户体验、测试界面等对设计问题进行一下回馈，在依据这些问题把设计工作进行细节调整。再正式发布之后，收集市场上真实的用户体验并记录，为下个版本提供强有力的市场需求。
在这个过程中UI设计需要：
（1）不断完善界面设计。
（2）UI人员把可行性建议进行完善，不断总结以备以后产品设计升级。
当然，以上谈到的UI设计工作只是一个大致的流程，一个项目UI参与的流程肯定是会依据公司性质、规模、项目性质、人员配比等不同，所做的工作有所缩减或精分。
二.那真实的流程是什么？以下是2个性质不同，业务方向不同的UI设计师，在项目中的真实经历。
1.公司性质：大型金融科技公司项目类型：金融类营销项目项目特点：定制化开发、用户多、营销性强，资金量大开发模式：迭代开发
大概的项目流程：
（1）项目负责人：制定项目计划
（2）需求：根据用户诉求，分析产品规划，输出需求文档
（3）需求：依据初步的原型图和需求文档，对开发、测试澄清需求
（4）设计：根据需求，交互设计师设计原型图，输出交互稿；UI设计师输出UI稿。交互和UI评审
（5）开发：依据迭代要求和开发计划，开发对应功能模块
（6）测试：输出测试方案，依据测试计划和开发给出的转测范围，测试对应功能
（7）运维：迭代开发完成后，项目交付，进入运维期
整个迭代开发的过程中，需求会给出产品模块之间的逻辑关系、内部流程，设计和需求对接，设计给出低保真原型图，设计和需求多次对接，完善原型。需求和原型通过评审和澄清之后，开发和测试开始动工。
具体的UI工作流程见下：
需求分析->交互设计->交互评审->UI设计->UI评审->上线前UI验收
特点：
（1）由于公司产品流量大，用户多。本着以用户第一的价值观，产品自身对用户交互习惯和页面美感设计要求比较高，保障用户体验第一
（2）需求稿中的产品示意图为简图，需求评审完成后，交互设计师和UI设计设计师都会输出高保真原型图进行评审
（3）产品上线前，项目负责人、交互设计师、UI设计师都会会产品功能、视觉进行验收
2.公司性质：普通国企项目类型：*、军工项目项目特点：定制化开发、用户基础少、专业性强开发模式：迭代开发
大概的项目流程：
（1）市场：参与竞标拿到项目
（2）项目负责人：制定项目计划
（3）需求：和客户对接需求，输出需求文档
（3）设计：和需求对接，设计原型图
（4）需求：依据初步的原型图和需求文档，对开发、测试澄清需求
（5）开发：依据迭代要求和开发计划，开发对应功能模块
（6）测试：依据测试计划和开发给出的转测范围，测试对应功能
（7）运维：迭代开发完成后，项目交付，进入运维期
整个迭代开发的过程中，需求会给出产品模块之间的逻辑关系、内部流程，设计和需求对接，设计给出低保真原型图，设计和需求多次对接，完善原型。需求和原型通过评审和澄清之后，开发和测试开始动工。具体的UI工作流程见下：
需求分析->低保真原型->需求沟通->原型图 ->切图配合前端开发
特点：
（1）由于公司性质和项目原因，公司所有项目网页风格大致相同，视觉要求不会有社交类产品要求高，在流程中会弱化视觉设计。
（2）公司一个UI对对应多个项目，没有专门的交互设计师，需求人员也不会给出线框图去清晰描述内部流程，所以UI设计需要自己梳理需求中的逻辑关系，内部流程。
（3）项目成本原因，UI不会输出高保真原型图，输出的原型图能够支持需求和客户对接，能够和开发、测试澄清需求即可。
当然这仅仅是两个UI的工作流程并不代表全部，但是UI设计的工作流程也大致相同，只是针对不同的岗位职责、不同的项目特点等会有不同的特点。
比如，中高级设计师可能会主导一些项目，需要参与前期需求调研、立项到项目结束的整个过程，工作流程就比较复杂了。
若公司规模较小，一个UI可能对应多个项目，可能就需要产品给出清晰的项目流程、逻辑关系、甚至是简单的线框图，方便UI快速给出对应的原型设计，在流程中会弱化草稿设计。
若项目成本较低，UI不会输出高保真原型图，输出的原型图能够支持需求和客户对接，能够和开发、测试澄清需求即可。
若公司没有专门的交互设计师，那交互设计的工作也有可能交给产品或者UI设计一并完成。
三.综上所述，为了顺应不同公司、项目的需求，全链路UI设计成了目前UI设计市场上的抢手货，全链路UI又需要具备哪些技能？
全链路顾名思义就是全都会，和全栈开发一个道理，就是设计的技能都会，参与的流程都懂。一个全链路设计师你需要懂平面、懂交互、会插画、会动效、懂界面，一个人可以包揽品牌设计师、网页设计师、界面设计师、交互设计师的活，看看：
（1）品牌设计师：具有独立的设计思考能力和洞察力以及具有艺术设计思维的创意设计能力，能独立完成企业品牌设计。
主要精通工具： Photoshop,illustrator,CorelDRAW,After Effects
（2）网页设计师：独立掌握企业站，专题站，淘宝电商的设计流程和方法，了解自适应和响应式的布局特点，掌握前端代码实现语言。
主要精通工具： Photoshop,illustrator,After Effects,AX,X-mind,C4D,DW
（3）界面设计师：擅长IOS和Android等移动端界面设计，对大数据界面有独到的设计技巧，熟练掌握移动端设计的设计规范和流程。
主要精通工具： Photoshop,illustrator,After Effects,AX,X-mind,Cutterman等
（4）交互设计师：具有人机交互和用户体验思维，能够从用户的角度提供最佳交互设计方案，以便让设计师更完美的设计终端产品。
主要精通工具： Photoshop,After Effects,AX,X-mind,Cutterman,蓝湖等。
所以，UI设计参与的流程不仅会根据公司性质、项目性质、人员配比等不同有所不同，也会根据你掌握的技能有所区分。若能成为全链路UI设计，那你不管是在中小型企业还是大型互联网公司都可以胜任对应的工作。

热心网友时间：2023-09-13 23:36

一、确认目标用户
在UI设计过程中，需求设计角色会确定软件的目标用户，获取最终用户和直接用户的需求。
用户交互要考虑到目标用户的不同引起的交互设计重点的不同。
例如：对于科学用户和对于电脑入门用户的设计重点就不同。
二、采集目标用户的习惯交互方式
不同类型的目标用户有不同的交互习惯。这种习惯的交互方式往往来源于其原有的针对现实的交互流程、已有软件工具的交互流程。
当然还要在此基础上通过调研分析找到用户希望达到的交互效果，并且以流程确认下来。
三、提示和引导用户
软件是用户的工具。因此应该由用户来操作和控制软件。软件响应用户的动作和设定的规则。
对于用户交互的结果和反馈，提示用户结果和反馈信息，引导用户进行用户需要的下一步操作。
四、一致性原则
设计目标一致
软件中往往存在多个组成部分（组件、元素）。不同组成部分之间的交互设计目标需要一致。
例如：如果以电脑操作初级用户作为目标用户，以简化界面逻辑为设计目标，那么该目标需要贯彻软件（软件包）整体，而不是局部。
元素外观一致
交互元素的外观往往影响用户的交互效果。同一个（类）软件采用一致风格的外观，对于保持用户焦点，改进交互效果有很大帮助。遗憾的是如何确认元素外观一致没有特别统一的衡量方法。因此需要对目标用户进行调查取得反馈。
交互行为一致
在交互模型中，不同类型的元素用户触发其对应的行为事件后，其交互行为需要一致。
例如：所有需要用户确认操作的对话框都至少包含确认和放弃两个按钮。
对于交互行为一致性原则比较极端的理念是相同类型的交互元素所引起的行为事件相同。但是我们可以看到这个理念虽然在大部分情况下正确，但是的确有相反的例子证明不按照这个理念设计，会更加简化用户操作流程。
五、可用性原则
可理解
软件要为用户使用，用户必须可以理解软件各元素对应的功能。
如果不能为用户理解，那么需要提供一种非破坏性的途径，使得用户可以通过对该元素的操作，理解其对应的功能。
比如：删除操作元素。用户可以点击删除操作按钮，提示用户如何删除操作或者是否确认删除操作，用户可以更加详细的理解该元素对应的功能，同时可以取消该操作。
可达到
用户是交互的中心，交互元素对应用户需要的功能。因此交互元素必须可以被用户控制。
用户可以用诸如键盘、鼠标之类的交互设备通过移动和触发已有的交互元素达到其它在此之前不可见或者不可交互的交互元素。
要注意的是交互的次数会影响可达到的效果。当一个功能被深深隐藏（一般来说超过4层）那么用户达到该元素的几率就大大降低了。
可达到的效果也同界面设计有关。过于复杂的界面会影响可达到的效果。（参考简单导向原则）
可控制
软件的交互流程，用户可以控制。
功能的执行流程，用户可以控制。
如果确实无法提供控制，则用能为目标用户理解的方式提示用户。

出自百度百科

热心网友时间：2023-09-13 23:37

不少刚刚入行做UI设计的朋友，都期待着可以参与公司项目设计的整个流程，但是不同的公司，具体的流程可能是不一样的。为了满足广大学员的需求，小编姐姐就UI设计流程简单分析如下：

一、确认用户需求

在UI设计过程中，需求设计角色会确定软件的目标用户，获取最终用户和直接用户的需求。用户交互要考虑到不同目标用户的交互设计重点，将这些重点融合。例如：老年人用户和专业用户的设计重点就不尽相同，所有的目标用户的需求都要考虑进去。

二、采集交互方式

目标用户不同交互习惯也千差万别。习惯性的交互方式往往来源于其原有的针对现实的交互流程、已有软件工具的交互流程。在此基础上通过调研分析找到用户希望达到的交互效果，并且以流程确认下来。

三、讨论并制定草图框架

在一个项目的开始，UI设计师就需要参与到整个项目当中。对于产品需求的了解，不只是产品经理或者项目负责人的事情。所以，需要UI设计师、项目负责人、产品经理和客户一起作出讨论。这个时候，你就需要画出一个大概的框架草图。

对于一些外包项目，客户的需求很多时候都是模糊的，这个时候，整个产品的功能、结构框架也都是模糊的，所以，可能需要UI设计师积极的与客户或者项目负责人沟通，了解清楚。要不然，你就会抓瞎，没法开始接下来的项目。

四、流程图

这个时候，你需要结合开始的产品需求和框架草图，用思维导图工具做出一个具体的流程图，理清你的设计思路。这样你的项目负责人可以直观的看到整个的流程，你在开始设计的时候，也可以依据你做的流程图。

做脑图/思维导图/流程图的工具其实有很多。在这里呢，列举一些常用到的流程图工具，如Mindnode/百度脑图/Xmind/Mindmanager等等。

五、原型图

所需工具：Sketch(框架图)、POP(初步原型)、墨刀(高保真原型图和交互)等

六、确定设计稿和原型交互demo

所需工具：Sketch(设计稿)、Axure(原型交互)、Marvel(原型展示)、Principle(交互动效)、墨刀(原型交互)

七、设计和待开发

所需工具：PS、AI等(设计)、Cutterman (切图工具)、PxCook(标注、切图工具)、Zeplin(切图、设计稿标注)等。

设计过程就不说了，只要你是一位UI设计师，页面怎么做那你肯定清楚。当你设计完成页面以后，要做的工作就是：标注、切图。

八、引导用户交互

软件是为目标用户服务。因此应该由目标用户来使用和控制软件。软件响应用户的动作和设定的规则。对于目标用户交互的结果和反馈，提示目标用户结果和反馈信息，引导目标用户进行自我需求的下一步操作。

九、一致性原则

1、设计目标一致

软件中往往存在多个组成部分(组件、元素)。不同组成部分之间的交互设计目标需要一致。例如：以老年人作为目标用户，以简化界面逻辑为设计目标，那么该目标需要贯彻软件(软件包)整体，而不是局部。

2、元素外观一致

交互元素的外观往往影响用户的交互效果。同一个(类)软件采用一致风格的外观，对于保持用户焦点，改进交互效果有很大帮助。遗憾的是如何确认元素外观一致没有特别统一的衡量方法。因此需要对目标用户进行调查取得反馈。

3、交互行为一致

在交互模型中，不同类型的元素用户触发其对应的行为事件后，其交互行为需要一致。例如：所有需要用户确认操作的对话框都至少包含确认和放弃两个按钮。对于交互行为一致性原则比较极端的理念是相同类型的交互元素所引起的行为事件相同。但是我们可以看到这个理念虽然在大部分情况下正确，但是的确有相反的例子证明不按照这个理念设计，会更加简化用户操作流程。UI设计流程大解析

十、可用性原则

1、可理解

软件要为目标用户服务，软件各元素对应的功能要被目标用户所理解。如果不能为用户理解，那么需要提供一种非破坏性的途径，使得用户可以通过对该元素的操作，理解其对应的功能。例：删除操作元素。用户可以点击删除操作按钮，提示用户如何删除操作或者是否确认删除操作，用户可以更加详细的理解该元素对应的功能，同时可以取消该操作。

2、可达到

用户是交互的神经，交互元素对应用户需要的功能。因此交互元素必须可以被用户控制。用户可以用诸如键盘、鼠标之类的交互设备通过移动和触发已有的交互元素达到其它在此之前不可见或者不可交互的交互元素。要注意的是交互的次数会影响可达到的效果。当一个功能被深深隐藏(一般来说超过4层)那么用户达到该元素的几率就大大降低了。可达到的效果也同界面设计有关。过于复杂的界面会影响可达到的效果。

3、可控制

软件的交互流程，用户可以控制。功能的执行流程，用户可以控制。如果确实无法提供控制，则向目标用户提示相关的信息。

十一、项目进度管理

所需工具：Trello(任务管理)、Bearychat(团队沟通)

以上是对UI设计流程的内容，内容也许不是最全，但也能让你对UI设计流程有清楚的认识，之前也有分享UI设计的相关知识《ui设计是什么》、《浅析ui设计就业前景》、《UI设计7大就业方向》、《ui设计原则要素有哪些》、《ui设计培训课程内容》、《ui设计工具大揭秘》等，感兴趣的可以去看看，后期我还会分享更多UI设计行业知识，大家多多关注!若是有你特别想知道的内容，可以留言告诉小编，小编尽量分享大家想了解的行业知识。