本文介紹交互設(shè)計(jì)師和產(chǎn)品經(jīng)理可以用axure的四個(gè)捷徑來(lái)高效畫原型圖，包括交互樣式、選項(xiàng)組、中繼器和局部變量。這些技巧可以幫助交互設(shè)計(jì)師和產(chǎn)品經(jīng)理提高工作效率。

對(duì)于交互設(shè)計(jì)師&產(chǎn)品經(jīng)理來(lái)說(shuō)，不僅僅是要分析業(yè)務(wù)邏輯保證使用功能的完整性，更是要完成元件的選用和用戶體驗(yàn)一致性的維護(hù)，小到一個(gè)元件的懸停、點(diǎn)擊、拖動(dòng)…樣式都需要提前確認(rèn)好，并且納入規(guī)范，而呈現(xiàn)在原型圖上時(shí)更是有很多公司會(huì)拿著原型圖來(lái)做用戶訪談來(lái)確認(rèn)需求價(jià)值。

所以高效畫好原型圖成為交互設(shè)計(jì)師與產(chǎn)品經(jīng)理的必修課。

下面，我會(huì)從十分常用并且有用的4個(gè)方面來(lái)講述我們可以利用的axure 捷徑：

1. 交互樣式——快速設(shè)置鼠標(biāo)懸停、點(diǎn)擊、禁用、長(zhǎng)按…的樣式效果。
2. 選項(xiàng)組——快速完成單選按鈕組。
3. 中繼器——快速完成同一框架的樣式設(shè)置。
4. 局部變量——快速完成tab頁(yè)切換函數(shù)。

一、交互樣式

對(duì)于交互樣式的設(shè)置可以快速完成對(duì)“鼠標(biāo)懸?！薄笆髽?biāo)按下”“選中”“禁用”“獲取焦點(diǎn)”的狀態(tài)變化，無(wú)需利用動(dòng)態(tài)面板。

設(shè)置步驟：

1. 拖入元件，將常規(guī)樣式設(shè)置好。
2. 選中元件鼠標(biāo)右擊，選擇“交互樣式”。
3. 在彈窗上面tab標(biāo)標(biāo)簽頁(yè)分別設(shè)置“鼠標(biāo)懸?！薄斑x中”“禁用”“獲取焦點(diǎn)”的交互樣式。
4. 點(diǎn)擊確定，則完成設(shè)置，在相應(yīng)動(dòng)作下就會(huì)出現(xiàn)你之前的樣式設(shè)置。

二、選項(xiàng)組

不管是菜單、單選按鈕、單選下拉框交互邏輯都是只能選中一個(gè)，且選中其它選項(xiàng)要進(jìn)行取消選中的操作…其實(shí)不用這么麻煩，將所有選項(xiàng)進(jìn)行“打組”系統(tǒng)則會(huì)自行生成單選效果，效率翻倍。

操作步驟：

1. 拉出元件庫(kù)中現(xiàn)有的單選按鈕，修改文字部分與樣式即可。
2. 選中所有選項(xiàng)鼠標(biāo)右擊，選中“制定單選按鈕的組”。
3. 在彈窗中給單選按鈕組命名。
4. 設(shè)置完成，預(yù)覽一下看看效果吧。

三、中繼器

在使用axure中，不免很多場(chǎng)景需要重復(fù)來(lái)進(jìn)行占位，或者是，有很多元素相同但內(nèi)容不同的場(chǎng)景，不少小白喜歡一個(gè)個(gè)去復(fù)制修改，但是如果你學(xué)會(huì)了中繼器，將事半功倍

操作步驟：

1. 拉出元件庫(kù)中的復(fù)選框元件，進(jìn)行樣式更改，可以先不輸入文字。
2. 從元件內(nèi)拖出中繼器，雙擊進(jìn)入，并將復(fù)選元件剪切進(jìn)去。
3. 將選項(xiàng)名稱輸入column0列。
4. 將中繼器中帶有的交互動(dòng)作將目標(biāo)替換為：復(fù)選框，設(shè)置完成。

PS：對(duì)于中繼器的用法很多并且較為復(fù)雜，但是如果學(xué)會(huì)會(huì)省去大量修改時(shí)間，如有興趣，請(qǐng)持續(xù)關(guān)注，后續(xù)會(huì)專門講述中繼器

四、局部變量

利用局部變量來(lái)制作tab標(biāo)簽頁(yè)效率可以翻倍提升，你知道么？

操作步驟：

1. 拖出一個(gè)tab 標(biāo)簽頁(yè)的元件，設(shè)置好交互元件樣式。
2. 有幾個(gè)狀態(tài)就添加幾個(gè)狀態(tài)面板（常規(guī)操作）進(jìn)行命名，且面板名稱與tab標(biāo)簽頁(yè)名稱一致。
3. 給標(biāo)簽設(shè)置交互動(dòng)作，點(diǎn)擊時(shí)面板狀態(tài)為L(zhǎng)VAR1，且LVAR1是標(biāo)簽文字。
4. 復(fù)制出其他標(biāo)簽頁(yè)，更改名稱。
5. 制作完成，預(yù)覽看看吧。