为什么线框在设计过程中很重要
已发表: 2017-01-29线框图是在设计过程早期识别可用性问题的一种快速有效的方法。
如果你是一名网页设计师，我相信你熟悉线框图，如果你像我一样是一名用户体验 (UX) 设计师，你可能会花费大部分时间用纸和铅笔手工或使用像Proto.io这样的数字工具。
这篇文章是为那些听说过这个词并想了解更多关于为什么线框应该在你的设计过程中扮演重要角色的人而写的。 我们还将介绍如何在与相关利益相关者和客户的对话中最好地利用它们。
让我们从回答“什么是线框？”这个问题开始。
我喜欢考虑像页面骨架一样的线框。 这个骨架是页面界面的二维描述，显示页面上元素的间距、内容的优先级、可用的功能以及用户将如何与站点交互。 它们还通过显示各个页面之间的路径，在将信息架构与设计的视觉方面联系起来方面发挥着至关重要的作用。 线框故意没有颜色、图形和风格化字体。
如果我们没有一个强大的骨架开始，那么我们放在它上面的所有东西，比如功能或样式，真的没有机会。
想想建造新房子的过程。 如果你把所有的精力都集中在室内设计上，比如墙壁的颜色和沙发的面料，而不是房子结构的蓝图，你认为它会达到目的吗？ 可能不是。 从室内设计开始，而不是从家庭的基础结构开始，是违反直觉的。
线框中不应该包含什么？
保持线框简单非常重要。 这是因为如上所述，线框图的重点是显示元素在页面上的布局方式以及站点导航应该如何工作。 太多的颜色或图像会分散读者对布局和导航元素的注意力。 确保消除或减少颜色、图像、图形和风格化字体的使用，以实现描绘骨架的简单视觉表示的目标。
请记住这些：
为你推荐：
元界将如何改变印度汽车业
反暴利条款对印度初创企业意味着什么？
教育科技初创公司如何帮助印度的劳动力提高技能并为未来做好准备……
本周新时代科技股：Zomato 的麻烦仍在继续，EaseMyTrip 发布强...
印度初创公司走捷径寻求资金
数字营销平台 Logicserve 获得 80 卢比的资金，更名为 LS Dig...
- 保持你的颜色为灰色、白色和黑色。
- 使用通用字体。 这有助于防止用户被排版的风格分心。 不过，通过字体显示信息的层次仍然很重要，可以通过简单地更改字体的大小以及它是“常规”、“斜体”还是“粗体”来显示。
- 避免高度风格化的图形和图像。 相反，我建议使用矩形和正方形作为占位符，在框的中间添加一个“x”来显示图像的放置位置。 您也可以做同样的事情来显示视频的位置，并在框的中心用一个三角形作为播放按钮。
使用线框的 5 个主要原因
线框是一个很好的工具，可以让您的客户在设计过程的早期专注于您希望他们考虑的内容。
线框是引导客户和利益相关者了解设计结构的好方法，不会让他们有机会被颜色和图像分心。 如果您的会议目标是让您的客户思考页面上应该有哪些元素以及这些元素将如何在网站上发挥作用，那么只需去掉颜色、图像和风格化的页面就可以让它变得更加简单。 然后，您可以轻松地从您的客户和利益相关者那里收集有关网站导航和页面元素分配的反馈。 而不是他们专注于红色如何“只是不适合他们”作为号召性用语按钮。 这听起来很有趣，但它发生了很多！
线框允许您绘制页面的功能，及早发现问题并节省以后的修订时间。
与具有许多设计元素的高保真模型相比，对线框进行更改要容易得多。 必须重新制作高保真模型需要更多时间来进行更改。 如果您在设计过程的早期就花时间通过线框图来思考页面的功能，您会很高兴自己做到了。 这绝对是花费时间和高效的时间。
换句话说，及早规划功能将减少开发阶段经常出现的来回次数。 与 Web 应用程序相比，用线框图重写函数肯定更容易。
线框图让您有机会更好地了解您的客户。
与客户相处的时间越多，您就会开始看到行为和动机的模式。 随着时间的推移，你从他们的反馈中获得的知识只会影响未来如何最好地与他们合作，以及如何让你与他们相处的时间最富有成效。 线框图也是让您的客户集中注意力的好方法。 客户喜欢提前五步，因为开始考虑最终产品是令人兴奋的。 但是，消除客户分心思考设计的功能和结构的机会将是您会发现非常有益的事情。
线框图是收集反馈和及早找出缺陷的好工具。
如果效率是您的目标（很可能是），那么线框图就是您应该开始的地方。 在某些情况下，由于时间或金钱的限制，您可能会感到有压力立即开始设计高保真模型。 试着记住，如果不及早收集质量反馈，你可能会在以后创建一个更加艰苦和耗时的修订过程，从而使一切效率大大降低。
通过帮助揭示空间限制和设计页面上元素的层次结构，线框是确定内容优先级的好方法。
尽早有机会可视化页面的层次结构并开始直观地显示空间限制，这将在以后开始对页面进行样式化并用内容填充它们时为您节省大量时间。 你应该从利益相关者那里收集关于你的线框图的反馈，根据你收到的反馈快速移动你的线框图，再次收集反馈，并迭代直到你达到你的预期目标。
结论
线框将可用性推到了最前沿，使用它们是说明页面布局和页面上元素功能的一种强有力的方式。
在设计过程的早期使用线框迫使您和您的客户客观地看待易用性、转换路径、元素放置，并帮助及早指出缺陷。 这些都是导致产品直观、实用和令人愉悦的因素。
【本文首发于 Proto.io 博客，经授权转载。】