原型设计的工具-----AxureRP
1.原型设计的工具
目前能用于原型设计的工具有很多,其中有七种比较好。
(1) Axure RP
(2) Mockplus
(3) Justinmind
(4) Invision
(5) Flinto
(6) Proto.io
(7) Balsamiq Mockups
2.Axure RP的介绍
(1)Axure RP是一款专业的快速原型设计工具。Axure(发音:Ack-sure),代表美国Axure公司;RP则是Rapid Prototyping(快速原型)的缩写。
(2)Axure RP的工作环境:Windows、OS X
(3)Axure RP的功能特色:
·支持交互设计
·生成规格说明文档
·输出HTML原型
·版本控制管理
·支持多人协作设计
·母版功能
·支持动态面板和复用模板
(4)Axure RP的适用场景:视觉稿,高保真原型,大型复杂项目,Web线框图,网页原型
3.Axure RP的使用
3.1 Axure RP的界面环境
(1)熟悉主菜单和工具栏,如预览,分享,发布,自动生成原型,打开文件,保存文件等等。
(2)站点地图面板:对所设计的页面(包括线框图和流程图)进行添加、删除、重命名和组织页面层次。
(3)控件面板:该面板包含线框图控件和流程图控件。
(4)模块面板:一种可以复用的特殊页面,在该面板中可进行模块的添加、删除、重命名和组织模块分类层次。
(5)线框图工作区:线框图工作区也叫页面工作区,线框图工作区是你进行原型设计的主要区域,在该区域中你可以设计线框图、流程图、自定义部件、模块。
(6)页面注释和交互区:添加和管理页面的注释和交互。
(7)控件交互面板:定义控件的交互,如:链接、弹出、动态显示和隐藏等。
(8)控件注释面板:对控件的功能进行注释说明。
3.2 Axure RP的界面功能
(1)页面的添加、删除和重命名
在面板工具栏,点击“Add Child Page”按钮,可以添加一个页面;点击 “Delete Page” 按钮可以删除一个页面;右键单击选择“Rename Page”菜单项可对页面进行重命名。
(2)页面组织排序
在页面导航面板中,通过拖拉页面或点击工具栏上的排序按钮,可以上下移动页面的位置和重新组织页面的层次。打开页面进行设计在页面导航面板中,鼠标双击页面将会在线框面板中打开页面以进行线框图设计。
(3)添加控件
在一个线框图中选择控件,按Ctrl+C,然后在另外一个线框图中按Ctrl+V。
(4)操作控件
添加控件后,在线框图中点选该控件,然后可以拖拉移动控件和改变控件的大小,还可以一次同时对多个控件进行选择、移动、改变尺寸。另外,还可以组合、排序、对齐、分配和锁定控件。这些操作可通过控件右键菜单中进行,也可在Object 工具栏上的按钮进行。
(5)添加注释
在线框图中选择控件,然后在控件注释和交互(Annotations and Interactions)面板中编辑字段中的值,即可为控件添加注释。面板顶部的 Label 字段是为控件添加一个标识符。
(6)添加页面备注
在线框图下面的Page notes 面板中可以添加页面备注内容。
3.3 Axure RP的交互设计
(1)用户操作界面时就会触发事件,如鼠标的 OnClick、OnMouseEnter 和 OnMouseOut;
(2)每个场景可执行多个动作,例如:打开链接、显示面板、隐藏面板、移动面板。
(3)在按钮控件上定义一个链接:
·拖拉一个按钮控件到线框图中,并选择这个按钮;
·控件交互面板中鼠标双击“OnClick”这个事件,这时会出现“ Case Editor(OnClick)”对话窗,在这个对话框中可以选择要执行的动作;
·在“Step 2”中,点击“Open Link “ 再点击” Current Window”动作。
·在“Step 3”中,点击“Link”,在弹出的Link 对话框中可以选择要链接 的页面或其它网页地址 。
(4)设置动作
·Open Link in Current Window:在当前窗口打开一个页面
·Open Link in Popup Window:在弹出的窗口中打开一个页面
·Open Link in Parent Window:在原窗口中打开一个页面
·Close Current Window:关闭当前窗口
·Open Link in Frame:在框架中打开一个页面
·Set Panel state(s) to State(s):为动态面板设定要显示的状态
·Show Panel(s):显示动态面板
·Hide Panel(s):隐藏动态面板
·Toggle Visibility for Panel(s):切换动态面板的显示状态(显示/隐藏)
·Move Panel(s):根据绝对坐标或相对坐标来移动动态面板
·Set Variable and Widget value(s) equal to Value(s):设定变量值或控件值
·Open Link in Parent Frame:在父页面的嵌框架中打开一个页面
·Scroll to Image Map Region:滚动页面到
·Image Map 所在位置
·Enable Widget(s):把对象状态变成可用状态
·Disable Widget(s):把对象状态变成不可用状态
·Wait Time(s):等待多少毫秒(ms)后再进行这个动作
·Other:显示动作的文字说明
4. Axure RP与手机share
在手机上下载一个Axure Share APP,将在Axure RP设计好的原型share上传,然后用你的账户在Axure Share APP上登陆,就可以预览你设计好的原型了。