Axure使用幫助小tips

01.關(guān)于Axure元件使用的一些建議埠戳。

從元件庫中找元件是非常麻煩的一件事饱亿,而且不方便對相關(guān)元件進(jìn)行修改。個人建議的工作方法是恢总,新建項目原型時把需要用到的元件整理到專門新建的頁面中,用于快速的復(fù)用睬愤。這樣有兩個好處片仿,一個是可以快速到自己要用到元件。二是有一些元件類型可以在設(shè)計過程中對一些元件進(jìn)行修改和改造尤辱,便于梳理出自己常用的使用類型砂豌。

02.Axure意外崩潰如何找回未保存的文件厢岂?

如果在原型設(shè)計過程中軟件或系統(tǒng)意外崩潰,而文件又沒有來得及保存的話阳距,可以通過文件菜單下的從備份中恢復(fù)找回自動保存的文件塔粒。另外,在自動恢復(fù)設(shè)置中可以設(shè)置自動備份的間隔時長筐摘;

03.如何實(shí)現(xiàn)預(yù)覽時頁面水平居中的效果卒茬?

將頁面樣式下的頁面排列設(shè)置為水平居中即可實(shí)現(xiàn)該效果,但是這個設(shè)置只對當(dāng)前頁面有效咖熟,如果你需要設(shè)置當(dāng)前原型的全局的水平居中屬性圃酵,可以通過菜單欄里項目下的頁面樣式編輯,設(shè)置默認(rèn)頁面樣式Default的排列方式馍管。另外郭赐,但是設(shè)置了頁面排列后預(yù)覽時發(fā)現(xiàn)仍沒有在瀏覽器中居中,則可能的原因是:原型中有元件的寬度超過了瀏覽器的寬度确沸;

04.如何設(shè)置打開原型時不顯示工具欄捌锭?

在預(yù)覽原型時可以通過“發(fā)布—預(yù)覽選項”設(shè)置工具欄的顯示方式,分別為:開啟頁面列表张惹、關(guān)閉頁面列表舀锨、最小化工具欄、不加載工具欄四個選項宛逗。在原型導(dǎo)出時也可以通過“發(fā)布HTML—生成HTML文件—常規(guī)”中設(shè)置工具欄的顯示方式坎匿,原型生成HTML完成后會自動打開瀏覽器,瀏覽器中生成的地址就是你設(shè)置的工具欄的顯示方式雷激。

如果我們從生成的HTML文件目錄中打開原型文件時替蔬,如何能按自己的需要顯示工具欄呢?在生成完成的HTML文件目錄中會發(fā)現(xiàn)有三個文件start.html屎暇、start_c_1.html承桥、start_g_0.html,這三個文件就是對應(yīng)的工具欄的顯示方式的框架根悼,它們分別是:start.html(開啟頁面列表)凶异、start_c_1.html(最小化工具欄)、start_g_0.html(關(guān)閉頁面列表)挤巡,只要打開對應(yīng)的文件就會按對應(yīng)的方式顯示工具欄剩彬。另外,如果想要不加載工具欄的效果只需要打開對應(yīng)的頁面文件就可以矿卑,例如你生成的HMTL文件中有一個首頁.html的文件喉恋,你直接打開這個文件的時候就不會加載工具欄了。

在原型的演示地址后臺添加對應(yīng)的參數(shù)也可以按對應(yīng)的方式打開原型,例如你打開的原型鏈接的默認(rèn)結(jié)尾是start.html轻黑,將后綴修改成對應(yīng)的參數(shù):start.html(開啟頁面列表)糊肤、start.html#g=0(關(guān)閉頁面列表)、start.html#c=1(最小化工具欄)氓鄙、start.html#c=2(不加載工具欄)

05.關(guān)于輔助線的使用方法或技巧介紹馆揉。

建議你在編輯界面中通過參考線來輔助排版,這樣可以更快速方便的進(jìn)行布局抖拦。輔助線還有一個特性就是當(dāng)你拖動元件靠近它時把介,元件會自動吸附到輔助線的邊緣達(dá)到快速對齊的效果,對于有對齊強(qiáng)迫癥的朋友來說這個特性會感覺無比貼心蟋座。輔助線的基本使用方法:鼠標(biāo)移動到編輯區(qū)域的左側(cè)和頂部的標(biāo)尺區(qū)域長按并往編輯區(qū)域拖動時就可以生成橫向或縱向的輔助線,將輔助線拖動到對應(yīng)的位置即可脚牍。

