Axure架构图及流程图2——流程图&连接线
流程图&连接线
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。不过,这不是建立流程图所必要的动作。这个动作与绘制流程图没有关联性,只是用来辨识这个页面放 置流程图或线框图。

按下Widgets窗格工具列上的「Flow」可以找到 各种流程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」来编辑或清除。

在Auxre RP绘制的流程图,可以输出成图档或网页。
输出成图档:
选择「File > Export to Image」,就可以把单独这页流程图转成图档。如果您想把流程图放到Powerpoint或Word文 件,可以直接全选整个Axure RP流程图,以Coyp/Paste的操作方式贴到Powerpoint或Word文件中。
输出成Prototype:
是的,流程图可以直接在浏览器上观看。输出流程图到Html Prototype方式跟输出其他网页到Prototype相同,请按下Axure RP软体上方主功能选单「Generate」功能表,选择「Prototype(F5)」即可。

秘技一. 固定连接线,取消自动绕图:
在预设的情况下,连接线会自动绕过中间阻碍的Widget来连接两个连接点,为了避免连接线或Widget移动 时连接线不断的自动改变路径,您可以按滑鼠右键并选择「Edit Connector->Do Not Autoreflow Connector」来停止这个功能。
(版权声明:欢迎引用及复制Axure RP 中文教学内容,必须注明出处为悠识数位顾问有限公司及原始文章网址UserXper.com)
----------------------------------------------------------------------------------------------
原文为繁体,简体中文版由 dboy~小真 翻译并排版,以方便各位阅读
欢迎访问:dboy~ 小真の365天
与 dboy~小真 共同探讨Axure在设计中的使用技巧、为新入手的朋友解答问题。

Genial brief and this enter helped me alot in my college assignement. Thanks you seeking your information.