Axure原型在工作中的应用

ShereenAo

2017.07.12 18:19:35 

什么是原型？

产品原型，简单的来说就是产品设计成型之前的一个简单框架。
对网站来讲，就是将页面模块、元素进行粗放式的排版和布局，深入一些，还会加入一些交互性的元素，使其更加具体、形象和生动。

enter image description here

一、主要页面原型

1. 主要页面原型的作用
主要的页面原型可以用于产品初期的讨论会、测试以及产品介绍会。

2. 准备工作
在进行主要页面原型设计之前，交互设计师需要：

• 一份主要的任务流程图
  (根据“业务逻辑”产生的“任务流程”，任务流程可由产品或是交互出，根据各个公司或项目的具体情况而定。

• 一份主要功能列表(PM出)

• 网站信息架构

• 对于前期调研结果的理解

3. 制作主要页面原型

1. 在建立项目的初期就开始定义Master(母板)
   Master:会被复用的区域，即共享区域。
   项目开始，就可以建立Master,比如网站的Header/Footer/Navigation/广告版本等
   Master:

   

   enter image description here

   
   另外可以应用一些Axure RP library 来提高效率。

2. 根据“任务流程图”、“功能列表”将主要的页面原型制作出来
   其中包含一些主要的交互即可。一些详细的，可以暂时不用考虑。

制作主要页面原型注意事项：

1. 不要加入视觉设计的元素 着眼于大局(流程的优化、布局设计、交互设计)，不要纠结细枝末节。

2. Axure之前，纸面原型来整理好思路

3. 此过程是快速的、迭代的

二、页面流程图

1. 页面流程图的作用
展示想法，利于思路的整理。
因为Axure上的交互点是散的，所以要通过页面流程图，来整理页面上的交互行为。

enter image description here

注意规范化页面流程图要素，可以减少沟通成本。
如：上图中的开始，红色圆圈的数字分别表达什么意思

三、完善原型

1. 按照页面流程中所考虑的交互过程，体现在原型上面，完善所有交互细节。

2. 增加说明

3. 页面编号：当原型不需要修改时候，为原型页面编号。

注意：

1. 不要太过于追求技术表现。Axure是快速原型工具，具体实现交给前端。

2. 为了减少沟通成本，在完善原型的时候最好有一定的规范和标准

资料来源：网络搜集、整理