一.認識AxureRP1.什麼是AxureRP2.Prototype的效益3.AxureRP可以幫助哪些人4.如何學習AxureRP的操作1.什麼是AxureRPAxure的發音是”Ack-sure”,RP則是”RapidPrototyping”快速原型的縮寫。AxureRPPro是美國AxureSoftwareSolution公司的精心傑作,如果你本身是軟體專案經理,Web產品經理,或網站企劃工作者,那麼你不能不知道這套軟體。AxureRP是一個快速繪製Wireframe和Prototyping的工具,主要用來定義應用程式的需求與規格,以及設計使用者介面與功能,使用者包括UserExperienceDesigners、商業分析師、資訊架構師、UsabilityExpert與產品經理等專業人士。.在AxureRP中建立Wireframe和Prototype可以幫助您快速且有效地分析需求、驗證設計並傳達給所有參與者,以確保在有限的專案時間與資源下,開發出有用和可用的應用程式。傳統上,製作prototype不但昂貴而且費時,讓程式設計師很難在開發過程中搭配合作。商務專家(Businessprofessional)也不斷的在使用簡報與圖示的工具建立prototype和持續對製作過程與結果不滿意之間掙扎著。為了要能有效且快速的建立prototype,AxureRP結合了廣受歡迎的簡報與圖示工具中簡易操作的特性和其他必要的功能。這樣一來,商務專家就可以在不需要大量的文件製作下快速的建立prototype,而專案成員與專案關係人也可以在不中斷開發的情況下輕鬆完成prototype。AxureRP很容易上手且絕對值回票價的,所以當專案成員在第一個專案中使用這個工具時就會發現他們的投資已經得到了顯著的回報。不只省下了在收集與溝通需求上的時間與成本,同時也降低了改善需求時的重工。透過prototype可以省下驚人的成本,以及預防潛在性的商業損失、機會損失與專案關係人信心喪失等的災難成本。2.Prototype的效益“沒有比製作prototype更易取得使用者介面與特殊功能可用性上的一致性了。Prototype不只可確認需求,它更可贏得顧客的心。”AlanM.DavisandDeanA.LeffingwellUsingRequirementsManagementtoSpeedDeliveryofHigherQualityApplicationsRationalSoftwareCorporation/IBM根據StandishGroup的“2003ChaosChroniclesReport“,大約66%的軟體開發專案不是失敗,就是超出預算、超出專案時間,或是交付縮水的功能。專案失敗或虧損的前三大原因為:1.缺乏使用者的參與2.需求或規格不完整3.需求或規格變更在過去,需求管理工具或工作表中所儲存的數千個需求與上百頁的文件早已不合時宜,現在,這些需求更是不適用於目前快速發展的環境。製作Prototype是個有效簡化文件製作、吸引使用者參與、早期辨認需求遺漏,與將外在需求降到最低的方法。大量文件製作可以改捕捉成有註釋與互動性的畫面,如此更能抓住專案關係人(stakeholder)與使用者的注意。3.AxureRP可以幫助哪些人網站企劃人員網站專案經理系統分析師軟體介面設計師互動設計師使用者經驗設計師Usability專家產品經理4.如何學習AxureRP的操作如果您本身已經會使用PowerPoint或者Visio,您可以很快學會AxureRP的操作。學習AxureRP的最好方式就是下載安裝,直接去體驗,任意的玩一玩各種功能,然後試著按下[F5]輸出成Prototype。或者您也可以下載我們提供的AxureRP範例,打開這些範例的RP檔(AxureRP專屬的ProjectFile),然後試著按下[F5]輸出成Prototype。一般情況,AxureRP初次使用者大約花上1-2小時就學會基本操作,並開始應用到實際的工作上。如果您需要按部就班的學習AxureRP的相關知識,請參考我們提供的線上教學。若有操作或學習上的疑問,請將您的困擾或問題傳送給我們,讓我們為您解答。預祝您享受AxureRP帶來的愉快經驗!(版權聲明:歡迎引用及複製AxureRP中文教學內容,必須註明出處為悠識數位顧問有限公司及原始文章網址UserXper.com)二.AxureRP基本操作(1)认识AxureRP操作介面下图是AxureRP环境与介面中各区块的简单描述。放大图主选单/工具列:在主选单与工具列中,可以执行常用的动作指令,例如:开启与储存档案、输出Prototype或Spec文件。Sitemap窗格:Sitemap窗格将您所设计的网页以树状结构的方式呈现,您可以在这里新增、移除、重新命名和组织设计的网页。Widgets窗格:包含一系列常用的使用者介面对象,例如:按钮、影像、TextPanel与矩形,您可以直接透过拖拉的方式来设计网页。Masters窗格:在这里您可以新增、移除、重新命名和组织设计好的Master。Master是一种可以容纳多项界面元素的集合样板(Temlate),您可以将常用的共享区块设计成Master,未来在设计Wireframe时重复使用Master,来提高规划的效率。Wireframe窗格:您可以在这个窗格中设计网页信息元素,编排内容,设计介面,设计交互特性等等。未来可以将这些设计好的页面,输出成Prototype或Spec文件。交互设计(Interaction)窗格:交互的范围很广,从最基本的超级链接、pop-ups,一直到动态显示和隐藏widget。您可以在这个窗格中定义Widget的交互。物件批注(Annotation)窗格:您可以为Widget加上批注来指定功能,您可以在这个窗格中增加和自订Widget的批注。网页说明及交互(PagesNotes&Interactions)窗格:您可以在这个窗格中加入网页层级的说明与交互效果到设计中。初级交互设计1.交互(Interaction)2.定义基本连结3.动作型态(Action)及实际动作(ActionDescription)4.多重条件(MultipleCases)5.网页层级的交互:OnPageLoad6.秘技(QuickTips)1.交互(Interaction)Interactions窗格是用来定义Widget在Wireframe中的交互表现方式,交互表现的方式包含简单的连结到RichInternetApplication(RIA)的复杂行为,而且这些交互表现都可以在Prototype中执行。触发事件(Event)、假设条件(Case)、动作型态(Action)在AxureRP中的交互设计是由触发事件(Event)、假设条件(Case)与动作型态(Action)所组成。当使用者对网页进行某些人机介面的操作时,就会对网页触发一个事件(Event)。每一个触发事件都可以有一或多个假设条件(Case),例如,一个按钮的OnClick触发事件可以有两个假设条件:其中一个导引至某个网页,另一个则导引至另一个网页。而每一个假设条件(Case)又可以执行一或多个动作型态(Action),举例来说:「OpenLinkinCurrentWindow」的动作就是一个基本连结。触发事件(Event)目前AxureRP5支持的人机介面触发事件,及相对应的触发事件(Event)名称如下:以鼠标点击-OnClick鼠标的指针移动到对象之上-OnMouseEnter鼠标的指针移动出对象之外-OnMouseOut鼠标的指针进入文字输入状态-OnFocus鼠标的指针离开文字输入状态-OnLostFocus敲键盘-OnKeyUp浏览器加载网页-OnPageLoad大多数的对象,只具备最常见的三种触发事件(Event)-OnClick、OnMouseEnter与OnMouseOut。某些特定的Widget的可触发事件有些不同:Button对象只有OnClick。RadioButton,CheckBox这2种对象则具有OnFocus/OnLostFocus触发事件。TextField,TextArea这2种对象则具备OnKeyUp/OnFocus/OnLostFocus触发事件。Droplist,ListBox这2种对象则具备OnChange/OnFocus/OnLostFocus触发事件。网页加载浏览器时,则有OnPageLoad触发事件。(请参考5.网页层级的交互:OnPageLoad)您不需要硬背上述的对象及对应的Event,在AxureRP的操作介面上,您只要点选对象,就可以查看Interaction窗格所显示的对应Event。2.定义基本连结下列步骤说明如何新增一个基本连结到ButtonWidget。加入基本连结最快的方法就是按一下Interactions窗格中的「QuickLink」,弹出Sitemap窗格的网页清单后,你可以为选定的对象(Widget)指定连结到哪一个网页。如果不是透过QuickLink的话,那么请按照下列步骤(对照下图)进行交互的设定。步骤一:指定对象于画布中放置一个ButtonWidget并选取它。步骤二:新增假设条件(AddCase)在Interactions窗格中选择OnClick,并点选「AddCase」(或在OnClick上连续按鼠标左键两下)以增加一个假设条件(Case)到按钮的OnClick触发事件,这时会出现「InteractionCaseProperties」对话窗,您可以在此处选择想要执行的动作。步骤三:选择动作型态(SelectAction)在InteractionCaseProperties对话窗的Step2.SelectActions,勾选「OpenLinkinCurrentWindow」这个动作型态。步骤四:编辑实际动作(EditActionDescription)按一下InteractionCaseProperties对话窗的下方,step3的”Link”,并选择实际执行动作时要开启的网页。3.动作型态(Action)及实际动作(ActionDescription)除了基本连结之外,AxureRP还提供了许多的动作型态,这些动作都可以在任何触发事件的假设条件中被执行。你可以同时指定一种/多种动作型态(Action)之后,接着定义实际动作(ActionDescription),这样子才能完成展现在Prototype上的一个/多个实际动作。以下是AxureRP5.0版所提供的动作型态(Action):1.OpenlinkinCurrentWindow开启网页2.OpenlinkinPopupWindow开启网页在Popup窗口3.OpenlinkinParentWindow开启网页在Parent窗口4.CloseCurrentWindow关闭目前窗口5.OpenlinkinFrame开启网页在inlineframe中6.SetPanelstate(s)toState(s)指定某个DynamicPanel的显示状态7.ShowPanel(s)显示DynamicPanel8.HidePanel(s)隐藏DynamicPanel9.ToggleVisibitdtyforPanel(s)切换DynamicPanel显示或隐藏10.MovePanel(s)移动DynamicPanel11.SetVariableandWidgetvalue(s)equaltoValue(s)设定变量或Widget的值12.OpenlinkinParentFrame开启网页在上层内嵌框架中13.ScrolltoImageMapRegion卷动画面到ImageMap的位置14.EnableWidget(s)把Widgets变成可用状态15.DisableWidget(s)把Widgets变成变成不可用状态16.WaitTime(s)动作之前先等候(毫秒)17.Other