原文作者：Brad Frost
原文标题：Atomic Design
原文地址：https://atomicdesign.bradfrost.com/table-of-contents/
也可以在作者的GitHub上提出issues
说明：本文所提到的前端设计思想我的公司正有所使用，所以我想翻译学习一下，如有侵权，请联系我删除。另外，这也是我第一次翻译英文技术文章，如有错误，欢迎指正。第一篇文章主要讲讲故事背景，想要看和技术有关的内容可以直接进入第二篇。
Atomic Design（原子设计）
简介
我们的任务是要在更多场景下，更多不同尺寸的设备上，使用更多的浏览器给用户提供比以往更多功能的界面。这是一项艰巨的任务，所幸设计系统能够提供帮助。
原子设计详细说明了创建和维护健壮的设计系统的全部工作，这可以让你比以往更快的推出更高质量，一致性的UI。为了将我们的ui界面考虑得周到有层次体系，这本书为此介绍了一种专门的方法论来讨论有效模型库（译注：UI库？）的质量，并展示了用于转换团队设计和开发工作流程的技术。
前言（By Josh Clark and Dan Mall）
那是在2013年，我们和Brad Frost和Jennifer Brook挤在布鲁克林的阳光明媚的厨房桌子旁。我们四个人刚刚开始给TechCrunch做一个新网站，我们正在Jennifer的公寓中绘制线框，以应对响应式设计的新需求。Brad拔出笔记本说到：“我有一个新的想法。”
Brad的屏幕看起来像是爆炸了的网页。零碎的UI自由的浮动，不受统一设计或层次结构的束缚。它看起来像一堆来自网络车库的备件。
Brad咧着嘴露出疯狂的笑容并点头：“很好，不是吗？”我们三个人茫然地回望着。有人咳嗽。
然后，前端开发者Brad Frost开始像化学家一样说话。他讲到了原子，分子和组织，关于大型的设计如何能分解为较小的设计，甚至是重新组合成不同的大型设计。他没有去使一个完成的设计方法形象化，换句话说，他向我们展示了设计成分。我们认为这是一个观念上的转变，这种观念抛弃了将网站的设计构想成一个静态页面模板的集合的想法，转而将网站视为一个拥有适应能力的组件组成的动态的系统。在那种情况下，这是一种令人鼓舞的方式去达成这种响应式网站，以及所有的响应式项目。
Brad的想法就是原子设计，它改变了我们在这个惊人的多设备世界的工作方式。通过同时从大的方面（页面）和小的方面（原子）考虑界面，我们可以使我们的流程更高效：我们将更细致的思想细化到每一个元素；我们将提升用户体验养成习惯；关键地，我们开始工作得更快更合作化。原子设计是我们的强大动力。
在早期版本的TechCrunch网站重构中，有这么一个时候我们在讨论文章页应该是什么样子的，一个小时之内Brad就从他的组件库中拿出了一个完全响应式的版本。那时我们意识到了我们能够“行动”得有多快，使用这个灵巧的，模块化的（设计）是一种强有力的方案。
大约四年后，我们再也没有回头过（译注：一直坚持这条路？）。Brad继续在后来的项目中改进着他的技术和工具，包括了给美国娱乐周刊和时代杂志这样的公司制作的重量级网站。我们已经使用这些经验技术帮助内部产品团队更快更高效的制作网站，也为一些想集中设计和开发工作到国际办事处的组织开发了大型的设计系统，等等。
原子设计给予我们速度，创作的自由和灵活性。它改变了一切。我们认为它也能为你做同样的事情。
这本精彩的书解释了原子设计系统的思想体系，实践以及维护。这样做（译注：应该是指开源）正是Brad所描述的开朗，乐于助人的慷慨之举。
Brad对web和它的制作者有着无穷无尽的干劲和热情。多年以来，Brad一直在响应式设计技术的前言工作——他一路分享着他的一切。他的This Is Responsive网站是查找任何UX问题的响应解决方案的首选资源。他的博客和推特提要分享了他遇到的困难和解决方案。当设计者和开发者关注Brad Frost时，他们可以获得快速而密集的实践方法，对构建漂亮的弹性的网站的狂热见解。这本书物超所值。
通过这个机会，Brad将会敲开每一个开发者和设计者的大门来传递他要给大家的信息。我们可以惊讶的（和有点嫉妒的）看着这个回旋舞席卷全球，与六大洲的数百个团队和组织分享他的建议。（原子设计即将进入南极洲！）但即使是Brad Frost也不能面面俱到，我们很高兴他在本书中如此深入和幽默地详述了他的想法。
原子设计正席卷了这个世界，它改变了我们的设计实践，同时我们也很高兴它将为你的开发流程带来同样的创造性。
——Josh Clark和Dan Mall，Brad的频繁合作者和他最大的粉丝。
小结：从前言来看，这本书给人的感觉可能主要讲述的是关于网站的响应式设计（我的第一感觉是类似弹性盒模型或者组件+流式布局那样的），事实上后面也讲到了一些设计思想，不过更多的是如何进行组件化开发。其实可以推测出本文的行文时间应该在2016年前后，彼时前端界的三驾马车（react，angular，vue）已经初具规模，模块化和组件化的概念正在开始影响web开发，我也是在vue的组件化中应用了原子设计的思想。
下一章 【译】原子设计1——设计系统（节选）
译文目录在这里： //www.greatytc.com/nb/47456777
