我们最近推出了 叠层，这是一项强大的功能，用于在 Sketch 中创建动态 原型。今天，我们将深入探讨使用叠层的好处，并介绍一些用例来激发您的创意。
让它变得醒目！
但首先…
叠层是什么？
叠层是一个总称，用于表示出现在现有 UI 上的任何类型的交互或消息。这些可以是任何东西，从 iOS 风格的共享表单到弹出式警报，甚至是可以引起注意的交互式阻止模式。
在 Sketch 中，叠层 是一种 画板 类型，当您预览原型时，它会出现在现有画板的顶部。
在 Sketch 中使用叠层的好处
叠层长期以来一直是日常设计的一部分，那么在 Sketch 中使用它们有什么特别之处呢？好吧，我们确实已经充分考虑了 此功能的 用户体验。叠层是一项很棒的功能，但当您使用大量模态和交互时，设计和保持其组织性可能会非常复杂。我们不想仅仅引入另一个笨拙的叠层工具，然后寄希望于一切顺利。相反，我们坐下来思考了常见的陷阱以及如何解决它们。
让我们仔细看看这些解决方案。
创建了一个叠层，就创建了所有叠层
使用 Sketch，叠层始终是叠层。姑娘，什么？别担心，这不是什么超现实主义的单口喜剧！我们的意思是，您不必每次都指定某物是叠层。相反，您可以将任何画板变成叠层，并一次性定义所需的设置——这包括位置、视觉处理和交互。并且，由于您选择的任何设置都将保留在该画板上，因此您无需每次链接到该叠层时都再次输入它们。
这是一个示例
创建叠层后，画板将保存您上次选择的设置。
将它们固定到位——或者不固定
无缝的叠层设计完全是关于定位的，因此我们希望确保您能够将它们准确地放置在您想要的位置，而不会将此过程变成额外的工作。使用 Sketch，您可以通过将叠层相对于图层或屏幕对齐来轻松保持叠层的一致性。您可以使用我们的空间控件在画布和检查器中直接对其进行操作。
这是如何工作的？当将叠层与屏幕对齐时，您将有九个锚点可供选择。但这还不是全部！您可以通过使用偏移量进一步自定义位置，这非常适合设置边距。
相对于图层对齐对于屏幕特定区域的小型弹出窗口或模态非常有用。例如，一个气泡或提示。当您选择相对于图层对齐时，您可以使用与之前相同的控件，但它们会忽略屏幕的其余部分，而是专注于所选的触发图层。
这是一个示例
在这里，我们已将叠层对齐到爱心和书签图层的正上方，以获得整洁的外观。您可以在我们的 演示文档 中试用并检查所有叠层设置。
在交互级别上使用它
您知道我们上面讨论的所有这些很棒的功能吗？您可以在交互级别上执行相同的操作。因此，无需仅仅为了添加不同的放置位置而复制叠层，您可以编辑相同的叠层并重复使用它。您可以专门针对特定交互自定义从对齐到偏移量再到锚点的一切。
这是一个示例
在这里，我们使用相同的“菜单”叠层，但位置不同。查看我们的 演示文档，亲自了解其内部工作原理！
全部链接，无堆叠
叠层的一大优点是，它们允许用户完成一系列交互，而无需离开他们所在的屏幕。但是，在原型设计方面，对这些交互进行建模可能会变得笨拙。通常，您最终会得到交换的叠层，这些叠层始终锁定在相同的位置。或者更糟糕的是。您最终会在另一个之上堆叠一堆屏幕——之前弹出窗口的某些部分从各个角落伸出来。
使用 Sketch，不仅可以轻松堆叠叠层，还可以链接它们。通过将一个交互链接到另一个交互，您可以选择希望新叠层出现在哪里以及在用户触发下一个交互时是否应关闭之前的叠层。这才是我们所说的流畅的原型设计💅
这是一个堆叠的示例
在这里，我们使用多个叠层创建一系列事件。查看我们在 演示文档 中是如何做到的。
这是一个链接的示例
在这里，您可以看到当我们提示下一个叠层时，一个叠层是如何关闭的。此外，请查看该模糊的背景效果。
符号🤝叠层
如果 Sketch 和设计中有一件事是确定的，那就是没有任何事物会一成不变。如果您习惯使用 符号，您可能熟悉 智能布局——一个很棒的工具，可以教会您的符号如何适应画板或图层更改。但我们认为好事成三，就像三个火枪手、初始神奇宝贝或花花仙子一样。现在，您可以将符号 + 智能布局 + 叠层组合添加到阵容中。
在上面的示例中，我们看到了如何使用符号覆盖在状态之间切换。但是，如果我们预计要对这些状态进行更改怎么办？使用智能布局，我们可以为符号做好准备，并牢记原型叠层的整体尺寸。
这是一个示例
您会发现我们的 演示文档 中的许多符号都应用了智能布局。在符号页面中检查它们并试用它们！
就是这样！现在，您已准备好将您的 原型设计 提升到一个新的水平。要更深入地了解在 Sketch 中使用叠层，您可以查看我们的 介绍性文章 或浏览我们的 文档。
在 Sketch 中见！
