1、設定邏輯條件1.認識 Condition ( 邏輯判斷 )2.認識 Condition Builder ( 邏輯判斷編輯器 )3.用 Condition Builder 建立邏輯判斷4.秘技 (Quick Tips)1. 認識 Condition ( 邏輯判斷 ) 雖然可以用文字來描述 Prototype 操作的動線或互動方式，但有的時候，您還是會需要一個更逼真 (High Fidelity) 、更互動、更有親和力的 Prototype 。比如，當您在操作 Prototype ，模擬會員登入帳號，如 果能在按下登入按鈕時，直接顯示登入成功或失敗的訊息。是不是比您口頭解說或文字描述，還要來得清

2、楚明白呢？在 Axure RP 的互動設計中，邏輯判斷是最有挑戰性，但是也最有趣的一件事情。因為當您在設計網 站 Prototype時，可以不用尋求程式設計師或 Flash 設計師的協助， 就可以獨立完成您想要表達的互動效 果。清楚的邏輯觀念勝過互動設計技巧學習 Axure RP 的條件邏輯設計之前，您必須先知道一個重要的觀念： 成為稱職的網站企劃人員，不一定要學會 AxureRP 的高級互動設計技巧，卻一定 要有清楚的邏輯觀念 。 否則， 不只造成網站開發工作上的困擾， 更嚴重的還會造成糟糕的網站使用者經驗。 只有清楚的邏輯觀念， 才能帶來準確合理的互動設計 。如果您不想學這些高級互動設計技

3、巧，絕對無損于您利用 Axure RP 進行網站企劃及 Prototype 設 計。換言之，即使您學會 Axure RP 的高級互動設計，但是您的邏輯觀念如果不清楚，仍然無法成為一位 優秀的網站企劃。要是您希望將 Prototype 拿來進行 Usability Test ，或者在各種溝通討論會議上， 讓大家更充分理解操作 的互動效果，那么透過 Axure RP 提供的邏輯判斷設定，可以讓 Prototype 更進一步接近真實完成的網站 介面與動線。物件值 (Value of Widget) / 變數值 (Value of Variable) 接下來，您要學習使用變數值 / 物件值，這兩種類型

4、的數值應用于邏輯判斷：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-自定變數值的長度附帶補充，

5、Axure RP 本身存在一個全域預設變數(Global Default Variable) - OnLoadVariable ，除此 之外，變數名稱可以自訂，最多可以有 25 個自訂變數。您可以透過主選單 Wireframe Manage Variables 來檢視并編輯所有的自訂變數。您可以在 Prototype 設計里，將物件值及變數值的邏輯判斷加入互動設計，在操作 Prototype 時，將 會根據 WebForm Widget 所輸入的數值，或是變數的值來進行判斷。比如，當使用者登入帳號時，自動 檢查輸入的帳號或密碼，登入成功則導到歡迎頁面，登入失敗則顯示錯誤訊息。表單型態的物件 (

6、Web Form Widgets) 由于邏輯判斷牽涉到不同物件值的判斷，因此經常與表單型態的物件結合運用。Axure RP 的表單型態的物件 (Web Form Widgets) 如下圖。2.認識如果您具有程式設計的基礎，要學習程式開發工具，并沒有太多的程式語言要學習。為了讓沒有程式設計基礎的Axure RP 使用者也可以設計邏輯判斷，因此視窗，來協助使用者設定變數以及邏輯判斷，這些功能視窗包括：* Condition Builder （邏輯判斷編輯器）這三個功能視窗的關連及開啟順序如下圖：為了讓沒有程式設計基礎的 Axure RP 使用者也可以設計邏輯判斷，因此 視窗，來協助使用者設定變數以

7、及邏輯判斷，這些功能視窗包括：Annotation nnd Interactions互動設計窗格Footnote and Labelm( InteractionsAdd1=弋OnClick卜啟匚386廣護Open Link in CTixrerrt WiitdoKv* OnMoHseEnter一一OnMouseCuitCondtddii BulldeiI選輯判斷編箱器Interaction Cate Properties I互動狀況設定器)一一 Open LmtuXunreiIMQVOxn. LeJkm阪呼WndwQ|RUIlodtiLP iurEi WucLcrr匚曲CMhJ Rublw Q

