產(chǎn)品必會(huì)的30個(gè)Axure使用技巧

于 Axure原型工具鳞仙,很少有產(chǎn)品經(jīng)過系統(tǒng)學(xué)習(xí),一般都是直接上手峭判,邊摸索邊學(xué)習(xí)开缎,這直接導(dǎo)致很多快捷操作被忽視。筆者在日常工作中總結(jié)出以下小技巧林螃,希望對(duì)各位有幫助奕删。

1.?安裝Axure后要做的第一件事

如果系統(tǒng)崩潰后,再次進(jìn)入時(shí)疗认,系統(tǒng)一般會(huì)提示恢復(fù)最近備份的文件完残。也可以通過文件→從“備份中恢復(fù)”找回最新的版本。

2.?必須會(huì)的快捷鍵

快捷鍵不需要刻意去記憶侮邀,經(jīng)常使用就熟記于心

3.日常技巧匯總

(1)重復(fù)的元件可以轉(zhuǎn)化成母版

對(duì)于多次重復(fù)使用的元件坏怪,每次修改一個(gè)地方,其它也挨個(gè)修改绊茧,這個(gè)時(shí)候我們可以使用“母版”铝宵。

使用到母版元件一樣的元件時(shí),直接在母版區(qū)拖進(jìn)畫布使用华畏。

雙擊母版元件鹏秋,就會(huì)進(jìn)入到母版編輯窗口,修改后的元件會(huì)同步到所有母版元件亡笑。

注意:

使用母版元件時(shí)侣夷,元件里所有的樣式和交互都是一樣的。實(shí)際工作中仑乌,肯定存在不同交互百拓,這時(shí)可以“點(diǎn)擊鼠標(biāo)右鍵——脫離母版”,然后對(duì)這個(gè)元件單獨(dú)操作晰甚。

不要把元件過多的組合變成母板衙传,元件組合越是越多,越可能需要在母版的元件上做修改厕九。

(2)避免使用多余的控件

一個(gè)元件可以實(shí)現(xiàn)的效果蓖捶,不要使用多個(gè)元件。

舉個(gè)例子:兩個(gè)看起來相同的“確認(rèn)”按鈕扁远,實(shí)際上下圖①只有一個(gè)矩形元件俊鱼,而②是由文本框+矩形組成刻像。雖然只多余的一個(gè)元件,但是之后只要需要對(duì)該元件做修改并闲,就一定會(huì)出現(xiàn)多余的操作细睡,非常影響效率。

(3)整合多個(gè)元件——組合帝火,方便移動(dòng)與調(diào)整尺寸

(4)隱藏的元件纹冤,設(shè)置交互顯示時(shí),最好選中:置于頂層购公,避免被遮擋

(5)善用鎖定——不常移動(dòng)的元件進(jìn)行鎖定

鎖定不常移動(dòng)的元件,比如背景頁雁歌,表頭宏浩。好處:避免誤移。

注意:鎖定后的元件靠瞎,不能進(jìn)行選中要注意哦比庄!

(6)選項(xiàng)組命名——實(shí)現(xiàn)單選效果

將多個(gè)可選中的元件設(shè)置成選項(xiàng)組后,每次只能選中一個(gè)元件乏盐,其它元件自動(dòng)取消選中佳窑。

注意:

選項(xiàng)組的名稱必須唯一。尤其是在復(fù)制選項(xiàng)組后父能,一定要先修改選項(xiàng)組名稱神凑!不然會(huì)出現(xiàn):明明設(shè)置的選中效果,但是預(yù)覽時(shí)怎么樣都選不中何吝,這時(shí)就要看看是不是選項(xiàng)組命名重復(fù)溉委。

推薦一個(gè)選項(xiàng)組命名大法:亂敲鍵盤法(不推薦哈,建議規(guī)范化命名)爱榕。

(7)元件提示——鼠標(biāo)懸浮時(shí)會(huì)顯示提示內(nèi)容

步驟如下:

(8)文本框大法——共11種類型

拖拽文本框元件后瓣喊,右側(cè)面板里可選擇不同的文本框類型,選擇不同的類型可以達(dá)到不同的效果黔酥。

如:密碼格式:輸入的內(nèi)容會(huì)被隱藏

數(shù)字格式:只能輸入數(shù)字

