UI设计流程详解：从架构设计到最终上线
UI设计流程详解：从架构设计到最终上线
在实际的工作中，UI设计师所负责的工作内容不仅仅只是设计这一环，通常需要与团队成员进行协作，毕竟，UI设计师需要有完善的设计思维与逻辑思维，深入地参与到交互设计的部分。那么，UI设计流程是什么？让我们一起来看看完整的UI设计流程。
1. 架构设计阶段
在UI设计流程中，不管是To B还是To C，信息架构设计UI流程都需要简洁清晰，减少用户的学习成本，让用户在最短的时间内做效率最高的事情。具体的办法就是提炼最核心的主要功能，通过聚焦核心场景对需求进行合理的划分和整合。好的信息架构可以让用户初次就有一个简单且清晰的认知，知道产品大概的用途，可以迅速找到某个功能，并且可以有明显的感知主次分明。总结下制作信息架构来设计UI流程的主要步骤：
- 了解用户的使用习惯、偏好
- 用户最关心的有哪些功能
- 确定关键使用场景和用途
- 调研竞品的信息架构
- 卡片分类整理
- 绘制信息架构
2. 整理需求
探索初期的需求通过优先级排序后，得到的是迭代计划的安排，每个迭代做哪些需求以及未来1-3年的需求规划。目前这个阶段定的关键页面主要场景涉及到的需求，一般是基础必备的功能。在设计UI流程考虑需求价值时候，可以从四个维度考虑：
- 这个需求受众有多大？
- 这个需求的使用频率是以每天、每周还是每个月为周期？
- 用户对这个需求是刚需还是无所谓？
- 这个需求属于当前迭代规划吗？（优先级和重要性）
3. 整理设计步骤
UI设计师不是一个人在战斗，还有前端、后端、测试、产品等等并肩作战。UI设计流程并不是一味的串行，很可能是你输出一部分图，前端开发一部分界面，测试写一部分的测试用例，齐头并进。而且前端开发会涉及到数据的关联逻辑，有些界面必须先行开发，才能支撑其他界面的开发。所以你得搞清楚哪些模块优先级较高哪些较低。根据他们的开发优先级来确定设计UI流程的先后顺序。
4. 绘制低保真原型
接下来可以进入UI设计流程绘制低保真原型阶段了。UI设计师拿到产品的原型后千万不能照搬原型不加思考被动工作，可以结合自己的理解给予更细致的交互建议或者更合理的布局优化。
由于探索前期的不确定性，原型图会反复修改，所以建议采用最简单便捷的方式去绘制原型图。以便和项目组成员方便讨论和深入讨论细节和推敲逻辑的合理性，最短的时候内作出修改和调整。点击了解低保真和高保真原型的区别。
5. 确定设计风格
确定设计风格是UI设计流程中重要的一个阶段。由于每个角色对美的认知不一样，所以对设计风格也会有各自主观意识。如何减少用户的主观意识，get到用户甚至是牵引用户喜欢的设计风格呢？其实不外乎以下几点：
- 明确项目背景，提炼核心目的
- 提取用户特征，主要角色有哪些，关注点各自是什么和宏观要求
- 提炼3-5个关键词
- 根据关键词头脑风暴关联
6. 设计高保真原型
这是设计UI流程前期探索阶段的的最后一步。输出直观的可视化页面，远远比一堆文字和报更能触动人心和说服力。除了商业价值和收益估算，直接影响立项的重要一环就是关键页设计。
这个就是考验设计功底部分了，此处需要再次回顾竞品分析总结的共性部分，以及UI设计流程上阶段设计风格里面涉及关键词的参考图。建议设计之前一定要浏览学习大量设计前沿的一些优质作品，拔高眼界，设计出高质量不平庸的作品并且交付给开发同学。点击了解高保真原型图怎么做。
7. 进行设计走查
UI设计流程中最后一步便是进行设计走查。在走查完最后一轮并且达到公司对上线要求的还原度后，便可以封装上线。走查时可以采用以下三种方式与开发沟通：
方式一：当面口述
站在程序员边上，将问题直接说出来，看着程序员修改，修改完毕后离开。
适用场景：
- 产品即将上线，设计问题仍未进行修改。
- 多次强调设计缺陷，但仍未修改。
- 用文字无法表达自己的想法。
优点：
- 沟通及时，能快速达到自己想要的效果。
缺点：
- 会给程序员压迫感。
- 设计提问题的速度远快于修改的速度，所以较浪费设计的时间。
方式二：图片截图
发现有设计问题，图片截图发给开发。
适用场景：
- 开发有时间能及时响应设计问题。
- 设计问题需要大家进行讨论。
优点：
- 截图发到群里后，群里成员可以对此问题及时发表看法，方便沟通。
- 方便设计人员提出问题。
缺点：
- 截图容易淹没在聊天记录中，开发忘记有此问题。
- 无法追踪该问题是否已解决。
方式三：文档记录
使用在线文档记录所有设计走查问题，并使用不同文字格式代表此问题的当前状态。
适用场景：
- 外包项目，将设计走查内容输出一份文档给外包人员更容易确定工作量。
- 团队中尚未推行缺陷管理工具。
优点：
- 可以协同编辑，沟通方便。
- 可以记录当前问题是否解决。
缺点：
- 定义的文字格式规则略显麻烦，不容易在不同项目组中推广。