Axure RP入门教程:流程图和连接线的相关用法及效果

2023-05-2416:14:42原型设计Comments3,091 views字数 2039阅读模式

介绍Axure RP中流程图和连接线的相关用法及效果。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html


1、什么是流程图文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

一个流程图可用于展示各种各样的处理流程,包括用例流程、商业流程、页面流程等,能使思路清晰、逻辑清楚,有助于程序的逻辑实现和有效解决实际问题。在Axure RP中,流程图常用于提供一个高保真的、能通过所设计的页面来完成的任务视图。一张简明的流程图,不仅能促进和其它设计师、开发工程师的交流,节约口头沟通成本,还能点出一些关键性问题。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

流程图其实也是页面,只要修改页面类型为流程图即可。在页面上点击右键,选择“Diagram Type->Flow”,这时在页面前图标会变为一个Axure RP入门教程:流程图和连接线的相关用法及效果图标。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

注意:要创建流程图并不是一定要将页面指定为流程图,指定为流程图只是方便识别。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

2. 流程控件文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

在控件面板中的顶部工具栏上点击“flow”按钮可以找到流程控件,这些流程控件用于表达流程中的步骤。Axure RP里面由于不涉及到具体的程序流程,所以有些标准的图形并没有提供,如不规则图形、侧面双矩形等,如果这些流程控件不满足你的流程需要,可由图片控件进行合成。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

流程控件的使用有一些约定习惯,但是Axure RP并没有对如何使用这些形状进行强制约束。一般地,你应该以其他人能够理解的方式进行使用,也可以自己自定义一套符号标准使用。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • rectangle:矩形 

作用:一般用作要执行的处理(process),在程序流程图中做执行框。在 Axure RP中如果是画页面框架图,那么也可以指代一个页面。你可把页面和执行命令放在同一个流程中做说明,将两类不同的矩形做色彩区别,然后做说明就好了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • rounded rectangle:圆角矩形或者扁圆 

作用:表示程序的开始或者结束,在程序流程图中用作为起始框或者结束框。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • beveled rectangle:斜角矩形 

作用:一般不常用,可以视情况自行定义。在其他的流程图中或有其他特殊含义,暂不知晓,欢迎在下方评论留言告知小编~文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • diamond:菱形 

作用:表示决策或判断(例如:If?Then?Else),在程序流程图中用作判别框。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • file:文件 

作用:表达为一个文件,可以是生成的文件,也可以是调用的文件。如何定义,需要自己根据实际情况做解释。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • bracket:括弧 

作用:注释或者说明,也可以做条件叙述。一般流程到一个位置,做一段执行说明,或文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

者特殊行为时可以用到。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • semicircle:半圆形 

作用:半圆在使用中常作为流程页面跳转、流程跳转的标记。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • triangle:三角形 

作用:控制传递,一般和线条结合使用,画数据传递。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • trapezoid:梯形 

作用:一般用作手动操作。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • ellipse:椭圆形或圆形 

作用:如果画小圆,一般是用来表示按顺序数据的流程。如果是画椭圆形,很多人用作文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

流程的结束。如果是在 use case 用例图中,椭圆就是一个用例了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • hexagon:六边形 

作用:表示准备之意,大多数人用作流程的起始,类似起始框。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • parallelogram:平行四边形 

作用:一般表示数据、确定的数据处理、资料输入(Input)。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • actor:角色

作用:来自于use case用例,模拟流程中执行操作的角色是谁。需要注意的时,角色并非一定是人,有时候是机器自动执行,有时候也可是模拟一个系统管理。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • database:数据 

作用:指保存网站数据的数据库。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • image:图片

作用:表示一张图片、置入一个已经画好的图片、流程或一个环境。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

3、流程连接线文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

流程图控件和线框图控件的不同点在于流程控件可以通过连接线进行连接。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

要添加连接线,可以点击主工具栏上的“Connector Mode button (F11)”按钮,这时线框图面板会从指针状态切换到连接状态,若再点击“Pointer Mode button (F9)”可以切换回到指针状态。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

在连接状态时,在流程图中点击和拖动就可以绘制和添加连接线。例如,要连接两个流程控件,将鼠标放在一个流程控件的连接点上,点击和拖拉,然后鼠标在另一个目标流程控件的连接点上松开,就可以完成连接。点击和拖动连接线的尾部端点可进行重新连接。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

选择流程连接线,然后点击工具栏中的“Line Pattern ”和“ Line Ends”按钮可以修改连接线的形状和样式,如箭头、虚线。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

4. 创建流程图文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

与线框图控件相似,你可以拖拉流程图控件到线框面板中,可以通过工具栏和右键菜单来修改流程图形状的风格和属性。另外,已经绘制好的流程形状可以通过控件右键菜单中的“Edit Flow Shape”的子菜单进行流程图形的转变。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

5. 流程图中引用页面文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

可以在流程图控件上分配一个引用页面,如果流程图控件引用了一个页面,控件上的文本会变成页面的名称。在原型中点击引用了页面的流程控件可以自动链接到页面中。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

在页面导航面板中拖拉页面到线框图或流程图中,将会创建一个引用了页面的流程图控件。流程图控件上所引用的页面可以通过在控件上的右键菜单 “Edit Flow Shape->Edit Reference Page”进行编辑和清除。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

引用页面后,控件左上角会有一个“页面”图标进行标识:文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

Axure RP入门教程:流程图和连接线的相关用法及效果文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/41854.html

  • 本站内容整理自互联网,仅提供信息存储空间服务,以方便学习之用。如对文章、图片、字体等版权有疑问,请在下方留言,管理员看到后,将第一时间进行处理。
  • 转载请务必保留本文链接:https://www.cainiaoxueyuan.com/yuanxing/41854.html

Comment

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定