補(bǔ)充幾點(diǎn)輔助線的使用小技巧:

? 右擊輔助線可以將其鎖定向臀,以防止拖動元件時會將輔助線會跟著一起移動;

? 可以通過按住Ctrl拖動創(chuàng)建全局輔助線诸狭,全局輔助線就是在所有頁面中產(chǎn)生一條相同的輔助線券膀;

? 在“布局—柵格和輔助線—鎖定輔助線”中選中可以將所有的輔助線保持鎖定狀態(tài)且無法刪除;

? 在“布局—柵格和輔助線—刪除輔助線”中可以清除所有頁面中的輔助線驯遇;

? 在“布局—柵格和輔助線—輔助線設(shè)置”中可以修改輔助線的顏色或進(jìn)行更多設(shè)置芹彬;

06.將SVG圖標(biāo)轉(zhuǎn)換為矢量圖型的方法;

SVG是一種矢量的圖標(biāo)格式叉庐,你可以將下載到的SVG圖標(biāo)直接拖入到Axure的編輯界面中舒帮,支持隨意縮放而且不會失真。在Axure 8.0的3312的以上版本中陡叠,新加入了可以將SVG圖標(biāo)轉(zhuǎn)換為形狀的實(shí)用功能玩郊,只需要選中對應(yīng)的SVG圖標(biāo)右擊“轉(zhuǎn)換SVG圖片為形狀”即可。SVG圖標(biāo)轉(zhuǎn)換為形狀后枉阵,除了支持隨意縮放之外译红,還可以根據(jù)需要修改顏色和外觀。如果你還沒有使用過這個功能建議趕緊嘗試一下兴溜,當(dāng)然你的Axure版本首先需要升級到8.0.0.3312以上侦厚。另外,推薦阿里巴巴的團(tuán)隊推出的圖標(biāo)分享平臺iconfont拙徽,它提供了非常豐富和全面的圖標(biāo)下載刨沦,通過搜索功能就能快速檢索到自己需要的圖標(biāo)躯舔。iconfont上的支持圖標(biāo)自定義顏色和尺寸亡资,并提供SVG\PNG等多種格式的下載橡淑。

07.關(guān)于函數(shù)/變量的一些使用建議兆龙;

對于剛接觸Axure的同學(xué)不需要太深入了解函數(shù)和變量的使用方法江解,不過如果能掌握一些基礎(chǔ)函數(shù)的使用方法,可以運(yùn)用到很多原型設(shè)計的交互細(xì)節(jié)中奸柬,了解函數(shù)的更多使用方法可以查看網(wǎng)站上提供的AxureRP函數(shù)及運(yùn)算符說明文檔偎捎。另外,網(wǎng)站上的交互實(shí)例欄目中提供了很多關(guān)于函數(shù)和變量方面的交互例子可供參考讳癌,點(diǎn)擊這里可以查看演示及下載穿稳。

08.使用中繼器管理內(nèi)容列表元素;

Axure里的中繼器元件一般是用于實(shí)現(xiàn)動態(tài)數(shù)據(jù)效果的晌坤,但是利于它的特性可以用來方便的管理內(nèi)容列表元素逢艘。例如我們需要創(chuàng)建一個多行內(nèi)容的列表,只要先編輯好一行的元素骤菠,然后將它復(fù)制到中繼器中它改,再在中斷器中批量增加行數(shù),這樣的一個多行的數(shù)據(jù)排列就創(chuàng)建好了商乎。中繼器的創(chuàng)建方法很簡單央拖,從軟件的元件面板中拖動到編輯界面中即可。新創(chuàng)建的中繼器默認(rèn)有3行鹉戚,你可以刪除掉里面的元素鲜戒,然后在里面編輯自己所需要的元素即可。選中中繼器元件時在右側(cè)的屬性中抹凳,我們可以通過中斷器的行管理上方的圖標(biāo)快速的新增和刪除行數(shù)遏餐。在中繼器的樣式管理中,我們還可以對它的樣式赢底、間距失都、布局方式進(jìn)行設(shè)置。例如颖系,你可以控制每行或每列顯示的數(shù)量嗅剖,通過這些設(shè)置可以用它來創(chuàng)建類型更豐富的列表方式。

