线框图最佳实践

线框之于数字产品就像建筑蓝图之于建筑物：设计过程中的一个重要阶段。它们展示了最终产品的外观，并允许您的团队以最小的费用在早期阶段测试想法并解决问题。就像创建蓝图以构建合适的建筑物的最佳实践一样，在创建线框时也需要遵循最佳实践。 

记下一个计划并首先制定为什么需要线框以及您希望实现的目标。它将帮助您遵守时间表，因此您不会跳过重要步骤并专注于不必要的问题。这些知识使您的整个团队能够制作出为您的用户提供良好服务的最佳产品。

不要跳过线框图阶段

无论您使用哪种类型的数字产品，线框图都有很多好处。在没有首先创建至少一个基本线框的情况下设计产品就像尝试在没有地图和目的地的模糊概念的情况下进行公路旅行。

线框图允许您估计和定义您将在产品上进行的工作范围。它可以作为一种工具，让整个设计团队都参与到这个过程中。您甚至可以使用线框图来进行基本的用户测试，通过确保您的基本概念适用于您的用户，潜在地节省时间和金钱。

设定线框目标

在开始线框图之前，您需要弄清楚线框将要解决的目标。用户研究应该是这个过程的一部分，以确定他们的需求和愿望是什么，他们目前如何解决这些问题，以及你的产品将为他们解决什么问题。

除了用户需求之外，线框图还可以帮助解决其他一些问题。其中最重要的一项是业务对产品的要求。产品对企业的目的是什么？是要卖东西吗？产生潜在客户？或者是其他东西？在这里考虑预算和资源限制等问题。

此外，您应该考虑由于使用的 CMS 或将使用产品的平台而可能存在的任何技术限制。这些会对您的产品有什么可能和不可能有很大的影响。

尽量减少线框中颜色的使用

一般来说，线框应该用黑色、白色和灰色的阴影来完成。灰度线框暗示设计尚未完成，从而更容易丢弃不起作用的设计并重试。他们也给客户和其他利益相关者留下了同样的印象，如果他们觉得线框只是一个早期的原型，他们会更愿意提供创造性的反馈。

也就是说，在某些情况下，线框中的颜色可能很有用。如果您需要向客户展示他们现有的调色板不适用于设计，需要在某些情况下显示对比度，或者觉得颜色的使用有助于您的设计获得认可，那么使用颜色可能是正确的选择。

在线框中使用基本组件

通常，您希望在线框中使用非常基本的组件。你想表达哪些元素去哪里，而不是别的。将风格元素留给以后的模型和原型。

你的线框越风格化，它就越像是一个完成的设计，这可能会阻碍有用的反馈。通过使用更基本的表示，您会发现利益相关者和客户可以自由地就设计中的工作和不工作提供更诚实和创造性的评论。

保持线框的一致性

虽然您不想过多地对线框进行样式化，但您应该保持它们一致。小东西，比如对各种元素使用一致的尺寸、形状和颜色，对使您的线框看起来很专业大有帮助。

在线框中使用真实内容

内容应该推动您的设计决策。内容优先的设计可确保您的 UI 以支持内容的方式发展，从而更好地支持您的用户体验。

使用真实内容提供了一些好处。在您的线框中查看真实内容也使利益相关者更容易提供反馈。它可以更容易地找出围绕内容的实际产品需求，尤其是围绕空间限制等问题。而且它可以加快产品开发的整个过程，因为尽早准备好内容意味着更少的内容相关延迟。

在线框中使用注释

并非线框中的所有内容都是不言自明的。这就是注释对流程至关重要的地方。当观众无法主动与您的线框互动以了解事物的运作方式时，您需要对其进行注释以进行解释。

注释的目的是明确为什么您的线框使用特定元素以及这些元素将如何工作并支持整体用户体验。您希望您的线框对于查看它们的人来说尽可能简单明了。

选择合适的线框复杂程度

线框在复杂程度方面差异很大。低保真线框只不过是在一张纸上涂鸦的一系列标记框。高保真线框几乎可以与完成的网站或其他数字产品一样复杂，并包含一些内容。

那么哪个是正确的复杂程度呢？与几乎任何设计问题一样，答案是视情况而定。如果线框仅用于您自己的迭代过程，直到您找到最佳设计解决方案，那么低保真度的手绘草图是一个不错的选择。

如果线框用于更复杂的项目和/或将展示给客户或其他利益相关者，您可能需要创建更复杂的东西才能让您的想法得到传达。对于许多项目，正确的复杂程度可能介于两者之间。

将线框扩展到原型

线框只是设计过程中的一步。从那里，您可以朝两个基本方向前进。

对于更简单的项目，您可以直接从线框开始创建实际的 UI 设计。但对于更复杂的项目，交互式原型可能是最聪明的过渡步骤。

原型让您对产品的实际功能有更多的了解，这对于确保它同时满足用户需求和业务需求非常有价值。在开始设计最终 UI 之前，这也是解决用户旅程中的任何问题或潜在障碍的绝佳机会。

选择合适的工具

寻找合适的工具来创建你的线框是一个非常个人的决定。那里有很多选择，从简单的笔和纸到复杂的应用程序，让您超越线框图。那么你如何决定使用哪一个呢？

有几件事要记住。一是程序创建的线框的简单性。一些应用程序使线框看起来更像是完成的 UI 设计，这可能会破坏线框的目的。

要考虑的第二件事是与您的团队协作并与利益相关者共享线框图以收集反馈是多么容易。即使对于那些不是特别熟悉该应用程序的人来说，这也应该是一个简单的过程。

第三是学习曲线。如果您需要几天或几周的时间来学习如何使用该程序来创建线框，那么您就是在浪费时间。如果你不能在一两个小时内至少掌握程序的基本功能（即使更高级的功能需要额外的时间），那么你最好找到不同的解决方案。

迭代

最好的设计遵循一个迭代过程，创建设计，然后在多轮测试和反馈后改进它们。线框图最好的部分之一是它是为迭代而构建的。

每次您收到利益相关者的反馈时，无论他们是用户还是客户，您都有机会更新和改进线框。与使用更精美的 UI 设计相比，早期进行这些改进的成本和时间都更低。

以上内容为转载