朋友问了个有趣的问题：怎样的前端工程师算好沟通？或反过来问，好沟通的设计师是怎样？套用另一篇文章什麽是计算思维提到的方法「问题拆解」，看看会发生什么。
设计师＋好沟通的＋前端工程师＝团队
前端工程师＋好沟通的＋设计师＝团队
A +好沟通的+ B =团队
你+喜欢的+人=一起工作的人
我喜欢跟怎样的人一起工作？
会得到一个新问题：我喜欢跟什么人一起工作？
PO, Developer, Editor, UI/UX, PM
团队的成员有？
进入主题前，我们先来看看完成一个网站需要哪些人？
项目负责人：沟通专案需求、协调团队工作及管理专案时程；
系统架构师：画出网站架构蓝图，决定网站什么地方该放什么；
后端工程师：前端工程师与资料库的连接桥梁；
前端工程师：将设计画面转换成程序语言；
设计师：将项目需求从文字变成美丽的画面。
这是最基本且合理的编组，为什么要特别提到且合理呢？因为两三个人包办全部工作的机会并不少见。
全栈、后端、前端傻傻分不清楚
早期没有前端工程师这个职称，通常是后端工程师包办全部开发工作；近年来数字装置种类越来越多、交互行为变得越来越复杂、设计的要求也越来越高，一个人包办所有开发工作的时代已经落伍了，取而代之的是更专业的分工，也因此诞生了前端工程师这个新职业。
学校不量产前端工程师，市场上看到的前端工程师，主要的取得方式有下面几种，第一种类型是后端工程师转前端工程师，又称为全栈工程师，我也属于这种；第二种类型是目前的主流，直接学习前端开发语言的原生前端工程师，特别强调原生是因为通常这样的前端工程师不具备后端开发能力；第三种是近几年急起直追的设计师转前端工程师，一般会称为前端设计师或UI工程师（UI : user interface 用户介面设计）。想了解更多可以阅读我的另一篇文章「不就是架个网站」。
前端工程师跟视觉设计师的差别只是使用的工具不同，一个是用编程，一个是用设计工具，最后完成的作品都叫设计。
前端工程师跟设计师其实是性质非常接近的工作，最大的差别是使用的工具不同；前端工程师用程序来实现设计师的作品，依赖的是挑战设计难度的想像力。设计师则用设计软件来完成作品，需要的是无中生有的创造力。深入观察这两个工作，会发现需要的能力几乎是相同的，只是需要的能力用在解决问题时的不同时间点。
我们遇到问题了
白眼翻到天边去
对设计师说：
只是换个颜色应该不难吧？
这底色有点暗，能换成亮一点的黑色吗？
差 2px 不行吗？
Logo 太小，可以放大一点吗？
可以模仿那个网站做一个类似的吗？
我想要丰富带点洒脱的感觉……
这可以放一张大一点的照片吗？
我觉看起来怪怪的，说不上来哪有问题，你觉得呢？
改几个字要三小时！
麻烦把这些小字改成粗体，这样看起来比较明显。
对工程师说：
这很容易吧，只是换个位置？
应该不难吧，明天能给到我吧？
网站要向下相容到 ie6！
客户又改需求了！
你先把功能做出来，我们再来评估。
只是复制贴上怎么还要这么贵？
用 css 改一下就改好了啊。
为什么字体不是 18.5 px ?
copyright 字体太大了，我给的是 8px 啊！
老板说明天就要！
为什么设计师、工程师听到这些话会白眼翻到天边去？因为用错了沟通方式。
善于沟通的设计师
设计是为了解决问题而存在，商业需要的是设计师，不是艺术家。
艺术家：通常是有比较高的成就或拥有独特的个人风格，并且具备一定美学素养的人。
不在意个人风格的设计师不可能成为好设计师，但设计跟商业扯上关系时，有时得先抛开个人风格；项目都有各种限制，时间很赶、经费不高或人力不足等问题，很多时候必须作出妥协，不是要设计师放弃理念，而是要在残酷的现实中找出一个平衡点。
设计在发展到极致时可以成为艺术，但先要能解决问题，然后才是追求个人风格。曾经合作过的优秀设计师都具备这样的特色，能深入理解问题、善于沟通、接受不同的观点，看看后面这几个例子。
潘潘（用户体验设计师）：为什么按钮要用红色？
小白（设计师）：为了配合整体设计，这里用红色按钮比较适合。
潘潘：可是红色通常在警告时使用，换个颜色会不会好点。
小白：那只保留红色框行吗？还是换成半透明？
潘潘：换红色框其它按钮是不是要跟着调整？时间来得及吗？
小白：没问题，只要提供样式给工程师，一次就能搞定所有按钮。
阿鲁（前端工程师）：这样的动态太复杂，时间上可能会来不及，能不能换个表现方式？
小白：我希望透过滚动来表现时间感，除了滚动还有其他方式吗？
阿鲁：因为滚动会跟页面上的部份区块冲突，需要较多开发及测试时间，所以能不能换个方式。
小白：那换成一次卷动一页呢？我还是希望能保持卷动来呈现时间概念。
阿鲁：好吧，我先试试用卷页式，时间许可再尝试滚动式。 小白：太好了，非常感谢你，如果还是不行我们再想想其他方法。
阿鲁：设计稿应该在上周就完成了，为什么今天还没收到？
小白：因为上周有做了些小调整，多加了三天。
阿鲁：多三天的时间会影响到开发时程，这样会 Delay。
小白：已经跟项目负责人确认过了，设计时间延后影响到开发，上线时间会往后调整。（想法是好的，但可能性几乎是零）
善于沟通的工程师
计算机屏幕上眼睛看得到的都属于前端工程师
前端工程师：拥有前端技能（即HTML, Javascript和CSS）以及专业设计（视觉设计和交互设计）技能。
我对前端工程师的要求很简单，百分之百实现设计师的想法，不管是设计风格、动态或交互。
有句话是这样说的，用户永远是对的；其实这句话很有问题的，很多时候用户会因为无知做出错误的判断，但在这我们先不谈防呆，那是另一个值得讨论的议题。设计师也会犯相同的错，当设计师因为不了解技术限制时也会做出不合理的设计，比如前面提到的18.5px，这时就需要良好的沟通能力了，看看下面几个例子。
小白(设计师)：为什么紫色看起来跟我的设计不一样？
阿鲁(前端工程师)：这个紫色会有问题，能不能换其他颜色；
小白：紫色是客户的代表色，一定不能换；
阿鲁：一定要用也不是不行，只是它不属于网页安全色，在不同浏览器会有些微的色差，如果能接受，那就没问题；
小白：怎么会这样！
阿鲁：不同品牌的浏览器对颜色的定义是不同的，所以有些颜色会出现这样的问题，先跟你说，以免客户问起来不知道如何回答。
小白：为什么这个动态需要两个礼拜？
阿鲁：因为没有现成的套件能用；
小白：什么是现成的套件？
阿鲁：网页上的动态如果是很常被使用的，就会有人把它写成套件，这样其他人在开发时就能直接拿来用，不需要花很多时间重新开发；
小白：那没有怎么办？
阿鲁：自己开发啊，因为没有人写过，所以需要花时间研究跟测试，预估最快要两周，也可能需要更长的时间。
小白：为什么动态跟渐层都不见了？
阿鲁：哦，我来不及跟你讨论，老板说这礼拜就要先上线；
小白：就算这样也不能改我的设计啊； 阿鲁：嗯，我也觉得这样不对，少了看起来不太对，但全部完成要到下周才能上线，这样会来不及。所以我先做一个完整页面，这礼拜上线前应该来得及把渐层加上去，至于动态就没办法了，少了动态确实差满多的，我们先上线一个内容完整版，下周会再把动态补上，你觉得如何？
很多时候只是沟通的方式错了
沟通的过程主要是资讯发送者把思想内的资讯内容以可交换或共同认可的表示方式编码，以某个渠道来传递。资讯接收者获得资讯后，便进行解码，转换成内在的资讯。
可交换或共同认可的表示方式这段话是沟通问题的根源；说话，其实就是一种编码过程，我们的想法经过大脑思考、整理、归纳后转换成文字（编码），然后透过嘴巴输出，听的人由耳朵输入，经过大脑还原（解码）成能理解的文字，这就是沟通过程。那为什么每个人用的方法都一样，却还是沟通不良？问题就出在编码方式不同。
设计师用最新型的彩色编码器，工程师用的是最高档的黑白编码器，你觉得能沟的通吗？当然不能！但编码方式能说换就换吗？很难，非常难，改变对任何人来说都不是件容易的事，除非认真想让自己变的更好，否则几乎是不可能的事；下面提供几个让沟通变得更容易的方法。
把你变成我们
别傻了，对事不对人是礼貌性的谎言，⌈人⌋ 跟⌈事⌋ 是绑在一起，不可能分开的，相信对事不对人就是你太年轻了；好比我心里想的是：你这个傻蛋，却打出你太年轻这几个字，因为我们都太习惯用好听话包裹真实的想法。
小白：我觉得这样的设计没抓到客户要的感觉，客户可能不会买单，可是，你不要误会喔，我一直都很喜欢你的设计，只是这样的风格不太对。
是不是有点熟悉？对事不对人，那这个客户不买单的设计是谁做的？很多时候我们只是不敢直接面对问题，因为对事容易对人难，所以绕一圈说对事不对人，说穿了就是不想得罪人，那怎么办？有没有什么办法，其实只要换个角度面对问题，结果就会完全不同。
先要站在一起。丢掉你、我，他，开始用我们，例如：让我们一起完成最好的作品，把这句话当成前提，其他问题就不再是问题了，因为有了共同目标，问题就不再是你的设计有问题或我的程式没写好，而是我们的设计该怎么做，程式可以如何完成。当你将工作变成我们的工作时，很多争执都会消失于无形。
不懂可以问
在工作时最怕遇到的就是不懂却不问，我想是教育造成的问题。很多人都不爱问问题，以前在上编程课时就发现有这现象，问学生有没有问题？台下像被按下静音键，接着让大家试着写写看，全卡关；最近教小学生也发现同样的问题，原来发问能力在小学时期就坏掉了。
设计师的每个设计都有一套脉络跟想法的，有时为了一个背景色的选择就要花几小时甚至几天的时间跟客户沟通确认、做各种探索、尝试。当你用无知的语气说：这颜色太暗，能不能换亮一点的颜色时？你觉得会得到什么答案？
工程师已经花了一个礼拜的时间，上网找了一堆资料，跟其它工程师讨论，一次又一次的改写源码，测试，好不容易才完成。当你用无知的语气说：这应该不难吧，只是让页面自动往下卷动？你觉得会得到什么答案？
很多时候因为我们的无知，一脚就踩在雷上，能不引爆吗？别让无知毁掉所有的努力，不懂可以问：为什么会选择这个颜色？有什么特别的想法吗？为什么这样的卷动方式很困难？跟一般卷动的有什么不同？当你真心想知道为什么，多数人会回应你的用心的，至于那些懒得回答你的就踩爆他吧。
让专业的来
在专案进行前都会先跟团队沟通一个基本原则，尊重专业；遇到问题时团队先确认问题类型，是设计的问题、程式的、客户的、还是规划出问题，不管问题出在哪个环节，每个成员都会有自己的想法跟见解，但最后做决定的会是这领域的专家，也就是设计问题设计师必须作最后判断，开发问题则由工程师来做决定，时间管理问题就是项目负责人的工作了。
当专业受到挑战时，怎么心平气和的沟通？
PM：为什么变这么丑？
小白：因为老板觉得绿色不好看，希望能换成蓝色的。
PM：这应该很简单，明天能上线吧。
阿鲁：靠！光套版就要一天，你想要多快？
小白：为什么没用我设计的颜色？
阿鲁：我觉得那颜色不好看，所以做了一点调整。
是不是很熟悉，背后不知道偷骂了多少次，那个 XXX 是不是傻逼；最后，工程师挨骂了，设计师离职了，项目 Delay 了。
好的团队从尊重每个成员开始，在面对问题时我们可以有不同的观点，可以分享自己的想法，可以透过进行讨论取得更好的答案，但现实不会总是如此，当问题无法取得共识时，请先想想，谁是这领域的专家，将最后决定权交给他，他才是最适合做决定的；提醒你，决策出问题时会负起责任的不是你，除非你想跟老板说：都是我的错，是我说要改的。
不要停止学习
学习用团队的角度思考；专案成功不是一个人能做到的，是大家一起努力换来的。好的计划不能缺少设计师，好的设计没有工程师也只是美丽的画面，再好的技术少了设计师是什么都做不出来的。一起做、一起想、一起挨骂、一起偷懒最后还要一起成长，这样的团队还能有什么沟通问题？
学习对方的语言，设计师除了设计，学点编程也是不错的，相信我，你会打开另一扇窗，说不定你会爱上编程。工程师除了编程也可以多多接触设计啊，不能老是被当成只买格子衬衫的码农，相信我，学会设计会更受欢迎。至于项目经理就都学吧，谁叫你全都要管？哈哈哈。建议大家多学点，不用学到能转行的程度，堪用就行了。举我喜欢的 snowboard 为例，只要能平安的从山顶滑下来，管你用什么方法。
学习相信成员的专业能力，相信你的伙伴。少了信任的团队是不可能做出好作品的。我的团队有设计师、工程师、研究员及用户体验设计师，在工作时其实没有很明确的区分，工程师会谈设计，设计师会讨论技术问题，研究员会提出设计观察，每个人都有自己的工作该完成，也会在同伴遇到困难时提出建议，很多时候无厘头的想法也能迸出精彩的火花。
如果上面说的都没用
整理好你的作品，换工作吧。（可以参考我的下篇文章）
写这篇文章时我也一直自问，这些东西有用吗？真的是这样吗？一定有不少人有相同的疑问。其实，沟通问题很多时候是出在组织或企业文化上，组织文化会影响每一个成员，如果企业本身有问题，个人再怎么努力也是白搭。
我待过的公司都是扁平化的组织型态，不会特别强调上下关系，需要面对的只有人跟人之间的沟通问题。大部分传统企业就不是这样了，需要面对的有主管、主管的主管、老板或讨厌的客户，这时上面提到的方法就不一定管用了，毕竟人是最难处理的问题，但也不是完全没用啦，只是需要学的东西更多，短时间是很难改变的，即使革命成功，结果也不一定是你想要的，所以，换个新环境也许是更好的选择。
总算写完了，花了快一个月的时间；文中提到的工作说明不是所有人都是这样的，有精通设计的工程师，也有很会编程的设计师，还有非常专业的项目经理，我只是将工作时看到、经历过的写下来跟大家分享。文中提到的想法有任何疑问，欢迎提出来讨论。最后谢谢你的时间，希望这篇文章有帮助到你。
网友评论