09.如何設(shè)置常見的按紐組選中效果嘁扼;

例如我們需要對A和B設(shè)置按紐組選中效果信粮,首先同時選擇A和B這兩個按紐,在屬性中設(shè)置選中的交互樣式及設(shè)置選項組名稱趁啸。然后對每個按紐添加鼠標(biāo)單擊時的交互事件强缘,設(shè)置選中—當(dāng)前元件—true,這樣就實(shí)現(xiàn)了點(diǎn)擊A時A為選中狀態(tài)B為非選中狀態(tài)不傅,點(diǎn)擊B時B為選中狀態(tài)A為非選中狀態(tài)的效果

10.關(guān)于動態(tài)面板的一些使用技巧旅掂;

? 動態(tài)面板如果沒有勾選了“自動調(diào)整為內(nèi)容尺寸”則需要設(shè)置顯示滾動條,不然超過動態(tài)面板尺寸的將顯示不全访娶;

? 動態(tài)面板的禁用和選中商虐,將動態(tài)面板設(shè)置為選中、取消選中、切換選中或禁用則動態(tài)面板中的元件都會處于選中秘车、取消選中典勇、切換選中狀態(tài)或禁用。利用這個特性可以做復(fù)選框的切換選中效果叮趴;

? 動態(tài)面板點(diǎn)擊時顯示割笙,再次點(diǎn)擊時隱藏的效果實(shí)現(xiàn)方法:通過用例編輯器中設(shè)置切換動態(tài)面板的可見性;

? 動態(tài)面板的“固定到瀏覽器”屬性可以將動態(tài)面板始終固定在頁面中某個位置眯亦;

? 不要使用動態(tài)面板做簡單的交互伤溉,動態(tài)面板是個強(qiáng)大的工具,可以用來設(shè)計任何需要多狀態(tài)顯示的頁面內(nèi)容妻率。但也很容易增加復(fù)雜性乱顾,最好不要依賴到復(fù)雜的動態(tài)面板;

? 很多剛接觸Axure的新手容易犯的一個錯誤就是喜歡濫用動態(tài)面板宫静,例如在設(shè)計移動端原型時會將很多界面用動態(tài)面板堆砌在一起頁面內(nèi)糯耍,這樣會造成演示時頁面非常卡頓囊嘉,而且輸出的文件很大,更麻煩的是不便于后期的修改維護(hù)革为。建議大家在設(shè)計原型時梳理好自己的原型結(jié)構(gòu)扭粱,合理的使用動態(tài)面板。

11.保持良好的命名習(xí)慣和規(guī)范震檩;

為了方便修改維護(hù)我們的原型文件琢蛤,請在設(shè)計過程中對相關(guān)元件保持良好的命名習(xí)慣和規(guī)范。一般需要命名的元件類型包括:動態(tài)面板抛虏、母版博其、有交互事件的元件。命名的方式可以根據(jù)當(dāng)前元件的類型或交互效果來定迂猴,例如針對提示的動態(tài)面板慕淡,面板名稱的名稱可以命為“提示”,對應(yīng)的狀態(tài)名稱可以命名為“用戶名錯誤”沸毁、“密碼錯誤”等對應(yīng)的交互反饋類型峰髓。

12.不要糾結(jié)于細(xì)節(jié)的交互效果;

原型設(shè)計要兼顧傳達(dá)需求息尺、輸出效率携兵、方便維護(hù)三個方面,所以在設(shè)計過程中不需要太糾結(jié)于細(xì)節(jié)的交互細(xì)節(jié)搂誉,對于一些實(shí)現(xiàn)方式過于復(fù)雜的交互細(xì)節(jié)建議可以用文字描述的方式進(jìn)行說明徐紧。我們并不推薦大家過度追求原型設(shè)計的高保真度,在實(shí)現(xiàn)的項目原型設(shè)計過程中應(yīng)該盡量考慮到實(shí)際需求和進(jìn)度情況。

13.如何給頁面或元件增加描述說明并级?

在頁面或元件中增加相關(guān)的規(guī)則描述說明拂檩,可以幫助開發(fā)人員更方便的理解相關(guān)的需求規(guī)則,是一種可以快速輸出需求的方式死遭。頁面說明的添加方法:在頁面的檢視面板里的說明標(biāo)簽中可以為當(dāng)前頁面添加說明注釋广恢,增加了頁面描述說明后可以在演示時左側(cè)的工具欄中描述標(biāo)簽中查看到。通過檢視面板里的說明標(biāo)簽中的自定義字段還可以新增或修改說明的類型名稱呀潭。在原型的預(yù)覽和導(dǎo)出設(shè)置中可以設(shè)置頁面說明是否需要導(dǎo)出钉迷;

