没错！除了代码能力，前端开发还需要设计和创意
全文共2158字，预计学习时长4分钟
by阿芬亚·迪哈勒特 有创意的蓝先生开发机器人
前端开发是编程中特殊的一小部分。一名真正高效的前端工程师需要具备兼顾创造力和分析能力。
然而，视觉艺术的创造力和想象力是我们从上高中时就开始慢慢失去的技能。尽管前端开发人员整天都在处理代码，但无论愿意与否，他们仍然不时地需要依赖这些技能。毕竟，不是每家公司都能提供完整的线框图，或具备供多种设备使用的特定页面的模型。因此，前端开发人员常常需要填补视觉上的空白，有时还需执行设计来完成产品。
这种事可不少见。
即使已经清晰地规范地和直观地交付了所有内容，拥有设计知识也是前端开发工具包中一个必不可少的部分。
前端开发的本质
前端开发在技术上是一个模糊的领域，因为它是连接人与屏幕之外的代码的桥梁。它代表了公司，并为用户提供该公司的商品及服务。
当谈到前端开发时，我们通常只涉及到代码方面，而中心内容就是关于JavaScript、CSS、各种框架和库。然而，关于设计的讨论常常被搁置一旁。但是前端可不仅仅是代码。它是数字设计的物化及业务规则的表现形式，与用户的满意度密切相关。
而我们往往没有认识到这一点。前端是一个多学科领域，包括代码识别、设计知识和数字心理学等。无论角色委托和分离如何，许多前端开发人员都会接触到一些与视觉模式、颜色理论和排版相关的知识。
在哪些场合应用设计
图片来源：pexels.com/@rakicevic-nenad-233369
前端开发和设计之间的关系类似于后端开发和数据库模式体系结构之间的关系。开发人员的存在并不只是为了独立地编写代码。为了有效地执行任务，他们还需要联系其他相关领域，有时还需要向相关同行提供咨询服务。
作为一个前端开发人员，学习设计可以利用技术知识来生产至少一半的产品，而不需要额外的人力资源，而这正将是潜在雇主所期望的。学习设计，以及它如何影响用户和他们的选择，将赋予前端开发人员多样化的技能——而不只是知道如何有效地编码。
设计模式也会物化为相应的代码模式。当开发人员能够识别这些模式时，其可以生成系统良好的CSS，并且易于使用没有过度嵌套的HTML进行扩展。除此之外，理解设计意味着可以更少地依赖于引导库和解决方案，来创造符合良好数字美学期望的东西。
探索设计的魅力
数字设计的特点不仅仅是色彩和排版。以下列出了一些可供探索的领域，以增加及升级前端开发人员的前端开发技能和知识工具集。
数字构图设计
响应性和流动性开发是每个前端开发人员都应知应会的。然而，归根结底，它实际上是关于组合。响应性和流动性的开发仅仅是将组合转换为CSS代码的数学翻译。
了解以下内容：
· 布局设计
· 视觉层次理论
· 图形设计中的视觉衔接
· 三分法
· 网格对齐设计
数字屏幕的排版
排版很重要。界面通过文字与图像来向用户传达其中的意义所在。尽管代码的设置相同，但不同的浏览器和屏幕会以不同的方式呈现相同的字体。选择你喜欢的两种字体 - 衬线字体和无衬线字体 - 并一直使用它们，直到你完全把它们搞清楚为止。这将使你对其他字体有一个初步的了解。
了解以下内容：
· 排版中的微调字距与统一缩放字距
· 台式机、平板电脑和移动设备的有效字体大小
· 数字的字体粗细
· 设备的最佳行长和行高
色彩与审美直觉
图片来源：pexels.com/@mccutcheon
Instagram之所以能成为现在的大热点，是因为它了解市场，利用了人们对美美的自拍的需求。虽然人们不能在前端界面上设置一个过滤器，但是人们识别美丽的配色方案的能力、及创造出美观的构图的能力随着时间发展起来了。
直觉就是一套内在化的规则和期望，其能够立即区分出设计的好坏——而要拥有这种能力，必须大量接触数字设计，并模仿已有的模式，直到能够创造出自己的模式为止。这是培养色彩和美学直觉的最简单最快的方法。有效的创造力是指把不同元素组合在一起，从而形成一个美观又独特的解决方案。
了解以下内容：
· Awwwards设计网站，Dribbble设计网站，Behance设计网站
· 数字调色板
· 奥多比卓越设计大奖
· 网络和移动设备中的常见设计模式
用户体验建模
设计不是静态的，而是一种通过颜色、布局、图像和排版的表现来传递的经验。比如，在数字空间中，这就包括交互式响应。
通过设计经验有效准确地模拟用户体验可以帮助前端开发人员确定未来的代码模式。这反过来也可以帮助减少一些可能妨碍整体用户体验的潜在错误。
如果用户体验良好，则会进行转换。但事情未按计划进行时，用户体验就会下降。这时，即使是最忠诚的客户也会离开，因为他们会认为这个过程太困难了。而这不仅仅是关乎点击数的问题，而是解决用户遇到的突发问题的能力问题。如果不具备这种能力，用户体验就会降低。
了解以下内容：
· 用户体验价值主张
· 启发式评估流程
· 产品路线图设计
· 用户体验中的可用性和实用性
· 热图集成
总结
每个人都有潜力发展设计和审美能力。如果在过程中产生疑问的话，那么就跟随网络潮流，并尽可能地忽略其他干扰内容，只专注于你想要实现的目标。
未经专业训练的人员在不专注的情况下通常只会做出匆忙的设计。如果前端开发人员有能力对此进行改进的话，那么这种技能就是一项额外且非常有市场的优势，尤其当在较小的公司里或是初创部门里时。毕竟，并非每家公司都有着高预算，并且拥有设计知识来帮助你成为前端界面的专家的。
学习设计有助于沟通交流及完成工作，使人们与常驻数字设计师的沟通更顺畅，并使彼此的需求，问题和要求更易于理解。
留言 点赞 发个朋友圈
我们一起分享AI学习与发展的干货
编译组：沈田、夏伊凡
相关链接：
https://medium.com/better-programming/why-front-end-developers-need-to-diversify-into-design-e51e72eb7136
如需转载，请后台留言，遵守转载规范
推荐文章阅读
ACL2018论文集50篇解读
EMNLP2017论文集28篇论文解读
2018年AI三大顶会中国学术成果全链接
ACL2017 论文集：34篇解读干货全在这里
10篇AAAI2017经典论文回顾
长按识别二维码可添加关注
读芯君爱你