您可能已经听说过草图库功能（自v4.7起可用）的实用性。 目前，许多大小的设计团队都在使用它们来加快设计迭代过程。 这也是在组织内部建立“单一事实来源”设计系统的初始过程的一部分。
每个团队都有自己喜欢的组织样式库的偏好，在这篇文章中，我将分享我们的设计团队的工作方式。
步骤1：决定要包括的内容
与您的团队一起，确定要包括在Sketch库中的初始构建块的列表。 我们遵循原子设计的规则，因为它意义非凡（感谢Brad Frost👍）。 这里的总体思路是，您首先要创建最小的元素（原子），然后再创建更大的元素（分子）中使用这些元素。 以及如何将它们组合成一个更大的群体（有机体），依此类推（模板）。
步骤2：添加您的第一个原子-颜色🌈
打开一个新的Sketch文件并将其另存为库。 让我们首先创建调色板。 绘制矩形，并用您的主要和次要品牌颜色，黑色和灰色，系统验证颜色等填充它们。记住要添加颜色代码以便于参考，毕竟这是样式指南！
💡 专业提示 。 为了使该样式指南对将来使用它的设计师更有帮助，您可能还希望提供有关如何使用每个元素的说明和最佳实践。
选择每个矩形填充并在右侧面板上为其创建共享样式。 您可以在语义上命名每种颜色，也可以给每个阴影指定一个数字，然后用斜杠“ / ”对它们进行分类。 例如， Palette / primary / darkblue 。 稍后创建其他元素时，拥有共享的样式库对于快速更改颜色非常有用。 这就是我共享的颜色样式。 （单击共享样式>组织共享样式 ）
步骤3：制作彩色元素并将其转换为符号
确定接下来要使用颜色的东西。对于我们来说，我们决定首先创建按钮。 因此，我创建了一个内部带有白色文本的矩形按钮，然后使用共享样式填充了按钮的颜色。 选择按钮背景和文本，然后将其转换为名为“ UI / Button / Primary”的符号。 现在，让我们先坚持基本的矩形按钮。 如果您想要圆角，我们稍后会做！
步骤4：在符号内创建符号
现在您的按钮是一个符号，双击它可以进入Sketch文件中的Symbols页面。 选择矩形填充并将其转换为名为“ Color / Green01”的符号。 通过将按钮中的图层转换为符号，可以创建一个稍后可以自定义的变量。 将此符号层重命名为“颜色”。 这是用于命名按钮颜色下拉菜单的标签。
现在，双击颜色层进入“ Color / Green01”符号。 复制它，并将其更改为调色板中的另一种颜色，根据您之前给它的名称（即’Color / Green02’）重命名该符号。 对希望按钮可用的所有颜色执行此操作。
步骤5：尝试一下！
现在返回页面并尝试插入刚刚创建的按钮。 插入>符号> UI>按钮/主要
您创建的按钮现在可以自定义。 在右侧面板上，您可以在此按钮上更改标签文本，以及使用下拉菜单更改颜色。 好极了！ 🙌
步骤6：向您的元素添加更多可自定义的属性
如前所述，如果您想要更改按钮形状的选项（例如将其设置为圆角），请双击该按钮以再次返回到按钮符号。 绘制一个与按钮宽度和高度相同的矩形（将此层命名为“ Shape”），并添加4px的边框半径。 将该层转换为蒙版，然后将该蒙版层转换为……您猜对了，符号。 将符号命名为“ _resources / Shape / 4px-radius”。
现在，从此按钮符号中删除“颜色”层。 是的，你看的没错。 因为我们要将颜色嵌套在Shapes符号中。 双击您的形状符号以转到它。 将您的颜色符号插入其上，并确保颜色符号层名为“颜色”。
像颜色一样，您可以复制形状符号以制作其他按钮形状，例如10px半径或圆形。 只要记住相应地命名符号即可。
再次返回到样式指南页面上的按钮，然后测试形状。 漂亮啊？
您可以继续扩展按钮选项，例如轮廓选项，带有图标的按钮。 或者，您可以开始在样式指南中添加其他元素，例如版式，表单输入，表格等。
基本思路：
1）创建组件并将其变成符号。
2）确定要自定义组件的哪一层。 并将这些图层转换为符号。
3）复制符号及其各自的选项。
步骤7：在其他Sketch文件中使用此库。
对前几组组件满意后，请与团队成员一起试用。 您可以在公用服务器或Dropbox等文件共享服务中共享库草图文件。 确保在共享位置上共享文件，只要对该位置进行了新的更改即可。
要将您的草图库添加到团队成员正在处理的单独的草图文件中，请转到“首选项…>库” ，然后单击+在共享文件夹中找到共享的库文件。
现在，您可以开始使用此Sketch文件中共享库中的元素。 只需转到插入并找到所需的库和符号。 十分简单。
每当对库进行更新时，使用此库的所有文件都会收到紫色通知（在右上角）。 单击它会通知您所做的更改，并显示如果您决定提取更新将对Sketch文件造成的影响。
第8步：维护您的Sketch库，使其保持活动状态！
关于图书馆的事情是，它很容易过时。 您的团队必须同意定期维护此库文件，以确保它仍然有用。 讨论需要更新，添加或修复的内容。 并且在每个“发布”之前，进行测试以确保它不会破坏任何现有组件。 否则，事情可能会变得非常混乱。 😱
在我们的团队中，我们在Sketch库文件中有一个单独的页面，称为“ Changelog”，在其中记录了文件中的所有更新。 有点像产品发行说明，因此我们可以跟踪谁更新了文件中的内容。
我们也正在考虑使用版本控制工具（例如Mac的Abstract，Kactus或Folio）摆脱这项手动任务的想法。
