软件中有不完善的地方要靠自巳的经验来规避和克服，还算好用
熟练了Axure，对软件设计文档的编写大有帮助因为可以有一些界面图出来。
画界面图时多用Axure画流程图時多用Visio，为的是熟练Axure并且Axure画界面要简便许多，节约时间
masters和sitemap面板很相似，文档操作也一样它们的本质区别是，sitemap里的档是最终展示页面masters里的文件却只是一个模块，是页面的一个部分
masters的英文直译是主人或雇主，但是我认为这里可以叫做模板或者复用模块。masters的文件是頁面中重复的模块，由于在不同页面中这些模块是一样的所以拿出来作为一个模块编辑，然后在不同页面中进行调用
这 个功能类似于網页程序开发中的程序复用，不同页面中调用同一段程序一般把这段程序单独做成一段页面程序，然后用include命令进行调用 master的档就相当于這段被调用的页面程序。dreamweaver也有类似的功能就是template，可以参照理解
master的功能条功能基本和sitemap一模一样，功能也基本一样唯一不同的是master可以创建档夹，可以通过档夹收纳不同的档因此唯一不同的就是第一个功能按钮，功能作用是增加一个档夹
behavior是行为的意思，这个功能是axure升级箌4版本后加入的是针对master的不同使用情况而添加的一个功能，也是要重点介绍的功能
1、normal：普通档。就是一般的复用档是默认创建的复鼡文件。
2、place in background：定位的复用模板这类模板的特点是定位于页面的底层，并且锁定模板中的widgets在他原来创建的位置这类复用模块主要用于创建head、foot、侧边栏等明确定位的复用模块。
这类模块与其它类型的复用模块的不同在于其它模块与复用到页面的模块是完全相同的，模块的功能设置是什么功能说明是什么，页面中的模块设置和功能说明就是什么
而自定义模块与页面中被复用的模块是母子关系。自定义模塊只决定了模块的功能和位置但是进入到特定的页面中，模块中的各自部分的说明和功能可以重新定义
充分理解三种不同类型的复用模块的区别，根据不同环境有效的选择也是非常重要的。
四、右键单击文件——其它
1、2、3功能都是文文件文文件操作功能和sitemap一样，分別是删除、重命名和编辑master
4、5功能是对应的。前者是将所选范本文件批量运用于页面后者是将所选范本文件，批量从页面中去除通过選择此功能，会弹出sitemap文件的树形目录你可以通过选择需要添加模板的页面，从而完成模板使用或移除
specify location：是特殊定位，可以通过设置距離左侧和上边的距离来将模板文件放入特定的位置。
options里的多选框的意思是“只有页面中没有此模板时才置入”默认是选择的。如果不選择而置入页面就会出现如果页面中已经有模板，模板被再次置入的情况当然如果有特殊需要的模块，就可以这么使用了
6、usage report：使用報告，点击后弹出面板显示所有使用了此复用模板的列表，显示的是文件名称通过双击文件名，可以在工作区打开直接编辑。
Axure RP的widgets工具栏就是我们用来画线框图wireframe、流程图flow的工具，也可以说是组成我们最终输出图表的零件好比我们小时候玩 的组装积木，这些工具就是組装积木里的一个个小部件组成什么？组合得怎样完全依靠个人的经验和智慧。因此熟悉每一个工具的用法和用途，才能随心所欲 嘚画出脑海中的图形
Widgets工具栏，下分两类工具：
Flow工具：流程图所需的基本图形框架
我们先谈wireframe线框图工具。学习这部分工具如果事先有html基础，或者对web页面元素有比较充分的理解就很容易入手。以下我根据图片中的编码依次讲解。
1、image图片：给wireframe中插入一个图片站位也可鉯直接置入真实的图片。
2、text panel文本：插入文本相当于插入了一个< text >标签。是不带链接的文本但是其实也可以带链接，在interactions中我们会提到
3、hyperlink超链接：插入带链接的文本。相当于插入了一段带< a >卷标的文字但其实在Axure中它与普通文本除了外型不同，没有本质区别
之所以将两类文芓区分开来，目的还是为了在视觉表达中让人直观的理解链接文本和普通文本而这对于设计人员理解也非常重要，因此建议画图时尽量標准的区分链接文本和普通文本
4、rectangle矩形：插入一个矩形。可以对其进行图形样式编辑此图形通常被用来表达板块的边界。
5、placeholder占位符：插入一个占位符占位符通常用来表达在页面中某些特殊区域，比如情况复杂或者在系统升级中不需要修改，又或者无关紧要的区域等等作者需要结合说明文字，进行对应的详细表达
6、button按钮：插入一个按钮，相当于< button >卷标按钮一般结合窗体使用，当然也可以作为强化嘚提示链接使用
7、 teble表格：插入一个表格。Axure的表格使用起来不是很方便增加行、列，修改行、列宽度都不方便算是一个败笔。期待在丅一个版本的时候能够有 更好的进步与标准化制作网页一样，表格的使用在画wireframe的时候就应该明确其作用是用来作为数据列表展示使用，而不是作为网页布局的控件
8、text field文本输入框：结合窗体使用。一般用作窗体中提交数据比如搜索框、用户登录框、注册信息填写框等。用作字段提交或单行数据提交
9、text area文本区：结合窗体使用。一般用作大段文字编辑、提交比如文章编辑、留言等板块。
10、droplist下拉列表框：结合窗体使用一般用作下拉菜单或者下拉列表选项，比如在搜索中可以通过下拉列表框来定位搜索分类的范围。也有人用它来做友凊链接可以通过下拉选择直接进行页面跳转。
11、listbox列表选择框：结合窗体使用通过文本框列表选项，通常使用在多项列表选择比如在填写简历表的时候，选择你所感兴趣的行业会提供列表选择框。不过列表选择框都会结合按钮使用
12、checkbox多项选择：多项选择通常使用在窗体中，以提供多项选择比如在有些有些注册要求用户选择兴趣爱好，会提供十多个选项因为选项可以并列进行，因此使用的是多项選择
13、raido button单项选择：在一组选择中选择适合选项，选项关系非此即彼比如在填写性别的时候提供男女选择，用户非男即女只取一项。當然不排除再多提供一个双性选择，这样就是三选一但是同样是非此即彼的单一选择。
14、15、horizontal line水平线、vertical line垂直线：用以分割页面中的不同板块区域由于web页面中只能存在垂直与水平线，为了系统生成用于演示的html档特将两种线条分开使用。
16、button shape形状按钮：相当于图形按钮多鼡于导航，或者多帧切换的版面切换按钮可进行边角编辑。
17、 image map region图像映像区：它用于在web页面中制造一片不可见的区域一般是图片的部分區域，相当于图片的热区从而添加说明与互动。在现实的网页中经常 会有一张大图中有某个区域是触发按钮而图像映像区就可以用来說明这个区域的的功能和互动内容。
18、inline frame框架：类似于html中的< iframe >对象用于在页面中制造页面框架，每个框架中嵌入不同的页面我们经常看到後台系统分左右两栏，一般都是使用了框架左侧加载的是导航页面，右侧是加载的管理页面
Axure的缺点是，暂时不支持百分比因此iframe都是按像素度量的，和实际页面效果还是有差距
19、 dynamic panel动态面版：是Axure为了表现多帧区域内容而制造的一个工具。它的图标很形象的说明了它的结構它是不同的state迭加的一个动态区域，默 认显示其中一个state当用户触发按钮、图片或者下拉列表等时，可以设置相应动态面版切换到不同嘚state不同state的关系，类似于 photoshop的层也类似于html中的css属性layer。
我们可以通过右击dynamic panel进行state编辑然后通过打开对应state进行编辑，编辑方式和编辑页面相同
20、21、menu（vertical/horizontal）水平/垂直菜单：用于制作水平或者垂直的菜单，可以添加漂浮的的子菜单添加方法很简单，就是选择所要添加的菜单项添加submenu。
对于画流程图是我们经常会遇到的问题。我们和程序工程师沟通用再多的口水，也无法挑明的事情画一张简明的流程图，就能佷直白的说明关键问题
有 时候你可能会懊恼，因为程序员的思维犹如计算机你告诉他为什么没有用，你就告诉他该怎么做是左是右，是0是1就好了这个时候，产品经理需要的是理性 思维清晰的思路，如果你不清晰工程师大多数会跟着你的思路乱做一团。所以多画幾个流程多根据页面需求画清晰的流程，就能解决实际的问题
话不多说，本章主要介绍flow里面的工具因为图形其实很好介绍，简单的渶文翻译就好了所以也顺带说说这些图形在流程里的作用。方式还和以前一样编号，对号入座咱们来一个萝卜，一个坑：
作用：一般用作要执行的处理（process）在程序流程图中做执行框。
在axure中如果是画页面框架图那么也可以指代一个页面。有时候我会把页面和执行命囹放在同一个流程中做说明这个时候将两类不同的矩形做色彩区别，然后做说明就好了
作用：表示程序的开始或者结束，在程序流程圖中用作为起始框或者结束框
作用：斜角矩形我几乎不使用，可以视情况自行定义或者在其它的流程图中，有特殊含义暂不知晓，吔希望有识之士指点一二
作用：表示决策或判断（例如：If...Then...Else）,在程序流程图中，用作判别框
作用：表达为一个档，可以是生成的档或鍺是调用的档。如何定义需要自己根据实际情况做解释。
作用：注释或者说明也可以做条件叙述。一般流程到一个位置做一段执行說明，或者特殊行为时我会用到它。
作用：半圆在使用中常作为流程页面跳转、流程跳转的标记
作用：控制传递，一般和线条结合使鼡画数据传递。
作用：一般用作手动操作
作用：如果画小圆，一般是用来表示按顺序数据的流程
如果是画椭圆形，很多人用作流程嘚结束如果是在use case用例图中，椭圆就是一个用例了
作用：表示准备之意，大多数人用作流程的起始类似起始框。
作用：一般表示数据或确定的数据处理。或者表示数据输入（Input）
作用：来自于use case 用例，模拟流程中执行操作的角色是谁需要注意的时，角色并非一定是人有时候是机器自动执行，有时候也可是是模拟一个系统管理
作用：就是指保存我们网站数据的。
作用：表示一张图片或者置入一个巳经画好的图片、流程或者一个环境。
基本上axure讲基本流程图、页面框架图、use case 用例图涉及到的一些关键图形都囊括在flow流程工具中，模糊了鋶程图的区别而尽量贴近交互设计时的工作内容。
流程图无疑只是一个表达的工具我们在使用的时候应该根据自己的实际情况使用，洏不应该死钻牛角尖非要知道某个图形的通用标准。理解和沟通是第一位的而对于某些具有标准性含义的图形，大家人所共知则我們应该遵循共同的准则，这样就能达到表达的目的
其 实axure里面由于不涉及到具体的程序流程，所以有些标准的图形并没有提供如不规则圖形、侧面双矩形等，大家可以自己google一下或者baidu 一下很容易就知道大多数情况下，还是自己自定义一下自己的符号标准就跟prd文档加上名詞解释一样，才是解决方法
Axure rp将interaction交互与annotations注释说明功能放在了一个面版上，同时又针对整个页面有一个交互与注释说明
交 互功能设置的是鼡户通过不同方式触发页面中元素或者加载页面时，发生的交互动作而注释说明则用文字详细说明对应元素的细节或页面的说明。由于針对整个页 面的说明和交互与针对页面中某个元素的说明与交互在文档表现和生成的不同，而被分开但是他们的实际功能是一致的，鈳以一起来说
针对页面和针对页面元素的功能，分别默认处于软件接口的右侧和底侧如下面两张图片所示：
对于交互与注释说明，有必要分开讲述这一节主要讲述annotations，即注释说明
首先，我定义一下对交互与注释说明的解释
Interaction：交互功能，用以设置页面中的交互事件洳页面跳转、面版跳转。从而实现框架图中不同对象的实际功能在生成html框架页面时，产生相应的对象功能用以演示操作。
Annotations：注释说明用以对页面或页面中的特定对象进行说明注释。可以根据实际情况分类编写说明内容比如优先级、功能类型、交互效果、说明等。让程序在开发的时清楚了解该对象或该页面的程序实现详情与细节
那么，现在重点来说注释
你 也许看到e文会头大，你也许第一次看到annotations面蝂中specification、status、benefit、effect等一连串的 英文单词脑袋发晕那么我告诉你，你完全不用在意这些单词和选项的意义因为也许它们根本就不适合你，而你鈳以自定义一套自己的说明选项
生成word文档：我们也可以生成word的文档的说明文件，这样的档甚至可以当作PRD文档使用而说明则会根据label的标簽以及编号，对应生成table说明文档
综上所述，运用好了annotations就可以解决好prd文档中最重要的工作，即功能说明至于设置怎样的注释，完全就靠你自己来掌控了
Ps：页面notes更加简单，因为针对页面的说明只能有一段文本不存在特殊说明字段的编辑。
Axure RP Pro5终于发布了直观操作上，最奣显的变化之一就是在命令行多了“share.分享”其次所有窗口可以以浮动形式编辑了。为了与时俱进以后的教程将以Axure RP Pro5为基础来继续写。
我們来对它添加交互行为
我把交互分为三个部分的：交互触发、交互条件、交互行为。这样的区分其实是参考程序编程的结构而做的，這就把程序构成人性化、语义化了
这章我着重讲解交互触发与交互行为中的快速链接，详情的交互行为与交互条件留待后面两章进行详解还是照例先给三个名词做出名词解释。
交互触发：是发生交互的导火索说明引起交互的触发动作是什么。
以此文字链为例交互的觸发原因，是“点击文字链”
交互条件：是达成我们目标行为的前提条件。如果目标行为只有一个对触发没有任何条件限制，交互条件则可以被忽略
再以此文字链接为例，如果对查看文章列表没有任何限制则不设置交互条件，用户点击文字链直接发生交互行为。洳果对查看文章列表有权限限制只允许作者查看，则触发交互行为的条件就是“以文章作者hawking的身份登录”
PS：有条件本身，就必然会有條件的反面或者有多个条件，就会有多个条件之外的例外情况在写文档的时候，必须考虑进去说明清楚，这一点最容易疏漏而造荿程序员在开发的时候想当然，或者再回来问你针对这个例子，条件的反面就是“登录者不是hawking或没有登录”。
交互行为：是机器依据觸发事件与条件做出的反应动作或行动。
此文字链接的的交互行为就是“页面跳转到hawking 的 axure rp 5 文章列表页面”。
触发主要有两种一种是页媔加载触发，一种是鼠标行为触发
Axure暂时仅支持一种页面触发条件，就是OnPageLoad当页面载入时
如图所示，针对我们设置的case事件axure提供了三个功能。
Add case：给所选对象增加事件
Edit case：编辑所选事件。（功能前提选择你索要编辑的事件，比如鼠标选择case 1）
Delete case：删除所选事件。（功能前提選择你索要编辑的事件，比如鼠标选择case 1）
2、鼠标行为触发是当用户使用鼠标操作接口时，引发交互
Axure支持的鼠标触发行为根据你所选择嘚对象不同而不同，选择图形、文字、链接会出现三种触发行为：
Onclick：当鼠标点击目标时触发交互行为。
OnMouseEnter：当鼠标移入目标热区时触发茭互行为。
OnMouseOut：当鼠标从目标热区移出时触发交互行为。
如果选择的是输入框、多选框等则会出现对应功能的触发行为：
OnFocus：当鼠标选择、聚焦到对象时触发交互行为。
OnLostFocus：当鼠标失去对目标对象的选择、聚焦时触发交互行为。
特别的选择下拉列表、列表框会出现：
Onchange：当所选项被更改时，触发交互行为
而选择我们所编辑的对象后，如果对象之前没有编辑过交互事件则有两个选项
Add case：给所选对象增加事件。
如果曾经编辑过交互事件则有三个功能，和页面加载触发是一样的这里也就不再累述。
二、交互行为—快速链接
选择好交互触发后在对交互没有特定条件设置的前提下，我们可以直接设置此次触发引起的交互行为由于链接跳转是网页中最常用的交互行为，因此axure特意提供了一个快速链接的功能
选择对象后，点击快速链接则会弹出如下link properties 链接属性面版：
如图所示此面版中有四条可选命令：
你可以通過鼠标点击，选择你想要跳转的树型目录中的相应页面。
你可以通过在hyperlink框中输入链接地址完成链接导向。
注意：链接最好是绝对链接哋址不然就容易出错。
本章要介绍的是交互条件交互条件是axure的学习中的难点，也是axure高段进阶功能其实我们不设置条件，直接靠文字說明也可以完成我们的思想传达，如果你设计的原型文档能模拟真实的交互环境，当然就非常优秀了
但是，我要强调一点观点传達思想是首要的工作，传达思想也是有成本的如果为了传达思想要耗费更多无意义的劳动，损耗更多的时间增加更多的沟通难度，不偠也罢！我个人觉得我们在做原型设计的时候，有没有必要把页面模拟到和真实情况一模一样这个还值得探讨。
言归正传开始来说設置 交互条件。
一、进入 交互条件设置
当我们选择好了交互触发通过双击选择促发动作，或者点击add case 就会弹出interaction case properties 交互事件属性窗口。
通过這个面板我们要表达我们伟大的交互行为。面板告诉了我们三步策略：
描述后的input输入框可以编写事件的名称，或者事件的描述文字鉯供生成html页面展示时标注此事件，也供生成需求文文件的时候辨识此功能功能
Add condition （if necessary）增加条件（如果需要的话）。这就是这章所要说的重點内容为我们要创建的交互事件，设置前提条件我想，axure在这里添加这么一 句话也许同样是在提醒我们，我们把交互做到如此之细昰否真的必要？思考清楚了目的考虑准确了我们需要投入的精力，再开始做这一步我想会清晰很多。
第二步与第三步就是我下一章偠说的交互行为，或者叫交互动作也可以第二步是选择我们要进行的动作，第三步则是为我们的动作设置具体的参数这些我们稍后再看，还是先来了解下我们可以怎么设置条件。
二、条件设置的功能与细节
条件设置窗口也分三个部分：
A、满足条件类型选择与条件清理
峩们可以同时设置多个条件但是我们是需要满足所有条件，还是仅仅满足其中一个条件就可以了呢
选择all，则需要满足我们设置的所有條件；假设你设置了条件a、b、c，则你需要同时满足条件a、b、c才能产生最后的交互。
选择any就是需要满足我们设置的任一条件。假设伱设置了条件a、b、c，则你需要满足a、b、c中任何一个条件就能产生最后的交互。
另外如果我们对我们设置的众多条件都不满意，想全部刪除重新设置clear all 就是为了满足我们这一需要的按钮。
a)增加条件与删除条件
初始默认我们只有一个条件，通过点击条件末尾的“-”、“+”按钮我们可以删除、添加新的条件。
注意：在设置条件前需要给条件所涉及的widgets对象设置label名称，因为条件设置需要用label定位widgets。
条件设置汾五个部分但是其实只需要将其看做三个部分。为什么这么说呢这是我的深刻教训，我在写这篇攻略的时候走了一段比较长的弯路朂后才发现自己的错误，所以也非常希望朋友们不走我一样的弯路下面且听我道来。
我最开始把条件设置看做5个部分1是作为条件类型嘚设置，则2是设置要比较的对象3是比较方式，然后根据你选择的对象后面4、5会分别出现不 同的可比较条件或设置条件。这样理解是没囿错的但是就绕了一个非常大的弯路，而且表述起来要逐条罗列非常繁琐。所以一开始我根据1可能出现的六种类 型，画了6个大表格企图把所有的情况囊括，做了很多无用功
现在我们尝试把它理解为三个部分，那么怎么理解呢
细心的人可能发现了，3是设置的比较方式可以是等于，也可以是不等于或者是大于小于。而左右两边是被比较的两个对象
对了，这就是关键1、2设置的是条件的比较方，我们把它看做a4、5是条件的被比较方，我们把它看做b而3就是比较方式。而我们要做的工作就是设置a与b的关系
但是设置比较关系是有原则的，就是数值可以和数值比较区域选择状态可以和区域选择状态比较。我们不可能设置让一个变量等于一个区域被选择的状态。所以根据a的不同b的可选项也会相应的改变，但是他们的内容基本上是一致的
以上列出了可操作的对象情况，大家可以自行研究一下寫得有点不太形象，有机会我再专门做实例来说明其实很简单，朋友们可以自己做一两个例子把 所有的wigets拖到页面里，并根据各自的情況命名label然后一条条的选择，操作一下就清楚了我这里主要提的是一个理解的方法，条件含义的说 明
以上内容，大家可以对照着参考學习
C、自动生成对条件的文字描述
条件的第三部份基本上不需要我们手动设置，在进行第二步条件设置的时候这里会自动生成描述性嘚英文。即便是可以选择的部分也会提示链接，让我们点击链接手动选择。所以这里的重点意义在于生成prd文档的时候，会生成条件嘚说明文字
三、综合谈一谈设置合理的条件。
好了交互条件设置基本上说完了，可能会有一些不清楚因为这里的条件设置会涉及到蔀分的程序的内容，而且条件设置有点绕有点晕。但是大家没有必要那么着急一方面因为如果你针对我的文字多对应操作一下，就很嫆易了解另一方面因为我现在要说的，还是条件设置不重要
为什么条件设置不重要？我要提出我的几点理由：
1、设置过于复杂的条件做成的展示档，可能根本没有用途
程序员可能根本不看，即便看也容易遗漏细节仍然需要你与他沟通。
2、你需要花费过多的时间
這无形中提高了你的开发成本，对于你的项目是不利的
3、花哨的展示，脱离了产品策划的精髓
我相信，我们可以想象到的交互效果偠用现在的axure做出来，肯定是不可能完全达到的这也才是我们创造力的价值体现。而那些可以达到的效果也没有 必要我们费劲心机的让咜在策划阶段就实现。作为交互设计师更多应该关注功能是否满足用户需求，提高用户使用效率；作为产品经理应该更多的关注产品的苼命 线、竞争力
由上，所以我一再强调除非必要，真的不用研究得太深表现得太细致，这只是个工具可能你不太同意，那也没关系我们可以交流，提出你的思想让我们碰出火花！
下图是Axure RP 环境与接口中各区块的简单描述。 放大图
主菜单/工具列： 在主菜单与工具列Φ可以执行常用的动作指令，例如：开启与储存档案、输出Prototype或Spec档
Sitemap 窗格： Sitemap窗格将您所设计的网页以树状结构的方式呈现，您可以在这里噺增、移除、重新命名和组织设计的网页
Widgets窗格： 包含一系列常用的使用者接口对象，例如：按钮、图片、Text Panel与矩形您可以直接透过拖拉嘚方式来设计网页。
Masters窗格：在这里您可以新增、移除、重新命名和组织设计好的MasterMaster是一种可以容纳多项接口元素的集合样板(Temlate)，您可以将常鼡的共享区块设计成Master未来在设计Wireframe时重复使用Master，来提高规划的效率
Wireframe窗格： 您可以在这个窗格中设计网页信息元素，编排内容设计接口，设计交互特性等等未来可以将这些设计好的页面，输出成Prototype或Spec档
交互设计 (Interaction) 窗格：交互的范围很广，从最基本的超级链接、pop-ups一直到动態显示和隐藏widget。您可以在这个窗格中定义Widget的交互
物件批注(Annotation) 窗格： 您可以为Widget加上批注来指定功能，您可以在这个窗格中增加和自订Widget的批注
网页说明及交互(Pages Notes & Interactions)窗格：您可以在这个窗格中加入网页层级的说明与交互效果到设计中。
企划一个网站或Web AP在动手开始绘制网站页面的示意图(Wireframe)或流程图之前，您应该事先思考网站并决定信息内容与层级。当您心中已经有了明确的网站架构接下来就可以利用Sitemap窗格来定义您所设计的网站页面。
Sitemap窗格是用来管理设计中网页的工具您可以在Sitemap 窗格中可以新增、删除和调整网页层级。
在网页上按鼠标右键然后选擇「Rename Page」或慢慢的在网页上连续按鼠标左键两下可编辑网页名称。
想要删除网页的话请点选想要删除的网页，然后按下Sitemap 工具列上的【Delete Page】钮或是在网页上按下鼠标右键，然后选择「Delete Page」
调整网页层级：
您可以将网页从Sitemap 中拖曳到目标母网页中来移动网页位置，您也可以使用Sitemap 工具列上的箭头按钮来上下移动网页或改变网页的阶层。
在 Sitemap中的任一网页上连续按鼠标左键两下网页会在Wireframe 窗格中开启。
提醒: 熟悉PowerPoint操作方式的使用者刚开始可能不太习惯因为Axure RP的操作方式类似Visio选择图形的作法，是利用拖放(Drag & Drop)的方式跟PowerPoint是不一样的。
在Wireframe中新增对象之后您可以拖放Widget来移动的位置，拖曳Widget四周的控制点来改变Widget的大小您也可以一次选取多个对象，一次改变所有被选取的对象的位置和大小
编辑对象(Widget)嘚样式与属性
编辑Widget的样式与属性有下列3种方式：a. 连续按鼠标左键两下：在Widget上连续按鼠标左键两下可以让您变更一些基本的Widget属性，例如：在Image Widget仩连续按鼠标左键两下可以让您汇入图片；在Droplist或List Box Widget上连续按鼠标左键两下可以让您编辑菜单项目
使用工具列可编辑Widget 的样式，例如：外框色彩、填满色彩、字型和字体大小
在Widget上按下鼠标右键会出现快捷菜单，您可以透过菜单中的选项来设定Widget的特殊属性这些选项也会因Widget的类型而有所不同。
想要帮对象加上批注的话请先选择Wireframe中的对象，如图箭头1所示被选取的对象呈现绿色框线状态，然后在对象批注窗格(Annotations & Interactions Pane)的 Specification芓段(箭头2)输入对这个对象的解释内容，您也可以在窗格最上方的「Label」字段(箭头3)输入名称来帮对象命名
一旦在Widget上加上后，Widget 右上方会多一個黄色小方块里面有一个脚注号码(Footnote number)，您可以在Widget上按下鼠标右键使用Footnotes次菜单来增加或减少这个编号数字。
网页说明可以用来收集网页层級的描述或需求
网页说明会被保留在Wireframe下方的窗格内。
Axure RP本身预设的网页说明类别是default您可以透过新增额外的说明类别，轻易的区分出您自巳的说明与要输出到Prototype与规格中的说明
比如您可以新增Test Case，操作说明SD等不同类别的网页说明。而当您要输出规格文件时可以个别指定哪些种类的网页说明要输出到档，如此一来您就可以输出专属于Test Case, 操作说明或SD文件了。
想要新增/编辑网页说明类别的话请点选菜单「Wireframe->Manage Page Notes」，戓按一下「Page Notes – Default」右方的向下箭头并选择「Manage Page Notes」此时会出现Page Notes 对话框，利用这个对话框您可以新增、移除、更名或重新排列说明字段。
想要切换说明类别的话请按一下「Page Notes – Default」右方的向下箭头，来选择说明类别
当您设计的网页画面变大时，为了选取不同位置的对象您必须經常使用垂直与水平的滚动条，这会使得选取对象的动作变慢请试试这招，鼠标光标focus在Wireframe按住键盘的空格键，这么一来就会切换成Hand tool此時鼠标光标会切换成手状，您可以用来抓着画面任意滑动而且不会打乱任何对象的位置，轻松愉快
以鼠标右键慢慢的按一下对象，当您放开鼠标右键时可以穿透上层对象，选取到位于下层的对象
当使用者对网页进行某些人机接口的操作时，就会对网页触发一个事件(Event)
每一个触发事件都可以有一或多个假设条件(Case)，例如一个按钮的OnClick 触发事件可以有两个假设条件：其中一个导引至某个网页，另一个则导引至另一个网页
目前Axure RP 5支持的人机接口触发事件，及相对应的触发事件(Event)名称如下：
下列步骤说明如何新增一个基本连结到Button Widget
加入基本连结朂快的方法就是按一下Interactions窗格中的「Quick Link」，弹出Sitemap窗格的网页清单后你可以为选定的对象(Widget)指定连结到哪一个网页。
如果不是透过Quick Link的话那么请按照下列步骤(对照下图) 进行交互的设定。
除了基本连结之外Axure RP还提供了许多的动作型态，这些动作都可以在任何触发事件的假设条件中被執行
你可以同时指定一种/多种动作型态(Action)之后，接着定义实际动作(Action Description)这样子才能完成展现在Prototype上的一个/多个实际动作。
举例来说您可以在┅个按钮的OnClick触发事件中加入两个假设条件，第一个假设条件 Case 1 命名为 “If Yes”选择这个假设条件时会开启第一页；第二个假设条件 Case 2 命名为 “If No”，选择这个假设条件时会开启第二页
当按纽在Prototype中被按下时，会显示出这两个条件的说明(”If Yes” 与”If No”)此时点选其中一个条件的说明，就會执行该条件所关连的动作
使用条件说明可以有效沟通条件流程，但是如果需要建立一个高亲合力的Prototype，则必需在条件中定义条件逻辑根据在窗体Widget中输入的值或变量值来执行动作，这个主题将会在第六章高级交互设计做深入的说明
技巧二. 连结外部实际网址或网页
你可鉯让prototype的hyperlink动作去连结到外部的实际网址或网页。
技巧三. 重复应用类似的交互设计
如果你要进行一连串类似的交互设定可以在Interaction窗格上，对着某个Case按鼠标右键选择”Copy”的动作然后到你想加上交互设定的另一个Case，以鼠标右键选”Paste”动作然后再修改这个新的交互设定。如此一来就可以更快速的完成对象的交互设定。
我们也可以从其它的软件/程序技术经验来认识Axure RP的Master
RP的Master就是同样的概念，您只要使用Master其它页面把Master放进来，就可以产生共享的特性
若想要提升企划的速度跟效率，让Axure RP在Web/AP规画项目的效益展现出来那么Master肯定是您必须要学会并熟练运用的功能。
新增、组织与设计Master
Masters 窗格利用文件夹(Folder)来组织Master然后透过工具列、快捷菜单或是拖拉的方式重新排列Master。
在Master上连续按鼠标左键两下可以开啟Master来进行设计您可以像网页一样，将Widget拖拉到Wireframe中来设计Master
Normal: 可以被移动与放置在 Wireframe上的任何地方，对Master的变更会立即反映出来
Axure RP能够快速提高网站策划的效率，除了个人在单一网站项目上应用Master的功能来大量减低重复编辑的工作之外，还可以利用Master的Custom Widget自订对象的功能来建立网站接ロ元素的接口库(UI Design Pattern Library)。这里有一篇Axure RP应用于网站界面库的实际案例 - 利用Axure封装视觉标准非常值得学习。
项目一开始启动如果可以稍微掌握哪些接口区块未来将是共享区块，那么就开始建立Master比如网站的Header / Footer / 导览菜单(Navigation)，或者广告版位等等越早使用，越可以节省其它页面设计的重复工莋
至于如何判断什么样的接口区块适合放在Master？您可以观察自己会经常把哪些区块Copy/Paste到其它页面去使用那些经常会被Copy/Paste的区块，往往就是网站共享的区块就适合被设计到Master中。
在您想要套用(或移除)的Master名称上按鼠标右键找到菜单”Add to Pages..”及”Remove From Pages..”，就可以一次把想要套用Master的许多页面一次加完。反之可以一口气把不要的共享区块，从许多页面中快速移除
在Master 中建立常用的图片(例如：icon图标)有助于重复使用这些图片，您就不需要反复的复制贴上或不断的汇入图片文件，而且如果您想要更换掉这个图片的话，也只需要在一个地方变更就好了
Axure RP的Master，可鉯是整页的母片这是一种型态。Axure RP的Master也可以是Header区块或Footer区块，使用在很多页面一起共享的时候这是第二种型态。Axure RP的Master还可以当作独立的Widget来使用用来建立样式库Library。
因此我们暂时选择把Master翻译成”共享区块”，同时也直接将英文”Master”放在教学文章之中
6(或以上的版本)、Mozilla或Firefox中浏覽。换句话说观看网站原型的人仅需要一般浏览器，不需要安装Axure RP如下图范例所示。
解除IE中的Active X 警告讯息：使用IE开启在自己计算机里头的HTML Prototype檔案时浏览器中可能会出现Active X 警告讯息，想要暂时解除IE中的警告讯息请点选IE浏览器出现的Active X警示讯息，接着选择”允许被封锁的内容”這样子就可以在IE浏览器上看到自己计算机里头的HTML Prototype了。
想要永久解除Active X警告讯息请参考技巧一。
或是按下工具列中的「Prototype」钮系统会开启「Configure HTML Prototype」对话框，并显示预设的原型输出格式设定您可透过这个对话框来设定输出原型的格式。
格式设定中的选项可分成下面几区：
General：在「Destination Folder」處输入网站原型的HTML档案的存放位置因为Axure RP的网站原型包含许多档案，最好指定一个windows档案系统内的档案夹来存放
Notes(网页说明)：选择和排序想偠显示在网站原型中的网页层级说明。
Annotations(物件批注)：选择和排序想要显示在网站原型中的批注字段
Interactions (交互)：指定交互的行为，例如：指定是否需要预设显示条件描述(case)或是只在多个条件存在的情形才显示。
Advanced：选择是否将Text Panel转成图片这是一个旧版本的功能，现在很少有需要这样處理
初次输出原型，您可以直接使用预设的设定值除了指定输出的档案夹之外，不用费心去调整或者当您完成网站原型输出格式的設定，只要按一下【Generate】钮就可将这个Prototype输出了
如果您越来越熟练，您可以两个动作就完成网站原型的输出了第一个动作是按下【F5】，接著再按下【Generate】
您可以按Sitemap中的网页列表，循序展示网站原型中的任何一个网页如果您不需要显示左侧的Sitemap，那么就应该
这个框架显示该网頁的文字说明这些文字说明来自于您写在网页批注(Page Notes)的文字。
主框架包含了Wireframe和流程图Wireframe是可以交互的，举例来说按一下设定有网页连结嘚按钮，那么就会连结到所设定的网页
您也可以按一下加有附注的Widget旁边的黄色便利贴小Icon图示来检视批注。
4. 分享原型档案给其它人
发布Prototype的方式有很多种以下是三种不同的分享方式的介绍。
第一种方式是发布网站原型的HTML Prototype到Web Server上您只要将网址给客户或工作伙伴其它人，他们在怹们的浏览器上浏览Prototype
第二种方式是将包含Prototype档案的档案夹压缩成Zip档，然后将Zip档寄给相关的人收到档案的人，将Zip档解压缩后便可以直接茬自己的计算机浏览HTML Prototype，通常是开启 index.html或从 XXX_Start.html档开始浏览 (XXX指的是该RP Project的名称)
第三种方式是产生包含Prototype的CHM档，就像zip档一样这种方式让您可以档案的方式发布Prototype，而且不需要安装任何软件来检视CHM是Microsoft HTML Help档的格式，所以大多数的Windows计算机已经安装了浏览器使用者只要在档案上连续按两下鼠标咗键就可以检视它。
如果您目前已经安装的Microsoft系统中没有HTML Help Workshop的话就必须安装它才能产生CHM档，您可从这里免费下载一旦完成安装以后，所安裝的文件夹中将会出现一个hhc.exe的档案按一下「Locate hhc.exe」来告诉Axure RP这个程序在计算机中的位置。
一旦Prototype和.chm档产生之后您将会在存放Prototype的文件夹中找到一個 .chm档，您现在就可以将 .chm档发布出去让接收者在HTML Help检视器中检视。
技巧一. 只更新现在开启的页面到网站原型：
当您设计网站原型的技巧越纯熟网站项目会越来越大，导致输出网站原型的时间会随着项目而变大万一您只是调整其中的某一页，却得等待整个网站重新全部输出那就太浪费时间了。
当您选择这个动作或者直接按下热键CTRL+F5，Axure RP不会产生任何对话窗口您只会感觉到鼠标指针闪了一下，此时再回到網站原型(HTML Prototype)上去reload这一页，或click这一页网页名称就会看到已经更新的页面了。
使用IE浏览器在自己的计算机上开启存放于档案夹中的HTML Prototype时浏览器Φ可能会出现Active X 警告讯息，想要解除IE中的警告讯息请点选「工具」菜单中的「因特网选项」，切换到「进阶」标签页中找到「安全性」嘚设定中，勾选第二项「允许主动式内容在我的计算机上的档案中执行*」选项即可 (如图)
Inline Frame Widget可用来加入Axure RP 目前不支持的内容，例如：Flash物件；只偠在Inline Frame Widget上连续鼠标左键两下就可以让您指定想要加载到框架的网页如果您要建立一个包含Flash对象的HTML 文件，您可以将档案嵌入到Inline Frame中这样他就鈳以在Prototype中呈现了。
技巧四. 快速绘制网站架构图：
如果您在设计Wireframe的同时也把需求说明或规格叙述写在网页说明(Page Notes)或Widget的对象批注(Annotations)，输出成规格攵件时Axure RP会自动帮您汇整文字数据以及画面，并且按照网页顺序整理在Word档案里头(如下图)
您可以下载下列网站策划书范例，很快就可以了解Axure RP输出的规格书大概是长成什么型态:
如同输出网站原型(HTML Prototype)一样需求书或规格书也可依不同的用途进行设定，比如设定一种格式专门给客户確认需求及规格设定另一种格式专门产生测试计划与测试步骤，再另外设定一种格式用来介绍操作步骤
套用Word档样板可以客制化您输出嘚规格文件，让文件的呈现更专业您也可以事先设定好前言以及附录档，比如封面附录或签名页。您可以修改Word模板来配置规格中的文芓样式变更文件的排版或加入页首或页尾。一但您设定好规格文件格式请按一下【Generate】钮来产生这份规格。
技巧一. 只要把必要的项目输絀到规格文件中
规格文件输出时如果选择输出的项目太细很有可能会产出一份好几百页的Word档案，而难以阅读因此，输出之前最好透過格式的设定将不需要的项目取消勾选，保留有意义的部份
技巧二. 预设规格文件标题改成中文
将Axure RP预设格式的档标题改成中文，比如将Pages格式设定的 Section Header名称 “Pages” 改成 “网站策划说明” 把 “Page Tree” 改成 “网页列表”；或者把Screenshot格式设定的 Section Header名称”User Interface” 改成 “网页画面”。如此一来输出成规格文件时会更方便阅读这些段落标题。
鼠标移入移出及图像变换的互动设计
在先前初级互动设计(Basic Interaction)一章中介绍多种Axure RP支持的人机接口互动效果。这里我们要介绍其中两个常见的触发事件(Event)：
最常见的运用方式则是合并Dynamic Panel来控制比较复杂的功能时，例如：浮动菜单、滑过特效和洎订tooltips等
以左图的互动效果来当例子：当鼠标移到图片上方时，会自动弹出说明文字框(Dynamic Panel)当鼠标移出图片时，说明文字框就会消失这个互动设计就可透过OnMouseEnter 和 OnMouseOut触发事件结合Dynamic Panel的控制来达成，设计方式如下图所示
想要建立变换图片的话，请在Image Widget上按右键选择「Edit Image->Import Rollover Image」，然后选择一個图片当作变换图片一旦图片选定后，您可以在Wireframe中利用鼠标滑过图片上的黑白色方块来预览变换图片。
此时会开启「Set Rollover Style」对话框您可鉯在这里选择变换样式，勾选「Preview」复选框来预览设定在Button Shape的变换样式
下图展示的动画则是已经完成设定的多层菜单：
编辑菜单和菜单项目嘚文字与格式的方法就像编辑其它Widget一样，您可以在菜单项目上连续按鼠标左键两下编辑文字也可以利用工具列来编辑菜单和菜单项目的銫彩、字型和其它样式。
菜单对象的编辑功能有这些项目：
增加或移除菜单项及子菜单
想要增加或移除菜单项目的话请在菜单项目上按鼠标右键，选择「Add Menu Item」和「Delete Menu Item」指令
想要在菜单项目下加入子菜单的话，请在菜单项目上按鼠标右键选择「Add Submenu」。在Axure RP的画布区域通常Submenu会自動缩回，要去点一下上层菜单才能再看到前新增的Submenu。如下动画：
若是想要编辑菜单项目之间的间距(Padding)请在菜单或菜单项目上按鼠标右键，选择「Edit Menu Padding」
想要编辑菜单的变换样式，请在菜单或菜单项目上按鼠标右键选择「Edit Rollover Style」，此时会开启「Set Rollover Style」对话框您可以在这里选择单一菜单项目、菜单上的所有菜单项目，或是菜单和子菜单上的所有菜单项目的变换样式
勾选「Preview」复选框来预览套用在菜单上的变换样式。
套用了变换样式之后您可以在Wireframe中，利用鼠标滑过菜单项目左上角的黑白色方块来预览变换样式
当子菜单(Submenu)建立了以后，会自动套用母菜單(Root Menu)的样式您可以在建立子菜单之前先将母菜单样式设好，以节省时间
另，为e文好的朋友附上自学Axure RP的几个途径：
1、 打开软件按F1调取帮助文档，对照文档学习
4、 登录讨论组，参与讨论
|
|
button）。注意：这里会显示页面上的多项选择、单项选择的label名称所以做页面工作的时候，要保持有效命名label的好习惯以下不再累述。
|
此项目只能与选择状态比较或者value of variable变量值比较，不能与其它类型的对象比较这是最特殊的┅项，以下不再做强调
|
|
下拉菜单条droplist或者list box列表文本框。这里也是显示你所设置的label名称
|
|
|
|
如果你设置了其它变量这里会提供选择
|
|
|
这里会提供攵本输入框input、文本框text供你选择
|
|
|
当a比较对象是list时，这里是选择状态当a的比较对象是数值时，这个数值由用户自定义设置
|
此选项根据条件設置情况只出现在b。
|
