Axure高级互动设计1—设定逻辑条件.doc

设定逻辑条件1. 认识 Condition (逻辑判断)2. 认识 Condition Builder (逻辑判断编辑器)3. 用 Condition Builder 建立逻辑判断4. 秘技(Quick Tips)1. 认识 Condition (逻辑判断)虽然可以用文字来描述 Prototype 操作的动线或互动方式，但有的时候，您还是会需要一个更逼真(High Fidelity)、更互动、更有亲和力的 Prototype 比如，当您在操作 Prototype，模拟会员登入帐号，如果能在按下登入按钮时，直接显示登入成功或失败的讯息是不是比您口头解说或文字描述，还要来得清楚明白呢？在 Axure RP 的互动设计中， 「逻辑判断 」是最有挑战性，但是也最有趣的一件事情因为当您在设计网站 Prototype 时，可以不用寻求程式设计师或 Flash 设计师的协助，就可以独立完成您想要表达的互动效果清楚的逻辑观念胜过互动设计技巧学习 Axure RP 的条件逻辑设计之前，您必须先知道一个重要的观念：成为称职的网站企划人员，不一定要学会 Axure RP 的高级互动设计技巧，却一定 要有清楚的逻辑观念。

否则，不只造成网站开发工作上的困扰，更严重的还会造成糟糕的网站使用者经验只有清楚的逻辑观念，才能带来准确合理的互动设计如果您不想学这些高级互动设计技巧，绝对无损于您利用 Axure RP 进行网站企划及 Prototype 设计换言之，即使您学会 Axure RP 的高级互动设计，但是您的逻辑观念如果不清楚，仍然无法成为一位优秀的网站企划要是您希望将 Prototype 拿来进行 Usability Test，或者在各种沟通讨论会议上，让大家更充分理解操作的互动效果，那么透过 Axure RP 提供的逻辑判断设定，可以让 Prototype 更进一步接近真实完成的网站介面与动线物件值(Value of Widget) / 变数值(Value of Variable)接下来，您要学习使用变数值/物件值，这两种类型的数值应用于逻辑判断：a. 物件值(Value of Widget) – 使用 Widget 本身的值来进行逻辑判断，有 4 种不同的数值可供应用：* Checkbox 或 Radio Button 的核取状态* Droplist 或 Listbox 的选取值* Text Field 或 Text Area 中的文字* Text Field 或 Text Area 的文字的长度b. 变数值 (Value of Variable) – 使用自定变数的值来进行逻辑判断，有 2 种：* value of variable – 自定变数的值* length of variable value – 自定变数值的长度附带补充，Axure RP 本身存在一个全域预设变数 (Global Default Variable) – OnLoadVariable，除此之外，变数名称可以自订，最多可以有 25 个自订变数。

您可以透过主选单 Wireframe > Manage Variables 来检视并编辑所有的自订变数您可以在 Prototype 设计里，将物件值及变数值的逻辑判断加入互动设计，在操作 Prototype 时，将会根据 Web Form Widget 所输入的数值，或是变数的值来进行判断比如，当使用者登入帐号时，自动检查输入的帐号或密码，登入成功则导到欢迎页面，登入失败则显示错误讯息表单型态的物件 (Web Form Widgets)由于逻辑判断牵涉到不同物件值的判断，因此经常与表单型态的物件结合运用 Axure RP 的表单型态的物件(Web Form Widgets) 如下图2. 认识 Condition Builder (逻辑判断编辑器)如果您具有程式设计的基础，要学习 Axure RP 的变数或逻辑判断，一点都不困难毕竟 Axure RP 不是程式开发工具，并没有太多的程式语言要学习为了让没有程式设计基础的 Axure RP 使用者也可以设计逻辑判断，因此 Axure RP 透过三个不同的功能视窗，来协助使用者设定变数以及逻辑判断，这些功能视窗包括：* Annotation and Interactions (互动设计)* Interaction Case Properties (互动状况设定器)* Condition Builder (逻辑判断编辑器)这三个功能视窗的关连及开启顺序如下图：为了让没有程式设计基础的 Axure RP 使用者也可以设计逻辑判断，因此 Axure RP 透过三个不同的功能视窗，来协助使用者设定变数以及逻辑判断，这些功能视窗包括：其中，Annotation and Interactions，以及，Interaction Case Properties，这二个视窗在学习初级互动设计就使用到了。

只有 Condition Builder 对话窗对于学习高级互动设计的人是陌生的，我们就来认识一下这个特殊的功能Condition Builder 逻辑判断编辑器的操作介面Condition Builder 是用来设定逻辑判断的工具，只要透过下拉选单及一些按键，就可以完成一长串复杂的逻辑判断叙述，不需记忆，也不用自行撰写逻辑判断程式您可以在 Interactions Case Properties 视窗的右上角，点一下 Add Condition (或 Edit Condition)的文字连结，就会开启「Condition Builder」视窗在「Condition Builder」视窗中，可以建立一行或多行的逻辑判断，只要按下右方的 「 」钮，就可以增加一行，按下「- 」钮，则会移除一行如果所有的逻辑判断都必须满足， 可以在「Satisfy」下拉选单中选择「Satisfy all of the following」，就会以”and” 来连结各个逻辑判断；若是选择「any」，则会以”or ” 来连结在逻辑判断中，检查值共有六种型态：* check state of – Checkbox 或 Radio Button Widget 的核取状态* selected option of – Droplist 或 Listbox Widget 的选取值* value of variable – 自定变数的值* length of variable value – 自定变数值的长度* text on widget – 输入在 Text Field 或 Text Area 中的文字* length of widget value – 输入在 Text Field 或 Text Area 中的文字长度3. 以 Condition Builder 建立逻辑判断您可以自行建立一个 Case 的逻辑判断，比如：If text on Widget 帐号栏位 equals ‘guest’ and text on Widget 密码栏位 equals ’12345′ “（如果「帐号栏位」输入的是’guest’，而且「密码栏位」输入的是“12345”）这个逻辑判断将会在您操作 Prototype 时，自动判断是否要执行 Case 所指定的动作。

完成逻辑判断的设定之后，按下【OK 】钮回到「Interaction Case Properties」视窗，就能指定当符合这个 Case 的逻辑判断时，要执行哪些动作注意：当您增加 Case 的逻辑判断，Interactions 窗格中的 Case 名称后面会自动加入一个以“If” 开头的逻辑判断描述同时，这个 Case 的图示会变成绿色，强调这个 Case 使用了逻辑判断一旦在 Case 中定义了逻辑判断，同一个触发事件的其他 Case 名称后面，也会自动加入以 “Else If” 开头的逻辑判断描述如果这些 Case 没有另外设定逻辑判断的话，那么就会直接标示“Else If True”在预设的情况下，Prototype 只会执行第一个标示为 ”True” 的 Case在 Interactions 窗格中的案例上按下右键并选择「Change to IF」，可以将“Else If” 改为“If” ，这么做将可允许在多个状况同时成立的情况下执行多个动作4. 秘技 Quick Tips秘技 1. 为 Widget 命名：为逻辑判断使用到的 Widget 命名，可以方便在建立逻辑判断时做识别。

想要替 Widget 命名的话，只要选择 Widget 并在 Annotations & Interactions 窗格中的「Label」栏位输入名称就可以了秘技 2. 绘制流程图：逻辑判断和流程可以设计得十分复杂，建立一个流程图 (Flowchart)可以帮助您组织与传达使用者可能涉及的各种动线版权声明：欢迎引用及复制 Axure RP 中文教学内容，必须注明出处为悠识数位顾问有限公司及原始文章网址 UserX)。