元件說明的添加方法:選中對應(yīng)的元件在檢視面板的說明標(biāo)簽中添加元件說明注釋。增加了注釋的元件在原型演示時會在右上角顯示一個藍(lán)色的說明圖標(biāo)钠署,點(diǎn)擊就可以看到的注釋文字內(nèi)容了糠聪。在原型的預(yù)覽和導(dǎo)出設(shè)置中可以設(shè)置元件說明是否需要導(dǎo)出,在原型演示時在工具欄中通過元件說明的控制圖標(biāo)可以切換元件說明的顯示或隱藏谐鼎。如果一個元件已經(jīng)增加了說明注釋舰蟆,同時這個元件已經(jīng)跟其它元件進(jìn)行了組合,這時選擇的時候會默認(rèn)選中組合狸棍,需要再次點(diǎn)擊對應(yīng)的元件才能選中并修改說明注釋身害。另外,復(fù)制元件后注意修改對應(yīng)元件的說明注釋草戈;

14.如何在Axure快速創(chuàng)建站點(diǎn)結(jié)構(gòu)圖塌鸯;

有時我們需要把整個站點(diǎn)的結(jié)構(gòu)用樹形圖呈現(xiàn)出來,Axure為此提供了一個快捷的方法:在頁面區(qū)域?qū)?zhǔn)你希望生成樹形圖的主干點(diǎn)右鍵唐片,選擇“生成流程圖”丙猬,就能自動生成圖表形式的站點(diǎn)地圖。點(diǎn)擊圖表上的每個控件费韭,就會去到對應(yīng)的頁面茧球;

15.關(guān)于Axure中元件屬性和樣式的說明;

? Axure中不同的元件類型的屬性和樣式設(shè)置方式是有差異的星持,選中元件時可以在檢視面板中查看到對應(yīng)的屬性或樣式設(shè)置抢埋;

? 選中元件右擊在交互樣式菜單中可以設(shè)置鼠標(biāo)懸停、鼠標(biāo)按下督暂、選中羹令、禁用等效果,也可以能過元件的檢視面板中的屬性進(jìn)行設(shè)置损痰;

? 選中元件時在檢視面板的屬性中增加“元件提示”可實(shí)現(xiàn)鼠標(biāo)移入時顯示元件提示的內(nèi)容福侈;

? Axure中有自帶一些形狀的如箭頭、三角形卢未、圓形等肪凛,在右側(cè)的“元件屬性與樣式”中可以進(jìn)行設(shè)置堰汉;

? Axure支持對圖片進(jìn)行裁剪、拼接伟墙,同時你也可以將元件轉(zhuǎn)化為圖片翘鸭;

? 在文本輸入框?qū)傩灾锌梢栽O(shè)置類型、提示文字戳葵、最大長度等各種屬性就乓。另外,各種表單元件類型的屬性類型也不同拱烁;

? 內(nèi)聯(lián)框架設(shè)置默認(rèn)頁面的方法為:雙擊內(nèi)聯(lián)框會彈出界面鏈接設(shè)置或在內(nèi)聯(lián)框中右鍵點(diǎn)擊“框架目標(biāo)頁面”生蚁;

? 在頁面檢視面板的屬性中設(shè)置草圖效果可以生成手繪風(fēng)格的線框圖效果;

? 建議使用組合功能對多個元件進(jìn)行整合戏自,方便移動和調(diào)整尺寸邦投,組合支持部分常用交互和屬性設(shè)置;

小結(jié).關(guān)于Axure其它實(shí)用技巧總結(jié)整理擅笔;

? WEB端原型設(shè)計建議內(nèi)容區(qū)域?qū)挾仁褂?000px或1200px志衣,移動端原型設(shè)計建議內(nèi)容區(qū)域?qū)挾仁褂?75px;

? 元件的寬度建議保持為5和10的倍數(shù)猛们,元件的間距建議為10px或20px念脯;

? 使用鍵盤方向鍵移動選中的元件時每次移動距離為1px ,使用ctrl+鍵盤方向鍵每次移動距離為10px弯淘;

