什么是线框图？权威指南

如果您是 UI/UX 设计领域的新手，您可能不了解“线框图”这个术语。但线框图是产品设计过程中不可或缺的一部分，所以让我们深入了解并发现——什么是线框图？

在这篇博文中，我们将解释线框图究竟是什么，为什么需要它们，何时可以使用它们以及存在哪些不同的类型。

什么是线框图？

从主要问题开始，线框图究竟是什么？广义上讲，线框图是蓝图或示意图，有助于将您的应用或网站的结构传达给相关利益相关者。

本质上——线框图是您产品的基本设计布局。线框图呈现您想要在页面上显示的关键信息。它们还清晰地表明您的应用或网站页面结构将是什么样子。最后，线框图提供有关用户界面中特定元素和用户流程的基本信息，甚至突出显示不同的 UI 功能。

为什么需要线框图？

在您的团队编写任何代码或分配大量资源来构建项目之前，重要的是每个人都要对他们正在构建的内容达成一致。使用线框图可以帮助每个人理解和沟通/解释您想要实现的目标。通过在线框图中以简约的结构设计来构建您的设计概念，您可以进行快速调整。此外，您可以让每个人了解您未来的设计将是什么样子。最重要的是，这意味着您可以尽早分享您的想法，而无需担心更复杂的设计元素，如颜色、阴影或复杂的菜单。

何时应该使用线框图？

线框图的主要目的是分享有关产品设计的基本但关键的信息。因此，您越早将线框图集成到流程中越好。线框图应该快速、简单并且能够进行大量修改。

通常，您应该考虑在 产品周期的发现阶段创建线框图。设计师使用线框图与利益相关者合作，以识别业务需求，确定产品的范围等等。

线框图保真度

线框图并非都是一样的。尽管它们都服务于相同的目的，但线框图的差异取决于您设计它们的保真度级别。所以让我们来看看您的不同选择。

低保真度

通常，您应该考虑在产品周期的发现阶段创建线框图。它们传达非常基本的页面结构，不考虑诸如网格、比例或准确性等细节。

您可以使用笔和纸或草图绘制应用来设计低保真度线框图。它们非常适合使用基本形状、图像和内容来分享即时想法。它们在利益相关者会议中特别有用，可以帮助每个人就产品的外观方向达成一致。此外，它们对于想要展示不同选择的设计师来说也非常方便。当然，因为每个线框图都很基本，所以设计团队可以测试想法，而无需浪费时间创建像素完美的模型。

中等保真度

对于线框图来说，最流行的选择是中等保真度。与低保真度相比，它们添加了更准确的结构和设计布局。中等保真度线框图仍然避免详细的元素，如颜色、UX 文案、图像和排版。但是，它们确实提供了更鲜明的功能和每个组件中的更多细节。

另一个关键区别是您使用数字线框图工具（如 Sketch）来设计中等保真度线框图——尽管您仍然应该在产品生命周期的早期使用它们来帮助塑造最终结果。通过使用线框图工具，您可以更改字体粗细和灰色阴影，从而为您的设计提供更多细节。

高保真度

最后，高保真度线框图——在某些情况下也称为模型或原型——将细节提升到一个新的水平。它们没有占位符文本和图像，而是具有更详细和相关的组件。

它们专为产品设计周期的后期阶段而设计，可帮助设计师和利益相关者分解更复杂的想法。如果您要设计菜单系统、交互式地图，或者您想更进一步，并提供更详细的产品模型，那么高保真度线框图非常适合您。而且，就像中等保真度一样，像 Sketch 这样的数字设计工具可以帮助您轻松创建它。

现在您已经了解了什么是线框图。它们是您在产品设计之旅中使用的重要工具，并且会使您的设计过程更加高效。您还可以查看我们的免费初学者课程，以了解有关在 Sketch 中进行设计的更多信息。