被低估的流程：线框图计划指南

大大都环境下，我们倾向于低估本身所认识的事物。在本文中，我们将研究计划中最简朴、因而经常被低估的勾当之一，即线框图的计划。相识什么是线框图，为什么必要计划它们以及怎样充实操作线框图。

一、什么是线框图？

线框图，也称为页面表示图或屏幕蓝图，是展示网站或产物框架的视觉指南：

• 计划：线框图凡是用于在思量用户需求的环境下在页面上部署内容和成果。
• 开拓：添加视觉计划和内容之前，在开拓进程早期行使线框来成立页面的根基布局。

线框图的首要方针是向团队和洽处相干者展示产物将包括的页面和组件，以及这些元素之间的彼此浸染。

二、为什么必要计划线框图？

1. 辅佐团队评估和完美事变范畴

线框图应承计划师快速建设产物的视觉示意，利便后期修改；辅佐计划师向团队展收?用措施具有的页面元素和控件，以及全部元素怎样举办交互。

2. 让团队全部成员参加产物计划阶段

线框图的行使应承计划师和开拓职员在早期阶段配合参加接头计划，在开始举办视觉计划之前就提供反馈和变动提议，这样有助于使计划进程快速迭代，停止不须要的挥霍。

3. 利便快速演示

从客户和洽处相干者哪里得到快速反馈是计划进程的重要构成部门。计划进程中，常常会碰着需求的往返变革。有了线框图，可以使这个进程更有用，由于修改原型比修改线框图必要更多的时刻和精神。

4. 举办用户测试

线框图可以辅佐计划师从隐藏用户哪里得到有代价的反馈。同时赏识线框比读取类型要快得多，尚有助于减小与预期结果的差别。

三、线框图现实应用

为了得到最好的功效，为下一步的UI打下坚硬的基本，必要遵循几个简朴的法则：

1. 颜色的行使

假如在线框图中行使富厚的配色，也许会分手观者的留意力，并使更新变得更坚苦。

但在某些环境下，行使颜色突出表现特定组件是公道的。譬喻，可以将赤色用于错误状态，将蓝色用于注实寥。

2. 行使简朴的组件

线框图并不包括全面计划和具体声名的组件。相反它们应该计划的相对简朴，让团队成员更轻易辨认。添加具体的组件将耗费大量的时刻和精神，却不是很适用。

3. 保持同等性

在全部线框图中，相同的组件必需看起来沟通。假如沟通的组件看起来差异，开拓职员也许会质疑它们的成果是否沟通，乃至会由于计划差异而增进估算时刻。

在处理赏罚线框图时，记着一个简朴的法则：保持同等，停止造成夹杂。

4. 行使真实内容

我们会常看到UI/UX计划师没有在线框图上添加真正的内容，而是一再行使统一些文本，这是很少有计划师意识到的广泛错误。

内容真实与否会影响接下来的计划。假如行使不真实的内容，UI计划中文本的数目几多和排布方法都要再调解。真实内容能给线框图增进代价，更好地表明上下文。

5. 行使注释

计划中也许会碰着某些办理方案无法直观地加以声名的环境，譬喻某些控件背后的逻辑，因此开拓职员也许会对它们有疑问。

在这种环境下，可以提供注释来表明其背后的逻辑。这样，你的团队就会领略你的办理方案，你就不必要花时刻再接头它们。

6. 线框图水平

线框图应该选择低保真照旧高保真，没有严酷的划定，取决于项目标详细要求。

硅谷知名作家埃里克·莱斯以为，假如不能带来代价就不必要做特另外事变，从基本做起，然后按照必要添加细节。

7. 将线框图延长到交互原型中

在行使差异产物时，有一些简朴而通用的交互，也有一些交相互当伟大。在线框图不敷以声名伟大性的环境下，可以将线框图扩展到交互原型中，而不必写冗长的注释并花大量时刻举办表明。

总结

将线框图团结到计划进程中，让它们为我们事变：

• 辅佐团队得到更准确的项目估算。
• 让全部团队成员参加计划流程，停止影响开拓进程的错误。
• 提前向客户、好处相干者举办演示，以尽快得到反馈，节减开拓不良办理方案的时刻。

原文：https://www.smashingmagazine.com/2020/04/wireframe-design-success/

作者：Anton Suprunenko

译者：Clippp，微信公家号：Clip计划夹。每周精选计划文章，专注分享关于产物、交互、视觉上的计划思索。

本文素材来自互联网

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!