所有的工作,都会有一套工作流程贯穿始终。作为我们UI设计师,工作流程也必不可少。不同的UI设计师团队,在工作流程的差异性也是很大的。
一、一般中大型设计团队的设计流程;
1、接到原型或需求;
2、沟通并明确设计内容;
3、根据界面的设计规范进行界面绘制;
4、确认效果图、评审;
5、界面导出标注、切图;
6、视觉还原;
二、不同阶段的注意事项:
1、接到原型阶段注意事项:
(1)接到需求后,不要直接进行设计工作,先与需求方沟通、思考,需求的来源、优先级、目标、价值,知道你在为谁设计;用户目标是谁。
(2)理清文字、图片、插画等信息。哪些是重要的,哪些是不重要的,怎么在页面中布局起来?
(3)看需求先看全局,再看链路,再看局部和细节。看全局:先看全局的功能,看这个界面的影响范围,是否对其他界面有影响。最后避免漏掉细节。
(4)穷举所有的用户场景。把用户所有的使用场景。在使用这个功能的可能性都列举出来。
(5)多状态考虑,包括网络异常、接口异常等情况下界面的呈现状态都考虑出来。
(6)利用自己学到的交互思维帮助业务方判断方案是否还有优化空间,是否满足可用性、易用性原则;以及交互模式是否正确。
2、界面绘制的要点:
(1)和业务需求方确定信息的优先级,多角度考虑;
(2)运用格式塔的心理学布局,运用在界面中(靠近、相似、对比、对齐);
(3)根据设计规范设计界面,绘制界面组件的时候,不要重复绘制,学会适当创新。
(4)先设计整体的,再打磨细节;
(5)利用软栅格进行界面设计,让界面布局更有规律和节奏;
(6)正确的使用颜色。
3、界面评审的要点:
(1)先团队内部进行设计稿评审,再对外评审。
(2)效果图评审时,除了设计原则外,更多的考虑业务角度。
(3)评审时,只允许讨论视觉相关的内容。
(4)有动效的最好可以放demo;
(5)补全所有状态时的展示。
4、切图和标注的要点:
(1)用sketch measure插件可以导出规范,给开发看;
(2)所有元素,除图片之外,都必须是矢量图,如果是1倍图做的设计需要将切图放大至2倍或3倍,避免失真。
(3)所有元素的尺寸、大小都需要进行标注,方便开发进行实现;
(4)切图一定要有安全区,标注可以用sketch一键标注;
5、视觉还原的要点:
因为开发通过代码实现后的界面一定会与设计稿有所出入,所以要和开发进行视觉还原联调;
(1)文本上下有艰巨,在设计过程中,把行高和字体大小设计成一致的;
(2)通过多设备的截图和效果图进行重叠、测量对比进行视觉验收;