设计师日常协作经验沉淀总结-2020

我在之前的一段时间里，针对产品设计与开发之前的合作配合做了一定的反思，其中发现很重要的一点就是，沟通是最主要的影响团队协作的因素之一。

早期设计师之间沟通方式基本是面对面沟通，实质性解决问题耗时长且并不能完全解决很多问题，大多时候靠着设计师本身的设计能力和判断来决定一些东西。

那和开发人员的沟通中呢？例如设计师与开发人员中经常存在着不必要的反馈循环，比如按钮大小，一些具体的间距数值，甚至有时候可能会因为一两个像素之差产生一些不必要的矛盾等。

我打算分为以下这几个内容去讲述：

目录

1、如何有效的沟通

2、缩短设计师与开发人员之间距离并解决沟通问题的一些具体做法

3、什么是设计规范？它有什么好处

4、开发过程中遇到一些问题如何解决

5、关于视觉走查

6、周期开发后遇到问题如何解决

一直在强调沟通，那么沟通的目的是什么？

沟通的目的是使得双方能达成 共识。

沟通？看起来简单，但在实际工作中并非易事。

错误的沟通会引发很多问题：

其实，在产品的创造过程中，因为开发人员和设计师分别扮演着完全不同的角色：

设计师通常专注于图形和界面功能，比如菜单的布局和配色方案等。

开发人员则更关注使产品运行的幕后工作，其中很多内容都涉及代码。

因此，设计师和开发人员之间的脱节其实很常见，有时甚至只有当设计文件被发送到开发团队时，双方才会开始进行信息交流。

因为这些分离，就导致了有时候会出现一些沟通上的问题。比如出现问题时，双方可能半天不在一个点上，要说明白几次，才明白最终目的是什么。所以，要在在这之间建立连接，使得设计和开发的过程更加有凝聚力。这个连接就是我们刚才一直强调的，使得双方达成一致的目的。

那么，缩短设计师与开发人员之间的距离并解决沟通问题的做法有哪些呢？

尽早让开发人员参与项目：

设计师可以就如何将设计元素转化为app向开发人员征询意见。让开发提前参与初期的产品规划，以及在早期设计想法成型的时候就与开发人员沟通。这样开发人员可提前甄别潜在的（或者可能）代码问题，有助于更轻松的调整。比如设计出的页面比较创新或者少见，开发人员需要去提前搜寻那一类型的代码以寻求可实现等。

协调设计师与开发人员的对接：

认真整理设计文件，良好的图层管路可以提高修改方案的效率，还能反应设计思路是否清晰；随开发人员过设计稿，解释清楚很多细节，开发人员也有机会在开始编程之前就把问题问清楚

设计师应该尽可能响应各种屏幕和各个端口来查看成品。 

尽可能充分准备与开发人员的对接：

比如项目切图就可按照不同开发人员的习惯，线下切图打个包，线上蓝湖也建立了切片，开发人员可以自行下载这种，将会需要对接的地方更全面的交付给开发。比如在视觉走查阶段，还可以增加为设计图增加一些注释，帮助开发人员鉴别出差异。

简化沟通：

每个团队有每个团队的通信方式，比如我司之前的方式就是企业微信、钉钉、TAPD，邮件等，但是多种方式可能会有遗漏的信息，甚至会无意间落下一些关键的参与者。可以确定什么类型的使用专门的沟通渠道，比如一些及时沟通的，可以采用企业微信和线下沟通，一些需要定期更新维护的可以采用TAPD，通知类用邮箱。并且在整个项目期间定期与所有成员举行小组会议，了解项目进度和一些暂时性的问题，商讨解决方案。

促进知识重叠：

某些情况下，两方的脱节是由于彼此都缺乏对项目每个过程中所涉及到的内容的理解。所以需要通过鼓励分享的概念，增加双方的知识和理解。比如给设计提供一些编程基础知识的资源，以便了解自己设计出来的东西能否转换成可行的代码，设计呢，同样也可以与开发人员分享设计的基本知识以及图形元素的一些使用，能帮助他们加强设计知识和概念。双方对彼此有更好的了解也可以减少一些误解，团队之间沟通也会更契合。

打成一片：

参与项目的人聚在一起工作，促进团队友情，这样在工作中彼此相处也会更加愉快舒适。比如设计在进行视觉走查时，可以半个凳子坐在开发周边，这样也会比线上反复沟通的效率高很多，亲测有效！！！

分享行业趋势：

鼓励两方人员互相分享所关注的行业趋势，将一些有价值的信息汇集起来，有利用的时候可以拿出来看看，没准有些有价值的内容可以带来更好的用户体验也说不定呢。

总结，设计师与开发人员的沟通要做到两点：

1、让开发人员清晰的明白产品交互设计需求（可直接查看需求文档、原型图）