文件格式:可以選擇文件

日期格式:可以直接選擇日期

另外藻三,文本框里的預(yù)置文字,可以直接在右側(cè)“提示文字”框輸入跪者。

(9)一個(gè)元件上添加多個(gè)事件

同一個(gè)元件會(huì)出現(xiàn)多種 case棵帽,如點(diǎn)擊登錄按鈕后出現(xiàn)的多種情況。雖然可以通過添加條件判斷來做區(qū)分坑夯,但是一般比較費(fèi)時(shí)岖寞。不那么嚴(yán)格的情況下,我們可以將多個(gè)事件添加同一個(gè)元件上柜蜈,對(duì)事件進(jìn)行命名來區(qū)分仗谆。

操作如下:

(10)動(dòng)態(tài)面板——固定到瀏覽器的某個(gè)位置

比如:將彈窗在屏幕中間顯示指巡、導(dǎo)航固定在頂部。都可以通過固定到瀏覽器實(shí)現(xiàn)隶垮。

步驟如下:

(11)輔助線——快速對(duì)齊元件

輔助線分為兩種:頁面輔助線和全局輔助線藻雪。頁面輔助線只會(huì)在當(dāng)前頁面出現(xiàn),全局輔助線在每個(gè)頁面都會(huì)出現(xiàn)狸吞。

注意:輔助線過多時(shí):布局→柵格和輔助線→取消顯示輔助線(或者刪除輔助線)勉耀。

(12)預(yù)覽原型時(shí),點(diǎn)擊站點(diǎn)導(dǎo)航處的小箭頭蹋偏,可以看到所有帶交互的元件

(13)合并多個(gè) axure 文件

步驟:點(diǎn)擊文件→從RP文件導(dǎo)入→選擇文件→導(dǎo)入便斥。

(14)拖動(dòng)頁面名稱

鼠標(biāo)選擇左側(cè)畫板里的頁面名稱,直接拖入畫布里威始,會(huì)出現(xiàn)頁面名稱的按鈕框枢纠,可以用來做流程圖,點(diǎn)擊頁面名稱按鈕框黎棠,會(huì)直接跳轉(zhuǎn)到對(duì)應(yīng)頁面晋渺。

(15)快速實(shí)現(xiàn)頁面流程圖——頁面快照

拖動(dòng)頁面快照到畫布里,選擇對(duì)應(yīng)的頁面脓斩,會(huì)出現(xiàn)頁面預(yù)覽木西,點(diǎn)擊可進(jìn)入對(duì)應(yīng)頁面。

(16)實(shí)現(xiàn)點(diǎn)擊時(shí)顯示随静,再次點(diǎn)擊時(shí)隱藏八千,用切換(Toggle)即可實(shí)現(xiàn)

(17)實(shí)現(xiàn)鼠標(biāo)滾動(dòng)查看的效果

通過動(dòng)態(tài)面板實(shí)現(xiàn):鼠標(biāo)右鍵→滾動(dòng)條→自動(dòng)顯示滾動(dòng)條

(18)及時(shí)命名、規(guī)范命名

對(duì)要進(jìn)行交互事件的元件和動(dòng)態(tài)面板要及時(shí)命名挪挤,在之后的修改里會(huì)降低很大成本叼丑。另外命名也要規(guī)范化,避免出現(xiàn)重復(fù)扛门、遺漏鸠信、忘記等情況。頁面元件過多時(shí)论寨,找到元件就是一件很費(fèi)時(shí)的事星立。自己可以整理出自己的命名法則。

(19)元件過多時(shí)選中的方法

1)透過上層元件選擇下層元件:多個(gè)元件重疊時(shí)葬凳,想選中下層元件绰垂,元件管理窗口直接找到,元件過多的時(shí)候可以通過搜索火焰,這是命名的重要性就出現(xiàn)了劲装。

2)選中上層元件,等1秒左右,在點(diǎn)擊一次占业,就會(huì)選中下一層元件

3) 使用“查找”功能:Ctrl+F绒怨,通過搜索元件里的文字來找到

(20)按住 Ctrl,將鼠標(biāo)放在元件的邊緣谦疾,移動(dòng)鼠標(biāo)南蹂,就可以旋轉(zhuǎn)部件

