axure教程(十)如何用axure rp画流程图

axure教程(十)如何用axure rp画流程图？

axure发表于232天3小时43分钟前

来源：标签：axure rp画流程图axureAxure教程

axure系列教程这一章的主要内容是讲述如何用axure rp画流程图：

1. 流程图

2. Flow Widget

3. 建立流程图

4. 关联网页

5. 输出流程图

6. 秘技(Quick Tips)

1.流程图

流程图可以用来表达各式各样的流程，包括：Use Case、商业流程与网页流程，在Axure RP中，流程图常被用来提供一个高阶视角(high level view)来看网页设计可以达成的工作。在Sitemap窗格中的网页标示图案，预设为网页形状的ICON，您可以在Sitemap中的

网页上按鼠标右键并选择「Diagram Type->Flow」，将网页标示图案设定为流程图ICON。

不过，这不是建立流程图所必要的动作。这个动作与绘制流程图没有关联性，只是用来辨识这个页面放置流程图或线框图。

2. Flow Widget

按下Widgets窗格工具列上的「Flow」可以找到各种流程Widget。

在Widgets 窗格中有各种形状的Widget可以用来代表不同的流程步骤，如果您找不到适合的形状，也可以使用Image Widget来代替。

依惯例，在流程图中不同的形状的图形分别代表着特定的意义，但是Axure RP 并没有限制这些图形的使用，一般来说，只要您的客户看的懂就是最好的规则。

3. 建立流程图

就像Wireframe Widget一样，Flow Widget也可以直接从Widgets 窗格中拖拉到Wireframe 窗格，然后透过工具列或快捷菜单(Context Menu)来编辑样式与属性，如果要改变流程形状的话，可以按鼠标右键并选择「Edit Flow Shape」子选单中的项目。

连接线

Flow Widget和Wireframe Widget最主要的不同就是Flow Widget具有可以附加连接线的连接点。

想要加上连接线的话，请先按下工具列上的【Connector Mode (F11)】钮，将Wireframes 窗格改变为Connector Mode，若是要将Wireframe窗格切换回Pointer Mode的话，则请按下【Pointer Mode (F9)】钮。

切换到Connector Mode后，在Wireframe 窗格中按一下鼠标左键并拖曳，就可以画出一条连接线。

若是要连接两个Flow Widget的，请在其中一个Widget上的连接点按住鼠标左键，拖拉连接线到另一个Widget上的连接点后放开鼠标，就可以新增一条连接线；您也可以利用拖曳连接点的方式将已经建立好的连接线附加到另一个Flow Widget的连接点上。

连接线也可以套用线条末端(例如：箭头)与线条样式(例如：虚线)，只要先选好您要设定的连接线，再使用工具列上的Line Pattern 与Line Ends按钮即可。

4. 关联网页

Flow Widget可以关联到任意指定的一个参考网页，一旦指定了关联网页，Flow Widget 上会显示这个网页的名称，而在Prototype中，这个Flow Widget与网页间会自动建立Hyperlink连结。

从Sitemap窗格中，将任一网页拖拉到Wireframe窗格中，也会建立一个以这个网页当作关联网页的Flow Widget。

Flow Widget 上的关联网页可以透过在Widget上按鼠标右键，并选择「Edit Flow Shape->Edit Reference Page」来编辑或清除。

5. 输出流程图

在Auxre RP绘制的流程图，可以输出成图档或网页。

输出成图档:

选择「File > Export to Image」，就可以把单独这页流程图转成图档。如果您想把流程图放到Powerpoint或Word文件，可以直接全选整个Axure RP流程图，以Coyp/Paste 的操作方式贴到Powerpoint或Word文件中。

输出成Prototype:

是的，流程图可以直接在浏览器上观看。输出流程图到Html Prototype方式跟输出其它网页到Prototype相同，请按下Axure RP软件上方主功能选单「Generate」菜单，选择「Prototype(F5)」即可。

6. 秘技(Quick Tips)

秘技一. 固定连接线，取消自动绕图:

在预设的情况下，连接线会自动绕过中间阻碍的Widget来连接两个连接点，为了避免连接线或Widget移动时连接线不断的自动改变路径，您可以按鼠标右键并选择「Edit Connector->Do Not Autoreflow Connector」来停止这个功能。