设计师和工程师被视为完全的相反的两种类型。设计师被描绘成敏感的创意人物，而工程师则被描绘成冷冷的执行人员。
然而，作为一名前软件工程师转向产品设计师，我可以说这些对立面可以在工作场所有效地协同工作。只要更多彼此了解对方，设计师与工程师的关系就可以大大改善。这里有五个设计师在与工程师一起工作时遵循的一般准则，其次是工程师的另外五个准则。
5条适用于设计师的准则:
1) 避免自定义样式
实际上，所有前端工程团队都使用某种类型的库或CSS框架来进行代码编写。这些库通常包含常用样式，例如预定义的边距，颜色和其他类，工程师可以使用这些样式来降低开发成本并且一致化。 这意味着，如果你再自定义边距，字体大小或组件中改变，工程师必须从头开始编写自定义CSS以覆盖基本样式。这也许开始很好，但它很快就变得乏味。将这些自定义样式保存在特殊场合或绝对必要时。毕竟，框架内的设计为我们简化了许多决策，这往往是件好事。
2) 产品初期与工程师一起讨论
L说实在的，除非你是为早期阶段的初创公司工作，或者你是工程副总裁，否则工程师没有太多的产品说明。设定产品愿景通常取决于高管，产品经理和产品设计师。但是，即使工程师没有得到太多的意见，他们仍然可以感觉到他们是这样做的。当你与产品经理讨论时，请与工程师一起讨论。另外，请与您的工程团队进行设计初期的需求评审。向他们解释你做设计的思路，并倾听他们的意见。如果工程师觉得他们对设计过程有贡献，他们在开发时会自然而然地加倍小心。
3) 倾听工程师的反馈
也许你可能不信，工程师经常是相当不错的设计师。尤其是关于ux，我曾与许多具有卓越设计感的工程师合作。这些工程师希望听到他们的意见，他们的反馈意见可能非常有价值并且经常说到点子上。当你信任的工程师给你反馈你的设计时，认真聆听。如果可以，拿出笔记本并记下他们的想法表示你正在倾听。你不必使用每个想法，但给予他们应有的尊重，一些建议必然会坚持下去。
当然，并非所有工程师的设计反馈都很好。只要辩证地看，并以开放的态度接近它。你会经常学到一些东西，每个人都喜欢被倾听。
4) 理解基础的 HTML/CSS/JS
与我一起工作的最好的设计师之一在我在salesforceiq担任软件工程师时，可以直接进入网络检查员，并直接在控制台中使用html / css快速创建原型。作为一名工程师，遇到懂技术的设计师是件很让人高兴的事，并且再考虑限制条件的情况下进行设计。身为设计师也不需要知道完整的前端技术，但是了解一些基础的知识会让自己的路更好走。获得最亲密同伴的尊重 - 学习一些代码。
5) 批量小修复
心流 是工程师工作时最高的一种状态 - 这很大程度上意味着“在自己的境界里”。工程师需要大块不间断的时间来实现心流。这就是为什么最好在一天的开始或结束时安排会议，不断的中断工作对工程师而言很糟糕。这意味着你今天早上在用深色的蓝色按钮洗澡的想法可以等待。设计是一个反复的过程，毫无疑问将会对产品进行持续的改变。然而，在向工程师询问问题之前，把小的问题收集起来。例如，在接近工程师进行修改之前，先设置五个较小更改的基准。总之没有比总是不断打断工程师节奏更糟糕的事了。
5条工程师的基本原则
1) 了解用例
作为一名工程师，您可以在触手可及的情况下创建大量功能，并且可以直接进入代码。然而，拥有巨大权力的责任重大。退后一步，了解您正在构建的产品或功能的“原因”。去谈谈你的产品经理和你的产品设计师。理解正在做的功能的原因，以及为什么这么设计。没有这种了解，你只是在屏幕周围推动像素。或者，通过对产品的了解，您可以考虑实施中的所有不同用例和边缘案例，并将您的代码提升到下一个级别。
2) 首先实施ux
在敏捷的环境中，设计会根据用户的使用体验和反馈不断迭代。昨天专门做的具有五像素圆角和阴影的蓝色按钮而现在是一个扁平不带阴影的设计和直角的绿色按钮。但是，不要灰心：只要接受这是产品开发过程的一部分。首先实现设计的流程，功能和总体布局。让整体感觉不错，但不要为每一像素而抓狂。一旦设计经历了更多迭代的测试并且版本已经稳定下来，就逐渐融入到视觉元素中。
3) 退回
记得上一次你的设计师要求你实现一个改变颜色的自定义组件，并且每隔一分钟做一次旋转？是的，不要这样做。设计是一双面剑。不要害怕推回技术限制和限制。大多数情况下，即使是最好的设计师也不会有你的技术积累或对系统的理解。然而，不要只是推回来，说“这不能做”，总是提供一个替代解决方案。试试，“这个解决方案实施起来成本很大，我建议......”。请记住，大部分事情可以用我们今天所拥有的工具完成，但这并不意味着一切都应该完成。作为工程师的工作就是帮助设计人员达到解决问题的最佳，最具成本效益的解决方案。
4) 经常沟通
沟通真的是这篇文章的主题。当您正在实现设计时，请务必始终向设计师展示您的进度。设计师们喜欢看到他们的作品得以真正的实现，这对每个人来说都是一件有趣的事情。让设计师掌握最新的进展情况将有助于确保您的代码实现符合预期，并且未出现任何意外。这也是一个很好的机会向设计师询问关于设计或推进任务。
5) 填补差距
在实现设计方案时，总会有一些地方需要您使用自己的认为不错的方案来填补。你实现的设计看起来不会像交给你的设计 - 这只是底线。当您意识到某些屏幕上需要更大的边距时，或者实际应用中出现特定的颜色时，会出现积分。不要每次都去问设计师一个问题。把你的设计师的责任放在自己身上，然后自己做一些小小的调整。你会得到自己想要的。
但也不要太过了，用你自己的判断力与你的设计师进行最大程度沟通，
