简单来说，原型设计是交互设计师与 PD、PM、网站开发工程师沟通的最好工具。

原型设计，在原则上是交互设计师的产物，以用户为中心的理念应当贯穿整个产品。交互设计师以其专业的眼光和具体的经验，直接塑造该产品的可用性。

看看下面 1.3-1.5 这三张生动的“秋千需求图”，你可以得到一个有趣的直观对比认识。它们要说明的正是这样一个道理：产品或者项目之中的需求沟通和需求理解，已经是项目中的一个不可忽视的成本了。

进一步说，设计原型有这些显性的优点：

1、快速模拟产品实现效果，快速获得反馈；

2、同时多个方案，对比，准确锁定目标方案；

3、修改轻松，省时省力；

4、做原型时，能找出需求的不足，促进需求的完善；

5、有效帮助分析产品、设计展示和开发实施；

6、直接目标：更快、更好地说明产品需求；

7、终极目标：提高用户体验。

因此，在创见和需求诞生后，一般来说，越早投入原型设计，产出越高；

根据功能/视觉的简单二分，可以得到高保真原型、UI 图、简易原型、低保真原型四种。

高保真原型，也即那些视觉上与实际产品等效，体验上也与真实产品接近的产品演示Demo 或概念设计展示。

在很多工作过程中，并没有绝对必要强调每次做高保真原型，这要看工作的状态和团队配合的默契程度。

个人认为，初级产品经理搞定低保真原型能说明问题就可以了，多数情况下不必去侵占交互设计师以及视觉设计师们的工作。这个道理就好像问产品经理要不要懂技术呢？要的，但是呢，不要过多干涉到程序员工程师们的专业领域。

一般来说，按照从简易到精准的顺序来看，脑图、纸原型、线框图、低保真原型、高保真原型的难度是递增的，对应所用的制作工具也不相同，当然，很多工具可以同时完成多种原型，例如下面要提到的 Axure。举例如下：

脑图：MindManager、OmniGraffle for Mac；

纸原型/线框图：画图、简单的纸笔；

低保真原型：Visio、balsamiq、PENCIL PROJECT、OmniGraffle for Mac；

高保真原型：Fl、Fw、Ps、Dw、Axure RP Pro。

Axure RP Pro ：美国 Axure Software Solution 公司的旗舰产品，负责定义需求与规格、设计功能与界面，主要使用对象包括交互设计师、用户体验设计师、业务分析师、产品经理、可用性专家、信息架构师。

比较常见的是 6.5 版本以及 7.0 版本，推荐 7.0 版本，这里给出官网下载渠道。另外，苏杰的博客曾提供一个7.0 正式版以及简体中文汉化包下载地址，地址是：http://www.woshipm.com/xiazai/58714.html 。

绘制线框图要做三件事：确定界面框架，规划信息内容，分出页面层级。

控件（Widgets）：用于设计线框图的用户界面元素；

常用的控件：按钮、图形、图片、文本框、线、checkbox、radio button等。

添加控件：拖拽、拷贝粘贴、载入等；

操作控件：移动、改变大小，多对象操作的选择、移动、修改尺寸，组合、排列、对齐、分配、锁定等；

编辑控件：修改名称等属性等。

页面注释：自定义页面备注，测试用例，操作说明；

页面备注：可自定义页面备注等。

交互设计（Interaction Design），简单来说，就是描述用户行为、操作的设计；展开一些来说，交互设计首先旨在规划和描述事物的行为方式，然后描述和传达这种行为方式的最有效形式。

动作（action）：设计线框图中的控件行为；

事件（event）：动作产生事件，如鼠标的 Onclick、OnMouseEnter、OnMouseOut等；

场景（case）：多个动作和事件合成场景，如打开连接、显示面板、隐藏、移动等。

纯银老湿常挂在嘴边的产品设计中起作用的四大件——逻辑、视野、场景分析、审美风格——在做原型的这个部分，就格外强烈地凸显出来，它也是借助原型说清需求的关键部分之一。

首先，可以指出的是，动态面板（Dynamic Panel）是 Axure 中的一个重要概念，也是一大交互利器（另一个是7.0 版本的中继器 Repeater），动态面板涉及默认（Default）、隐藏/显示、状态以及相关动作。

常用的动作和事件包括点击、鼠标移入/移出、鼠标悬停超过XX秒、隐藏/显示、移动等。

其次，设置事件和场景，就像是导演在工作一样：一个触发事件可以包含多个场景，根据你编排的“剧本”依次实现，这里有流程、有互动，体现着强逻辑性。

接下来，适当使用模块（Master）：可重复使用特殊页面，模块可用在页面中或是其他模块中，以及当你修改模块时，所有引用模块的页面中相应的模块都会随着更新。

1、HTML原型：设计好线框图、定义好交互后，可产生基于浏览器的、可互动的原型；原型时一些 HTML 和 JavaScript 文件，可在 Firefox、Mozilla、IE6+ 浏览器中运行。

2、生成操作：F5 或 F8，或点击主菜单>发布>预览/生成原型（中文版）；养成好习惯，记得选好存储文件夹和默认浏览器哦。

3、查看和使用：F5（预览），会直接在浏览器显示；F8（生成），在存储文件夹下，点击：Index 文件，即可查看。

善用现有资源，可以进行直接修改，以及截图示意；为了效果分明，可以用比较明显的色块来区分，同时用灰色图去掉干扰。

Axure 官网上给入门者提供了生动的学习指导手册（链接），Axure 中文网、Axure RP 中文社区等也都提供了一些靠谱的教程、用例样式和素材资源，可以用于学习。

另外，Lyndn.com 上面的付费课程《UX Design Tools: Axure with Brian Thurston Bralczyk》，条目清晰，讲解细致，同样推荐。

更多精彩，相信在积累了足够的 Hands-on experiene 之后，你会有深刻的体会。