20个细节改进你的线框图

不对需求进行规划，直接让你的程序员进如开发流程，这种做法绝大多数情况下带来的只能是项目的失败。而线框图就是一种很好地能清晰表达出项目需求的工具，它能让脑中的想法通过按钮、线段和其他形式表达出来。

1.明确目的
理想很丰满，现实很骨感。对于真正有过项目经验的人，想像中的东西落实起来并非一帆风顺，困难、阻碍、磕磕碰碰总是免不了的。
使用线框图的好处之一就是可以高效地分析表达出你的需求，之后我们就可以把精力投入到开发编码中去；第二，对需求和应用更好的理解和规划，好记性不如烂笔头，而且更能引导你完成后续的思考；第三，和其他设计文档一样，可以作为项目整体情况的一个参考。

2.线框图首要是有用，好不好看在其次
尽量避免掺入视觉元素，只把必须的功能按钮和结构设计出来就可以。好不好看是设计团队应该考虑的事情。

3.跟着感觉走
你不需要对设计或者程序有多么了解，如果你是一个网络用户或者使用过这类产品，你完全就可以凭借自己之前的使用经验来制作自己的线框图。

4.谁来承担责任？
必须有专门的人承担制作线框图的工作。按需求制作线框图并根据反馈进行修改。这个人是谁并不重要，只要他可以把对产品的需求用线框图表达出来就可以，这个工作甚至有时候是有客户自己来完成的。

5.让每个人都要参与其中
的确，少一点人线框图做起来会快一些。不过还是建议制作线框图的团队中需要包含至少1-2名设计人员，他们会对你的线框图布局和页面需要哪些元素提出很好的建议，另外设计人员往往也是最了解用户需求和最早发现产品潜在问题的人员。

6.为线框图设立一个完成时间
如果你想这块的工作效率高点，那就下达一个完成时间，否则拖拖拉拉只会让你的项目一拖再拖。

7.简洁、简洁、再简洁
加入你的线框图只需要2个输入框、1个按钮。ok，那就这些东西，不要多也不要少。

8.我们不是要去“画”线框图
作为某种程度上来描述功能的一个工具，展示样式是否美观并不重要。千万不要让自己陷入“如何让我的线框图看上去更漂亮一些”这样的窘境中。更不划算的是，当你觉得在页面中加入了一点蓝色使得它看上去舒服了那么一点，结果你却发现之后的讨论会议上你不得不拿出半小时来跟设计团队讨论这里使用蓝色究竟有些什么价值，他们可不会认为你只是为了好看就随手加了个蓝色上去的。记住，设计的活儿就留给设计去做。

9.记住UI不是UX
用户体验这个概念现在很风行，但是对线框图来说，它是一个用来展示功能和信息结构的工具（或者说界面），并不是终端用户要接触到的东西。所以在线框图中请避免参杂像ajax这样的特性。

10.也要考虑用户的体验
如果你的注册流程需要三个页面才能完成，恐怕这个线框图也就失去了交付给设计团队、开发团队的必要了。所以，尽管我们在设计线框图的时候可以抛弃视觉元素、但是也不要忘记功能和结构上如何能贴近用户的需求，避免引起用户的反感。

11.不要想当然
你可能会觉得登录页面毫无疑问是网站必须有的，所以交给设计们去做吧，我的线框图就没必要做那么详细了。抛弃这种想法吧，保证你的线框图拥有了网站所需的每一个页面，只要是涉及功能、流程方面的，一个页面都不可以少。

12.做好归类和排序
例如在内容上，我们可以把站点划分成资讯、产品和个人账户等不同类别，这里我们建议尽可能选择方便以后查找参考的样式对你的线框图做分类管理，当然也不应该忘记按照网站本身架构对对应线框图的目录管理。

13.对页面进行编号
很多时候一个功能的流程并不是线性的，而是会给根据用户的不同选择拓展为多个分支流程，对照不同流程制作出的线框图最好也能有一个对应的页码编号或者类似标签一样的东西，设计人员和开发人员可以一目了然你要做的究竟是什么事情。

14.找出重复的页面
例如用户可以从不同的入口进入自己的个人主页，这种重复的页面需要被重新整理出来，告诉后面的团队，这会大大节省开发的时间成本。

15.让你的线框图一看就懂
找一个完全对项目或需求没有了解的人来，如果在你向他演示完一遍你的线框图后他能明白相应的功能或需求。那说明你的线框图已经达到了制作的目的。记住，你最后交付的文档应该能让几乎所有人都看懂。

16.广告位也是必不可少的
和其他元素一样，页面的广告位同样也是功能和结构的一部分，这不是设计团队的工作，在交付给他们之前，广告位就应该被设计好。

17.用自己的内网发布
和开发一样，线框图也尽量发布在内网上沟通，这也是处于安全的考虑。

18.知道该什么时候停下来
确保参与项目的各个小组都有机会加入对线框图的反馈中来。对于出现的反对或者修改意见，给出的建议是在通过大家的决议后再针对设计文档进行修改，而不是拍脑袋决定。

19.好的工具会让你事半功倍
通过纸、笔来手动绘制线框图，通过Balsamiq或者Axure在电脑上绘制，都可以可以参考的途径。

20.动手之前先考虑可能和其他功能的关联
我们在开发一个新组件、新功能的时候不可避免会遭遇到跟已有产品的交叉，有些会用到现有产品的相应功能，有些会对现在的模式结构带来影响。在动手绘制线框图以前，尽可能把这些交叉的方面理清楚。