我们的用户非常喜欢 Zeplin 的样式指南，因为它为设计系统带来了清晰的结构。然而，团队，尤其是那些管理复杂设计系统的团队，却遇到了一些挑战——组件组织混乱、导航繁琐、文档匮乏。

在与众多团队沟通后，我们意识到问题不仅仅在于可用性。我们构建样式指南的现有架构无法满足他们的需求，例如更完善的文档和公开分享。因此，我们倾听他们的意见，深入研究痛点，并开始重构样式指南。

今天，我们推出 Styleguides 的重大更新，带来更完善的组织结构、更快速的性能和更完善的结构。这些改进不仅提升了 Styleguides 的易用性，也为文档和公开共享等更强大的功能奠定了基础。

有哪些新内容？

组件专用页面

以前，样式指南中的所有组件都列在一个页面中。为了便于组织，你可以创建部分，但这非常有限，而且随着组件数量的增加，页面很快就会变得非常拥挤。

现在，所有组件部分都有其专用页面：

此外，您还可以创建页面！假设您有多个类似按钮的组件（“按钮”、“图标按钮”、“拆分按钮”等等），您可以创建一个名为“按钮”的页面，并将它们全部移动到那里。

以下是所有内容的实现方式：

请注意，任何不属于任何部分或页面的组件都会被收集到一个我们称之为“独立组件”的页面中。如果您愿意，您可以选择其中的任何组件，并基于它们创建一个新页面。

图标页面

由于图标在设计工具中也被视为组件，它们很容易被淹没在冗长的其他组件列表中。在与大家沟通并参考了大量公共设计系统后，我们意识到图标通常被赋予了更高的优先级。因此，我们采取了以下措施：图标现在拥有一个专门的页面——更易于浏览、管理和维护。

要将图标组件移动到新的图标页面，请转到组件页面并从菜单中选择“将页面移动到图标”。

基础和改进的“关于”页面

新基础部分

为了更好地组织，颜色、间距、排版以及现在的图标（！）现在都归入我们称为“基础”的单个部分下。

在“关于”页面中，您现在可以为设计库添加 Markdown 注释，从而更轻松地传达设计规范。这是我们迈向后续更完善的文档功能的第一步！

优点：更好的结构，更好的性能

通过重构样式指南，我们也使其运行速度更快。由于所有组件不再挤在一个页面上，性能得到了显著提升——尤其是对于管理数百个组件的团队而言。 🐇

我该如何开始？

我已经有样式指南了

如果您是现有的样式指南用户，您的组件部分现在将列在不同的页面中，并且页面将自动按字母顺序排序 - 您已经要求这样做一段时间了！

您可以采取以下几个步骤来进一步组织它：

• 将图标组件移至图标页面
• 为类似的组件（例如按钮和输入）创建页面，并将它们一起列出

我想创建我的第一个风格指南

如果您是 Figma 用户，您可以一键将您的 Figma 库与 Zeplin 样式指南同步 - Zeplin 将自动导入您的整个组件库。

🔗了解有关 Styleguide Sync 的更多信息

您还可以观看我们可爱的 Berk 对我们今天引入的所有更改进行的快速演示：

如果您是 Sketch 或 Adob​​e XD 用户，与导出画板类似，您可以将符号/组件导出到样式指南。导出后，它们将列在“单个组件”页面下。然后，您可以开始创建页面和部分来组织它们。

🔗 了解有关从 Sketch 导出组件的更多信息

🔗 了解有关从 Adob​​e XD 导出组件的更多信息

下一步是什么？

我们对样式指南充满期待，并希望不断改进——这是我们样式指南系列改进中的第一个版本。有了这个新架构，我们终于可以在此基础上进行构建了——敬请期待更完善的文档、公开共享等更新。

现在就登录 Zeppelin 查看新的风格指南吧！告诉我们您的想法——我们洗耳恭听。 👂