? 按住Ctrl+鼠標(biāo)拖動可以快速的復(fù)制元件和二,按住Shift+鼠標(biāo)拖動可以垂直或水平的移動元件;

? 字體字號建議使用偶數(shù)耳胎,常用的正文字號為12、14惕它,常用的標(biāo)題字號為16怕午、18、20淹魄;

? 選中多個元件時郁惜,可以使用頂部工具欄中的對齊工具快速的對多個元件進(jìn)行各種對齊處理;

? 選中多個元件時甲锡,可以使用頂部工具欄中的分布工具快速的對多個元件進(jìn)行垂直或水平分布處理兆蕉;

? 為了防止元件被誤操作移動,可以使用頂部工具欄中的鎖定工具或者右擊鎖定元件缤沦,鎖定的元件是無法拖動移動的虎韵;

? 需要重復(fù)使用的元件,建議創(chuàng)建成母版使用缸废。如果修改了母版包蓝,所以頁面中的母版元件將會被同步修改驶社;

? 使用外部元件可以提升原型設(shè)計的效率,建議將常用的元件整理成一套自用的元件庫测萎;

? 對于添加打開鏈接的用例亡电,如果選擇在新窗口新標(biāo)簽中打開后,新窗口中將不顯示站點(diǎn)地圖硅瞧;

? 通過發(fā)布菜單下的生成HTML—設(shè)置中可以選擇生成全部頁面和選擇生成部分頁面份乒;

? 通過文件菜單下的導(dǎo)出頁面為圖片可將對應(yīng)的頁面保存為圖片文件,導(dǎo)出所有頁面為圖片可以將整個原型中頁面批量保存為圖片文件腕唧;

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末或辖,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子四苇,更是在濱河造成了極大的恐慌孝凌,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,968評論 6 482
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件月腋,死亡現(xiàn)場離奇詭異蟀架,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)榆骚,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,601評論 2 382
  • 文/潘曉璐 我一進(jìn)店門片拍,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人妓肢,你說我怎么就攤上這事捌省。” “怎么了碉钠?”我有些...
    開封第一講書人閱讀 153,220評論 0 344
  • 文/不壞的土叔 我叫張陵纲缓,是天一觀的道長。 經(jīng)常有香客問我喊废,道長祝高,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,416評論 1 279
  • 正文 為了忘掉前任污筷,我火速辦了婚禮工闺,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘瓣蛀。我一直安慰自己陆蟆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,425評論 5 374
  • 文/花漫 我一把揭開白布惋增。 她就那樣靜靜地躺著叠殷,像睡著了一般。 火紅的嫁衣襯著肌膚如雪诈皿。 梳的紋絲不亂的頭發(fā)上溪猿,一...
    開封第一講書人閱讀 49,144評論 1 285
  • 那天钩杰,我揣著相機(jī)與錄音,去河邊找鬼诊县。 笑死讲弄,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的依痊。 我是一名探鬼主播避除,決...
    沈念sama閱讀 38,432評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼胸嘁!你這毒婦竟也來了瓶摆?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,088評論 0 261
  • 序言:老撾萬榮一對情侶失蹤性宏,失蹤者是張志新(化名)和其女友劉穎群井,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體毫胜,經(jīng)...
    沈念sama閱讀 43,586評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡书斜,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,028評論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了酵使。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片荐吉。...
    茶點(diǎn)故事閱讀 38,137評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖口渔,靈堂內(nèi)的尸體忽然破棺而出样屠,到底是詐尸還是另有隱情,我是刑警寧澤缺脉,帶...
    沈念sama閱讀 33,783評論 4 324
  • 正文 年R本政府宣布痪欲,位于F島的核電站,受9級特大地震影響攻礼,放射性物質(zhì)發(fā)生泄漏业踢。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,343評論 3 307
  • 文/蒙蒙 一秘蛔、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧傍衡,春花似錦深员、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,333評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至绣的,卻和暖如春叠赐,著一層夾襖步出監(jiān)牢的瞬間欲账,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,559評論 1 262
  • 我被黑心中介騙來泰國打工芭概, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留赛不,地道東北人。 一個月前我還...
    沈念sama閱讀 45,595評論 2 355
  • 正文 我出身青樓罢洲,卻偏偏與公主長得像踢故,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子惹苗,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,901評論 2 345

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