网站原型图设计流程指南

这里分解一下原型图设计的流程，可以作为指南进行参考：

①  填写需求调研表

首先，在市场调研中，我们重点需要对项目进行信息采集和需求调研，是原型图设计可以同步进行的工作，这里我们分别采用两张表单进行关键信息采集，内容主要是项目需求、设计风格、参考资料、受众人群属性等等。

②  初步构思，大框架绘制初稿

根据上述这些信息采集及研究之后，基本就有了初步的想法，将这个想法可视化出来，也就是大框架草绘原型图，可以是手绘也可以是软件绘制。

草绘原型图：从字面上理解就能知道是相对“简陋”的一种绘制形态，仅展示大概的网站页面框架、核心的网页布局以及关键内容。这种形态更多是在团队内部协作时会采用的，快速绘制调整，有利于尽快得到反馈，推进网站建设的进程。

如果页面较为复杂时，我们还需要输出「页面流程图」，进行页面逻辑和需求逻辑的说明，把页面的功能、需求、目的、行为说明清楚，既能方便设计师理解，又能理清框架，验证功能可行性。

③  验证需求可行性，输出低保真原型图

根据原型图的讨论、页面流程探讨，进一步优化网站整体框架和逻辑，输出完善的低保真原型图，进行90%的确认。

低保真原型：这类绘制形态和草绘原型图相比要更完整，是我们网站原型图设计阶段常会采用的一种形态，低保真没有视觉设计，大多数使用灰色色阶和占位符来指示内容，多为黑白灰的视觉风格。可以较为完整地展示网站页面框架、内容布局等，更有助于建站过程中的视觉、交互设计协作。

④  最终输出高保真，及需求文档，对接设计

最后，如果功能较为复杂，或者希望更为直观表达，我们可以输出更加完善的高保真原型图，包含一些静态DEMO，作为参考提供给设计师和技术人员，同时要输出相应的需求文档，进行100%确认。

原型图设计推荐使用码前设计工具，一站式完成需求梳理+原型设计+UI设计等编码前的设计工作。