- 相關(guān)推薦
Axure中RP基本交互設(shè)計(jì)簡介
今天為大家介紹的是Axure RP基本交互設(shè)計(jì)簡介,希望大家會(huì)喜歡。
Axure RP基本交互設(shè)計(jì)
控件的交互
控件交互面板用于定義線框圖中控件的行為,包含定義簡單的鏈接和復(fù)雜的RIA 行為,所定義的交互都可以在將來生成的原型中進(jìn)行操作執(zhí)行。
在控件交互面板中可以定義控件的交互,交互事件(Events) 、場景( Cases)和動(dòng)作(Actions)組成:
用戶操作界面時(shí)就會(huì)觸發(fā)事件,如鼠標(biāo)的 OnClick、OnMouseEnter 和 OnMouseOut;
每個(gè)事件可以包含多個(gè)場景,場景也就是事件觸發(fā)后要滿足的條件;
每個(gè)場景可執(zhí)行多個(gè)動(dòng)作,例如:打開鏈接、顯示面板、隱藏面板、移動(dòng)面板。
定義鏈接
下列步驟說明如何在按鈕控件上定義一個(gè)鏈接:
1.首先,拖拉一個(gè)按鈕控件到線框圖中,并選擇這個(gè)按鈕;
2.然后,控件交互面板中鼠標(biāo)雙擊“OnClick”這個(gè)事件,這時(shí)會(huì)出現(xiàn)“Interaction Case Properties”對(duì)話窗,在這個(gè)對(duì)話框中可以選擇要執(zhí)行的動(dòng)作;
3.在“Step 2”中,勾選“Open Link in Current Window”動(dòng)作。
4.在“Step 3”中,點(diǎn)擊“Link”,在彈出的Link Properties 對(duì)話框中可以選擇要鏈接 的頁面或其它網(wǎng)頁地址 。
除了上面的步驟,加入一個(gè)鏈接的最快的方法是單擊控件交互面板頂部的“QuickLink” ,在彈出的 Link Properties 對(duì)話框中選擇要鏈接的頁面。
設(shè)置動(dòng)作
除了簡單的鏈接之外,Axure還提供了許多豐富的動(dòng)作,這些動(dòng)作可以在任何觸發(fā)事件的場景中執(zhí)行。以下是 Axure所支持的動(dòng)作:
Open Link in Current Window:在當(dāng)前窗口打開一個(gè)頁面
Open Link in Popup Window:在彈出的窗口中打開一個(gè)頁面
Open Link in Parent Window:在父窗口中打開一個(gè)頁面
Close Current Window:關(guān)閉當(dāng)前窗口
Open Link in Frame:在框架中打開一個(gè)頁面
Set Panel state(s) to State(s):為動(dòng)態(tài)面板設(shè)定要顯示的狀態(tài)
Show Panel(s):顯示動(dòng)態(tài)面板
Hide Panel(s):隱藏動(dòng)態(tài)面板
Toggle Visibility for Panel(s):切換動(dòng)態(tài)面板的顯示狀態(tài)(顯示/隱藏)
Move Panel(s):根據(jù)絕對(duì)坐標(biāo)或相對(duì)坐標(biāo)來移動(dòng)動(dòng)態(tài)面板
Set Variable and Widget value(s) equal to Value(s):設(shè)定變量值或控件值
Open Link in Parent Frame:在父頁面的嵌框架中打開一個(gè)頁面
Scroll to Image Map Region:滾動(dòng)頁面到
Image Map 所在位置
Enable Widget(s):把對(duì)象狀態(tài)變成可用狀態(tài)
Disable Widget(s):把對(duì)象狀態(tài)變成不可用狀態(tài)
Wait Time(s):等待多少毫秒(ms)后再進(jìn)行這個(gè)動(dòng)作
Other:顯示動(dòng)作的文字說明
多個(gè)場景(條件)
一個(gè)觸發(fā)事件可以包含有多個(gè)場景,根據(jù)條件執(zhí)行流程或互動(dòng)。
事件: OnPageLoad
Axure支持一個(gè)頁面層級(jí)的觸發(fā)事件:OnPageLoad,這個(gè)事件在原型載入頁面時(shí)觸發(fā)。
頁面 OnPageLoad事件在頁面?zhèn)渥⒚姘逯械腎nteractions 子面板中定義, OnPageLoad為事件添加場景的方式與控件事件相同
【Axure中RP基本交互設(shè)計(jì)簡介】相關(guān)文章:
解讀交互設(shè)計(jì)-Axure原型交互輸出11-12
Axure常用交互效果10-12
AXURE交互實(shí)例介紹10-15
Axure常用交互效果制作06-13
Axure交互實(shí)例教程07-19
Axure7交互設(shè)計(jì)響應(yīng)式方案07-26
Axure常用交互實(shí)例教程09-12
Axure的格式和樣式簡介09-15
axure元件使用方法簡介07-19