AxcureRP使用指南.docx

AxcureRP使用指南.docx

《AxcureRP使用指南.docx》由会员分享，可在线阅读，更多相关《AxcureRP使用指南.docx（16页珍藏版）》请在冰豆网上搜索。

AxcureRP使用指南

1AxcureRP简介

AxureRP是一个专业的快速原型设计工具。

Axure（发音：

Ack-sure），代表美国Axure公司；RP则是RapidPrototyping（快速原型）的缩写。

AxureRP是美国AxureSoftwareSolution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。

作为专业的原型设计工具，它能快速、高效的创建原型，同时支持多人协作设计和版本控制管理。

AxureRP已被一些大公司采用。

AxureRP的使用者主要包括商业分析师、信息架构师、可用性专家、产品经理、IT咨询师、用户体验设计师、交互设计师、界面设计师等，另外，架构师、程序开发工程师也在使用Axure。

2元件库

元件是Axcure原型制作的最基本元素，一个原型就是由若干个元件构成的。

Axcure工具自带一个元件库，称之为标准元件库，用户也可以自定义元件库。

标准元件库：

大部分元件按照字面意思就可以知道它的用途了，如：

Common下的Image、一级标题、二级标题、文本标签、文本段落、水平线、垂直线，所有Forms下的元件文本框、多行文本框、下拉列表框、列表框、复选框、单选按钮、提交按钮，MenusAndTable下的树状菜单、表格、水平菜单、垂直菜单。

下面就Common下的元件，矩形、占位符、按钮形状、热区、动态面板、内联框架、中继器的用途进行描述。

2.1矩形组件和占位符

矩形组件和占位符基本是一样的组件，两者是可以互换的，矩形组件是一个矩形，它可以用来做很多的工作，比如页面上需要一块蓝色的背景，就可以用一个填充为蓝色的矩形组件，我们还可以用它来做页面布局，是最常用的部件之一。

✧页面布局：

指定区域宽、高，开始x、y的坐标位。

✧编辑成其它形状：

编辑成指定的其它形状，三角形、椭圆形、方括号等。

（选定矩形—>选择形状）

✧颜色填充：

用于背景和层次

✧输入文字

✧矩形的事件交互

如鼠标单击、移入、移出等。

2.2内联框架

内联框架是一个内嵌的元件，相对比较简单，实际效果类似增加滚动条，内嵌的可以是本地Axcure页面，表格、图片、网页、纯文本等。

✧内嵌本地Axcure页面

✧内嵌表格

✧内嵌图片

✧内嵌网页

✧内嵌纯文本

2.3热区

热区，顾名思义就是热点区域，可以设置整个区域的：

✧交互事件

✧跳转到层或者区域

热区可以粘贴为图片、表格、纯文字等。

2.4动态面板

动态面板可以实现高级的交互功能，一个动态面板有多个状态，在页面不跳转的情况下实现交互。

动态面板最常用的场景用来做：

✧Tab式页签的切换效果：

一般跟矩形元件搭配使用

例如两个Tab的切换

上面是一个动态面板和两个矩形元件（淘宝会员与支付宝会员）

✧用动态面板做弹出层（弹出窗口，如果用页面page，将操作不了载体页面的元件，达不到动态效果,做一个空的state状态的面板达到隐藏的效果）

动态面板控件的操作：

✧拖动态到设计区域

✧右击-》管理动态面板的状态

✧编辑每个状态的页面

✧制作矩形组件（或者文本组件）点击后设置动态面板的状态

2.5中继器

中继器（Repeater）是7.0版本新推出的功能，是目前为止Axure最为复杂的功能（没有之一）。

是动态存储数据的元件，最常见的用途是用来对表格动态的增删改操作。

举个例子：

下面是一个动态增加“潜在投融资”场景

操作如下：

Step1：

先添加一个表头及中继器

Step2：

编辑中继器，加入表格控件，在中继器的数据集中编辑列数据，用于动态显示数据

Step3：

设置中继器加载项动作

✧设置表格的一行，每个单元格对应的中继器的列

✧设置中继器每页项目数（即条数）

✧设置当前页

到这里，中继器数据集里的数据已经可以在中继器表格里展现了。

Step4：

设置动态添加

“保存”按钮的事件：

✧将对应的元件值设置到全局变量

✧增加“中继器”添加行的事件，同时设置添加行的对应列的信息（上述变量）

Step5：

动态删除

3母板使用

母版可以把项目中重复使用的部件集合起来，使用时直接拖拽便可，页面哪些元素用到母版，例如：

页头、页脚、导航条、一二级菜单、固定的模板等等。

