Axure入門

Axure RP是一個專業的快速原型設計工具。讓負責定義需求和規格、設計功能和界面的專家能夠快速創建應用軟件或Web網站的線框圖、流程圖、原型和規格說明文檔。同時支持多人協作設計和版本控制管理。

站點地圖面板

對所設計的頁面(包括線框圖和流程圖)進行添加、刪除、重命名和組織頁面層次。

模塊面板

一種可以複用的特殊頁面,在該面板中可進行模塊的添加、刪除、重命名和組織模塊分類層次。

界面與功能

導航面板

在繪製線框圖(Wireframe)或流程圖(Flow)之前,應該先思考界面框架,決定信息內容與層級。

明確界面框架後,接下來就可以利用頁面導航面板來定義所要設計的頁面。頁面導航面板是用於管理所設計的頁面,可以添加、刪除及對頁面層次進行重新組織。

交互設計

控件的交互

用戶操作界面時就會觸發事件,如鼠標的 OnClickOnMouseEnter OnMouseOut

每個事件可以包含多個場景,場景也就是事件觸發後要滿足的條件;

每個場景可執行多個動作,例如:打開鏈接、顯示面板、隱藏面板、移動面板。

:選中一個頁面,點擊這個按鈕可以進入頁面編輯狀態

:搜索頁面,在頁面過多的時候可以使用,平時用的少

將頁面結構生成流程圖:

 

認識axure組件區域

 組件區域也叫做部件區域,英文爲widgets,還有人稱之爲控件區域,組件是axure事先準備好的網站項目常用的零件,比如一些基本的頁面元素

Axure默認存在2個組件庫,分別爲線框圖和流程圖。同時我們也可以自己去製作一些組件加載進來,或者從網絡上下載一些其他網友製作的組件

認識axure部件庫中各個部件的屬性

axure中,部件名稱並不是唯一的。

文本面板——axure線框圖部件庫介紹

特別注意:文本面板的高度無法直接調整,它的高度是隨着字體的大小自動變化的

矩形、佔位符組件——axure線框圖部件庫介紹

矩形組件和佔位符沒有太多的區別

 1. 可以用來做頁面佈局

2. 可以變化成爲其他的形狀:三角形、圓形、橢圓等很多的形狀

3. 可以填充顏色:用着背景和層次

4. 可以用來製作表格

5. 可以直接輸入文字

6. 可以添加很多的交互

動態面板——axure線框圖部件庫介紹

1、什麼是Axure的動態面板

動態面板控件(Dynamic Panel)可以讓你實現高級的交互功能,實現原型的高保真度。動態面板包含有多個狀態(states),每個狀態可包含一系列控件(你可以把一個狀態理解成一個獨立的頁面)。任何時候都只有一個狀態(頁面)是可見的,或整個動態面板可以被隱藏。結合交互動作,可以讓動態面板的狀態進行隱藏、顯示和改變。像添加其它控件一樣,可以在控件面板中拖放動態面板控件到線框圖中。

簡單的說,動態面板就是展示在頁面不跳轉的情況下所能實現的交互狀態。而動態面板的每一個狀態都可以看作是產生的一個新的交互結果。簡單的說,動態面板就是展示在頁面不跳轉的情況下所能實現的交互狀態

 2、Axure的動態面板可以用來做什麼

1)tab式頁籤的切換效果:Axure的官方給出的實例就是這個

2)鼠標觸發式和點擊觸發式的下拉菜單效果:這個可以結合Axure的默認組件中的“垂直菜單”、“水平菜單”來實現,常用於導航的原型製作。
3)鼠標觸發式的浮窗效果:類似“Alt”的效果,常用於瀏覽提示和觸發式廣告。
4)JS的鼠標點擊彈層效果:這個是目前使用被廣泛使用的效果之一。
5)註冊表單中的根據焦點判斷提示的效果:當焦點在輸入框內的時候提示該表單欄目填寫規範,當焦點離開輸入框的時候根據填寫的結果提示正確或者錯誤原因,這個需要動用高級設計交互編輯功能結合Axure的邏輯條件和設置變量功能來實現。

 3. 關於動態面板和其中狀態的理解

內部框架——axure線框圖部件庫介紹

2. 如何應用內部框架引用視頻內容

如果只需要視頻內容,不需要網頁的內容,記得複製flash地址,框架的大小是視頻播放的大小


 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章