第一节:操作界面介绍:轻轻松松学会Axure-【产品经理必备教程】

1、操作界面

Axure RP操作界面比较简捷,下图是Axure RP 主界面中各区块的简单描述,用户可以根据自身使用需求加载或伸缩各个辅助面板。
Shopping_Social_intelligence
主菜单和工具栏:在主菜单和工具栏中,可以执行常用的动作指令,例如:开启与储存档案、输出Prototype或Spec文件。

站点地图面板:站点地图面板将所设计的网页以树状结构的方式呈现,可以在这里新增、移除、重新命名和组织设计的网页结构。

组件选择面板:包含一系列常用的组件对象,也是默认自带的,例如:按钮、图片、文本块与矩形,可以直接通过拖拉的方式来设计网页。

模板选择面板:在这里可以新增、移除、重新命名和组织设计好的模板或者模块。模板是一种可以容纳多项界面元素的集合样板(Temlate),可以将常用的共享区块设计成模板,未来在设计界面时重复使用模板,来提高规划的效率。

主工作区:可以在这个窗格中设计网页信息元素,编排内容,设计界面,设计交互特性等等。未来可以将这些设计好的页面,输出成原型或需求规格说明书。

组件交互设置面板:交互的范围很广,从最基本的超级链接、鼠标事件,一直到动态显示和隐藏组件,可以在这个窗格中定义组件的交互。

组件注释区:可以为组件加上批注来指定功能,可以在这个窗格中增加和自订组件的批注。

页面注释区:可以在这个窗格中加入网页层级的说明与交互效果到设计中。

2、面板操作介绍
2.1 定义站点地图

设计一个网站或Web应用,在动手开始绘制网站页面的示意图或流程图之前,应该事先思考网站架构,并决定信息内容与层级。当心中已经有了比较明确的网站架构,接下来就可以利用站点地图面板来定义所设计的网站页面。站点地图面板是用来管理设计中网页的工具,可以新增、删除和调整网页层次结构。

新增/删除网页:想要新增网页的话,请点选工具栏上的“添加子页面”钮。在网页上按鼠标右键,然后选择“重命名”或慢慢的在网页上连续按鼠标左键两下可编辑网页名称。想要删除网页的话,请点选想要删除的网页,然后按下工具栏上的“删除”钮,或是在网页上按下鼠标右键,然后选择“删除”。

调整网页层级:可以将网页从某个树节点拖曳到目标父节点中来移动网页位置,也可以使用工具栏上的箭头按钮来上下移动网页,或改变网页的层级。

开启网页:在面板树上的任一网页上双击,网页会在主操作区中打开。

2.2 组件选择面板操作

组件(Widget)是用来设计页面的元素,可以在组件选择面板中找到一些常用的设计元素,例如:按钮,单选框,菜单等。
11

新增组件:只要从组件选择面板中将想要新增的组件拖曳到主操作区上就可以了,也可以在主操作区中以复制(Ctrl+C)与粘贴(Ctrl+V)的方式来新增组件。熟悉PowerPoint操作方式的用户刚开始可能不太习惯,因为Axure RP的操作方式类似Visio选择图形的作法,是利用拖放的方式,跟PowerPoint是不一样的。

移动组件:新增组件之后,可以拖放组件来移动位置,拖曳Widget四周的控制点来改变组件的大小,也可以一次选取多个组件,一次改变所有被选取的组件的位置和大小。除此之外,还可以在选取的组件上按下鼠标右键,使用快捷菜单来设定组件的群组(Grouping)、顺序(Order)、对齐(Align)、分散(Distribute)与锁定(Lock);也可以利用工具栏来做这些设定。

编辑组件:编辑组件的样式与属性有下列3种方式:

双击操作:在组件上双击可以变更一些基本的组件属性,例如:在图片组件上连续按鼠标左键两下可以加入图片;在下拉框组件上连续按鼠标左键两下可以编辑选单项目。

工具列:使用工具列可编辑组件的样式,例如:外框色彩、填满色彩、字型和字体大小。

快捷菜单(Context Menu):在组件上按下鼠标右键会出现快捷菜单,可以透过菜单中的选项来设定组件的特殊属性,这些选项也会因组件的类型而有所不同。

2.3组件注释和交互

可以为任何已加载组件加上批注,并可以根据需求自定义注释说明类型,注释可用来标记各个组件,也可对组件功能进行说明,方便生成需求规格说明书。

新增批注:想要给组件加上批注的话,先选择组件,被选取的组件呈现绿色框线状态,然后在组件注释区的 各个字段输入对这个组件的解释内容,也可以在窗格最上方的“标签”字段输入名称来帮组件命名。

自定字段:可以通过菜单“自定义—自定义字段和视图”来自定注释字段。

脚注(Footnote):加上注释后,组件右上方会多一个黄色小方块,里面有一个脚注号码(Footnote number),可以在组件的右键菜单上使用脚注次菜单来增加或减少这个编号数字。

交互:根据组件的不同,提供了部分鼠标事件的交互功能,可在需要的时候设置,如单击、鼠标移入移出等

2.4页面注释和交互

页面注释可以用来收集网页层级的描述或需求。

撰写页面注释(Page Notes): 页面注释会被保留在下方的窗格内。

管理页面注释类别:Axure RP本身预设的网页说明类别是default,可以透过新增额外的说明类别,轻易的区分出自己的说明与要输出到原型与规格中的说明。

页面交互:提供了页面加载事件的交互功能。

2.5模板选择面板
可用来定义各种经过重新编排或者设计好的模板或者模块,也可以将常用的共享内容设计成模板,对该面板善加利用,可以极大的提高设计效率。该面板的使用方式与站点地图面板类似。

其实还有两个小的角落大家可能会忽略,那就是模板选择面板和页面注释区下面的一行系统信息,这里显示的信息很重要,但是一般人却经常会忽视。信息栏左边显示的是文件保存情况。而右边显示的是所选择widget的高宽,以及距离页面顶部和左边的px距离,也就是提供了组件布局的像素信息,可以利用来排版或者提供给UI设计师做参考。