2、让开发人员能够严格执行界面设计元素（色彩、尺寸、字体、LOGO等），也就是我们常说的设计规范。

整洁的工作文档不但有利于提高团队的工作效率，还可以体现设计师的专业程度。

刚才说到设计规范，那么设计规范的好处是什么：

设计规范可以：解决团队协作项目中控件使用混乱的问题，可以使产品在迭代过程中保持品牌一致性，也会大大提高开发人员工作效率，减少不必要的代码重复。

那么什么是规范呢？规范包含了：尺寸、间距、图标、颜色、字体、组件等等：

接下来，会以我之前的工作整理出一份简单的基础规范，以供参考：

1、尺寸：

设计图是在什么尺寸下输出的：

2、间距：

在设计过程中，为保证页面整体的节奏感，我们会设置一些通用的基础尺寸来形成规范。比如页边距，最小边距等，然后以最小边距来等比变化其余的边距：

3、颜色：

每个产品都有自己的品牌色，品牌色是产品的第一印象色。为每个产品创建属于他自己的品牌色是至关重要的，比如医疗健康多用：蓝色、绿色。电商页多用：红色橙色，根据自己的品牌属性来制定，我这次举例的产品为短视频社交产品，品牌色为黄色：

4、字体：

字体的话多通用字体，苹果用苹方，安卓用思源。通常设定的规范为字体大小，比如主要标题，导航，提示性文字，正文等字号，可以按照属性去做基础划分，保持一致：

5、行间距：

很多人在做字体规范时候，容易忽略这块，其实字体的字间距、行间距也是需要去根据不同字体大小去做规范化处理，比如行间距一般为：字体大小*1.5倍。合理的行间距，会让用户阅读体验中感到舒适有呼吸感：

6、图标：

例如TAB栏上的图标，我们一般在切图中需要保持统一大小，一些导航上的功能图标也是：

7、按钮：

按钮在产品设计中，也需要保持统一的视觉规范，比如圆角大小，按钮的宽高比例等，按钮上的文字等。

通常情况下，我们在追求体验的同时，会做多按钮的状态：常态、点击中、置灰（不可点击）：

8、图片比例：

在不同的产品中，会有不同图片的展示，但是为了整个产品和规范和技术去开发，通常情况下，我们通常会做几个图片比例去做规范，然后去综合适配：

9、头像大小：

往往有的时候，在产品的各个页面层级中，用户头像的尺寸会出现多个尺寸，但是尽量保持统一的视觉元素，比如圆的，方的，我们也需要去相对整理头像尺寸，尽量不要出现太多：

10、导航栏：

11、基础：

包含弹窗、Toast提示、时间选择器等基础控件：

12、缺省页：

缺省页在产品中是至关重要的，好的缺省页设计可以降低用户的负面情绪。包含空状态、网络故障、加载失败等：

以上只是根据一些基础整理出来的，偏基础性规范。当然有些产品目前还在初期阶段，产品体量还不大的，可以根据现有公司的实际情况制定出的合适的规范，立在扁平快，让它能真正发挥作用才是好的。后期规范要随着产品的迭代不停优化规范文档，也要持续更新通知相关人员。

当然，在做完以上后，现实开发中中，还是会遇到一些各种问题，比如：

来针对性讲解下，遇到该怎么处理：

1、需求不明确：

这个页面属于什么形式，有什么状态等；术业有专攻，设计只能与技术沟通到页面的基础状态，详细的可以与产品沟通，这个产品会有专门的产品文档去描述。

2、需求资料有缺失：

比如蓝湖不能标注，所需要的切图没有找到。这个建议采用线上企业微信进行沟通，一般遇到这种情况可能是当初整理的时候会有一小部分遗漏了，这个线上沟通好设计会单独再给开发人员解决这个问题，毕竟有时候检查了还是会出一小部分bug，但是我们已经在尽量减少这种情况的出现了，希望开发人员也相对理解一下。

3、效果在周期范围内无法达成预期：

一般有这种问题，基本都是交互动效的的效果不太良好，建议严守截止日期，设计与研发一起思考如何在周期内将效果达到目前时间允许的最好状态。

4、需求变动。

需求的变动一般产品都会同设计与开发沟通好。设计图在修改完善后并确认无误后，及时通知相关开发人员，已传上蓝湖。

5、其余bug。

具体问题具体分析。

开发完成后，我们需要进行视觉走查，以下是关于视觉走查部分的处理：

总结：

以上就是我之前在团队中会遇到的问题给出的一部分解决办法。当然，当遇到具体问题时候还需要去具体分析。

希望能帮助到一部分小萌新解决日常沟通协作的问题。如果还有什么问题或者疑问也可以留言我，看到会给回复哒。