母版的生成方式：

✧直接在母版功能区新建一个母版，然后在编辑模板

✧选中页面要素，右键—》转换为母版

母版的应用：

建立page，拖拽母版到设计区域即可。

4元件交互事件与注释

元件交互：

每一个元件都有可以添加的交互事件，比如鼠标单击、鼠标移入等，有一些公共的交互事件，即每个元件都具备，比如鼠标单击等，还有一些是特殊元件才具有的特殊交互事件，比如“选项改变时”事件是下拉列表、列表等元件才有的。

操作方式：

选中元件，在“元件交互与说明”功能面板区域中选中交互事件添加用例（Case）。

事件用例（Case）：

一个事件可以添加多个用例，用于界面原型展示，

如下图：

点击客户中心文本框，有两个用例，效果如下：

选中某一用例后，执行用例的交互。

元件的注释：

在此功能区还可以给元件添加注释，例如给“客户管理”Label添加说明后：

5元件的属性与样式

在“元件属性与样式”的功能区面板中设置元件的属性与样式：

5.1元件的属性：

这里设置选中元件的标签、注释、形状，以及交互样式（鼠标悬停、鼠标按下、选中、禁用等）

例如：

给Label标签“提醒”鼠标悬停的时候加下划线

5.2元件的样式：

元件的样式包括元件的大小（宽、高），位置（x、y轴）、字体、边框，填充等。

如下述Label的样式：

6页面属性样式与交互

页面属性功能区，可以设置页面的说明，页面的交互与页面样式。

✧页面说明：

可以给页面添加一些注释说明，生成原型文档后在文档中有体现。

✧页面交互：

可以添加页面总体交互事件，比如页面加载、页面窗口滚动、窗口尺寸调整、页面鼠标单击、双击等。

常用的是页面加载事件，如显示进度条等。

✧页面样式：

可以设置页面背景颜色、背景图片、页面字体等。

7自定义元件库

用户可以自定义元件库，在以后的页面设计中使用，比如将常用的元件组合定义成一个自定义元件，以后可以自己拖拽使用。

自定义元件库的步骤：

✧创建元件库：

在元件库功能区，创建一个元件库

✧编辑元件库：

在元件库功能区，选择某个元件库后，选择编辑元件库，在设计区设计元件。

✧使用自定义元件库：

在元件库功能区，载入元件库，元件库存放在\Axure\Libraries下

8原型发布

在“发布”菜单中可以对原型工程进行预览、生成HTML文件和生成WORD文档。

✧预览：

用浏览器打开页面原型预览效果

✧生成HTML文件：

指定一个路径，按照原型结构生成HTML文件，直接用浏览器打开演示。

一般原型制作完毕，将原型发给别人看，就是将这个文件夹发布出来，用浏览器打开其中的index或者start页面，即可看到原型的页面结构图，看哪一个页面点击即可。

（Chrome浏览器需要装一个插件才可以打开index或者start页面）

如下是用IE打开理财服务平台原型工程的start页面：

✧生成WORD文档：

指定一个路径，按照原型结构生成WORD文档，即原型规格说明书，文档描述页面结构、元件说明及交互事件等，在国内用的比较少。

默认生成的是如下的文档结构：

9Axcure使用好习惯

1、命名习惯：

在页面设计时，养成为每一个使用的元件命名的习惯，元件设计到交互都必须要有命名的。

10Axcure使用小技巧

10.1表格一行变色：

a）把一行的单元格，都设置选中事件填充某一颜色

b）点击某一单元格，添加一个case，将一行指定的所有单元格都设置成选中，达到点击一个单元格，达到整行变色的效果。

10.2交互改变元件样式

一般在交互事件中，比如点击，无法直接设置元件的属性和样式（在属性和样式功能区设置），一种变相的做法是，在交互事件中，将某一元件设置成选中，然后在属性和样式功能区设置元件选中状态下的想要的属性和样式。

10.3日期文本的显示

用普通文本框，文本框的类型改成日期型。

备注：

IE浏览器暂时不支持Axure自带的日期格式展现，GoogleChrome可以。

10.4内联框架父级窗口打开链接报错

在内联框架上不能添加事件“在父级窗口打开链接”，浏览器会报脚本错误，如下：

10.5获取下拉列表选项的值

下拉列表的值在被选项里，不是在元件里

10.6Case动作的执行顺序

在Case案例中，执行的操作是从上到下按顺序执行的。

欢迎您的下载，

资料仅供参考！

致力为企业和个人提供合同协议，策划案计划书，学习资料等等

打造全网一站式需求