8、|m I wt Cij RnaiitQ SriFuElMiCOlQA SlsZiOButtonRbcTTextFfeld TwtDiapLstLid Box Checkbox RaJia ButtonButton ShajeCondition Builder （邏輯判斷編輯器）Axure RP 的變數或邏輯判斷，一點都不困難。畢竟Axure RP 不是Axure RP 透過三個不同的功能* Annotation and Interactions* Interaction Case Properties（互動設計）（互動狀況設定器）Axure RP 透過三個不同的功能n也乂：【Iy”皿對;Add

9、 Snditi皿Annotations包InteractionsJiilratofi CKr pFritrriCjiDdibaftltaillwDe ft*OX其中，Annotation and Interactions，以及，Interaction Case Properties ，這二個視窗在學習初級互動設計就使用到了。只有Condition Builder對話窗對于學習高級互動設計的人是陌生的，我們就來認識一下這個特殊的功能。Condition Builder邏輯判斷編輯器的操作介面Condition Builder是用來設定邏輯判斷的工具，只要透過下拉選單及一些按鍵，就可以完成一長串復

10、雜的邏輯判斷敘述，不需記憶，也不用自行撰寫邏輯判斷程式。您可以在 Interactions Case Properties視窗的右上角，點一下Add Condition ( 或 Edit Condition)的文字連結，就會開啟 Condition Builder 視窗。在Condition Builder 視窗中，可以建立一行或多行的邏輯判斷，只要按下右方的鈕，就可以增加一行，按下-鈕，則會移除一行。如果所有的邏輯判斷都必須滿足，可以在Satisfy下拉選單中選擇Satisfy all of the following ，就會以” and”來連結各個邏輯判斷；若是選擇any，則會以” or

11、”來連結。在邏輯判斷中，檢查值共有六種型態：* 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.以

12、 Condition Builder 建立邏輯判斷您可以自行建立一個 Case 的邏輯判斷，比如： | |ImidVfcnaDbTF |vthHDIf text on Widget帳號欄位 equals guest and text on Widget 密碼欄位 equals 12345 “(如果帳號欄位輸入的是guest而且密碼欄位輸入的是“12345)這個邏輯判斷將會在您操作Prototype 時，自動判斷是否要執行Case 所指定的動作。完成邏輯判斷的設定之后，按下【 0K】鈕回到Interaction Case Properties 視窗，就能指定當符合 這個 Case 的邏輯判斷時，

13、要執行哪些動作。注意：當您增加 Case 的邏輯判斷，Interactions窗格中的 Case 名稱后面會自動加入一個以“If 開頭的邏輯判斷描述。同時，這個 Case 的圖示會變成綠色，強調這個Case 使用了邏輯判斷。LabelSubm itB LittonLnt屯Fattit) ntAck c：至已.Edit cssfi. Delele cate弓OnClick- 人匚案色1 If tent on widget UsernameField equals asfljre and tewt on fidget PasswoidField equals 12?45bH；/ Open Acea

14、urtt Ovetvieu ih Cnrerit V/hdc一旦在 Case 中定義了邏輯判斷，同一個觸發事件的其他 Case 名稱后面，也會自動加入以“Else If ”開頭的邏輯判斷描述。如果這些Case 沒有另外設定邏輯判斷的話，那么就會直接標示“Else If True ”在預設的情況下，Prototype只會執行第一個標示為” True”的 Case。-“ On Click 謝Cae 1 pf teNt on fidget UemanieField aure arid歸on fidget Pai/MrdField equals 12345Open Account Oveiview in Cuiient Window- 為Case 2 (Else H True)v Set Lcigi n r rarPanel state t a E ncrhl ess age在 Interactions窗格中的案例上按下右鍵并選擇 Change to IF，可以將“Else If 改為“If”，這么做將可允許在多個狀況同時成立的情況下執行多個動作。4.秘技 Quick Tips秘技 1.為 Widget 命名：為邏輯判斷使用到的 Wid