(21)鼠標(biāo)放在元件邊緣,按住 shift+鼠標(biāo)左鍵念恍,可以鎖定長(zhǎng)寬比來放大縮小元件

(22)建立回收站文件夾

用來存放淘汰的頁面六剥。但是生成 html 文件時(shí),不要選擇生成回收站內(nèi)容峰伙。

(23)記錄修改內(nèi)容

新建一個(gè)空白頁面疗疟,記錄 rp 文件的改動(dòng),如改動(dòng)時(shí)間瞳氓,版本秃嗜、修改內(nèi)容、修改人等顿膨。

(24)找Icon必備網(wǎng)站:https://www.iconfont.cn/

搜索自己需要的Icon類型,點(diǎn)擊復(fù)制SVG叽赊,粘貼進(jìn)Axure面板里恋沃,點(diǎn)擊鼠標(biāo)右鍵,選擇“轉(zhuǎn)化成矢量圖”必指,就可以對(duì)Icon進(jìn)行顏色的填充與修改了囊咏。

(25)靈感來源>>花瓣:https://huaban.com/

(26)原型尺寸大小(不唯一)

web 原型大兴稹:1440×900/1200×900梅割,app 原型尺寸:375×667

(27)建立自己的元件庫

前輩們已經(jīng)整理了很多,我們可以直接使用外部元件葛家,然后根據(jù)需要建立自己的元件庫户辞。關(guān)注公眾號(hào)xsxh__hahaha,后臺(tái)發(fā)送“元件”即可獲得多個(gè)元件庫癞谒。

總結(jié)

產(chǎn)品設(shè)計(jì)原型的目的是為了更好的傳達(dá)自己的想法底燎。當(dāng)自己的原型能夠滿足要求時(shí),就不需要過度關(guān)注原型細(xì)致度弹砚。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末双仍,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子桌吃,更是在濱河造成了極大的恐慌朱沃,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,311評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異逗物,居然都是意外死亡搬卒,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門敬察,熙熙樓的掌柜王于貴愁眉苦臉地迎上來秀睛,“玉大人,你說我怎么就攤上這事莲祸□灏玻” “怎么了?”我有些...
    開封第一講書人閱讀 152,671評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵锐帜,是天一觀的道長(zhǎng)田盈。 經(jīng)常有香客問我,道長(zhǎng)缴阎,這世上最難降的妖魔是什么允瞧? 我笑而不...
    開封第一講書人閱讀 55,252評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮蛮拔,結(jié)果婚禮上述暂,老公的妹妹穿的比我還像新娘。我一直安慰自己建炫,他們只是感情好畦韭,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,253評(píng)論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著肛跌,像睡著了一般艺配。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上衍慎,一...
    開封第一講書人閱讀 49,031評(píng)論 1 285
  • 那天转唉,我揣著相機(jī)與錄音,去河邊找鬼稳捆。 笑死赠法,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的乔夯。 我是一名探鬼主播期虾,決...
    沈念sama閱讀 38,340評(píng)論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼驯嘱!你這毒婦竟也來了镶苞?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,973評(píng)論 0 259
  • 序言:老撾萬榮一對(duì)情侶失蹤鞠评,失蹤者是張志新(化名)和其女友劉穎茂蚓,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,466評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡聋涨,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,937評(píng)論 2 323
  • 正文 我和宋清朗相戀三年晾浴,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片牍白。...
    茶點(diǎn)故事閱讀 38,039評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡脊凰,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出茂腥,到底是詐尸還是另有隱情狸涌,我是刑警寧澤,帶...
    沈念sama閱讀 33,701評(píng)論 4 323
  • 正文 年R本政府宣布最岗,位于F島的核電站帕胆,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏般渡。R本人自食惡果不足惜懒豹,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,254評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望驯用。 院中可真熱鬧脸秽,春花似錦、人聲如沸蝴乔。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽淘这。三九已至,卻和暖如春巩剖,著一層夾襖步出監(jiān)牢的瞬間铝穷,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評(píng)論 1 262
  • 我被黑心中介騙來泰國打工佳魔, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留曙聂,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,497評(píng)論 2 354
  • 正文 我出身青樓鞠鲜,卻偏偏與公主長(zhǎng)得像宁脊,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子贤姆,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,786評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容