axure教程 axure新手入門基礎(chǔ)

《axure教程 axure新手入門基礎(chǔ)》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫。

1、Axure教程axure新手入門基礎(chǔ)（1）2013-08-1921:43?清茶悟道?分類：原型設(shè)計?微信二維碼首先做個聲明：此次教程里為了快速完成，借用了一些網(wǎng)上已有教程的圖文，不是剽竊，只圖方便。另外，因?yàn)闈h化版本可能功能名稱等略有差別，請自行理解。名詞解釋：線框圖：一般就是指產(chǎn)品原型，比如：把線框圖盡快畫出來和把原型盡快做出來是一個意思。axure元件：也叫axure組件或axure部件，系統(tǒng)自帶了一部分最基礎(chǔ)常用的，網(wǎng)上也有很多別人做好的，軟件使用到一定階段可以考慮自己制作元件，以便提高產(chǎn)品原型的制作速度。生成原型：是指把繪制好的原型通過axurerp生成靜態(tài)的html頁

2、面，檢查原型是否正確，同時，方便演示。建議生成時選擇用谷歌瀏覽器打開（第一次會有提示安裝相關(guān)插件），ie會每次都有安全提示，不如谷歌瀏覽器方便。（一）?Axurerp的界面?1-主菜單工具欄：大部分類似office軟件，不做詳細(xì)解釋，鼠標(biāo)移到按鈕上都有對應(yīng)的提示。2-主操作界面：繪制產(chǎn)品原型的操作區(qū)域，所有的用到的元件都拖到該區(qū)域。3-站點(diǎn)地圖：所有頁面文件都存放在這個位置，可以在這里增加、刪除、修改、查看頁面，也可以通過鼠標(biāo)拖動調(diào)整頁面順序以及頁面之間的關(guān)系。4-axure元件庫：或者叫axure組件庫、axure部件庫，所有軟件自帶的元件和加載的元件庫都在這里，這里可以執(zhí)行

3、創(chuàng)建、加載、刪除axure元件庫的操作，也可以根據(jù)需求顯示全部元件或某一元件庫的元件。5-母版管理：這里可以創(chuàng)建、刪除、像頁面頭部、導(dǎo)航欄這種出現(xiàn)在每一個頁面的元素，可以繪制在母版里面，然后加載到需要顯示的頁面，這樣在制作頁面時就不用再重復(fù)這些操作。6-頁面屬性：這里可以設(shè)置當(dāng)前頁面的樣式，添加與該頁面有關(guān)的注釋，以及設(shè)置頁面加載時觸發(fā)的事件onpageload。7-元件屬性：這里可以設(shè)置選中元件的標(biāo)簽、樣式，添加與該元件有關(guān)的注釋，以及設(shè)置頁面加載時觸發(fā)的事件；A-交互事件:元件屬性區(qū)域閃電樣式的小圖標(biāo)代表交互事件；B-元件注釋：交互事件左面的圖標(biāo)是用來添加元件注釋的，在這里

4、我們能夠添加一些元件限定條件的注釋，比如：文本框的話，可以添加注釋指出輸入字符長度不能超過20。C-元件樣式：交互事件右側(cè)的圖標(biāo)是用來設(shè)置元件樣式的，可以在這里更改原件的字體、尺寸、旋轉(zhuǎn)角度等，當(dāng)然也可以進(jìn)行多個元件的對齊、組合等設(shè)置。8動態(tài)面板：這個是很重要的區(qū)域，在這里可以添加、刪除動態(tài)面板的狀態(tài)，以及狀態(tài)的排序，也可以在這里設(shè)置動態(tài)面板的標(biāo)簽；當(dāng)繪制原型動態(tài)面板被覆蓋時，我們可以在這里通過點(diǎn)擊選中相應(yīng)的動態(tài)面板，也可以雙擊狀態(tài)進(jìn)入編輯。Axurerp的界面就介紹到這里，界面中的各個區(qū)域基本上在做產(chǎn)品原型的過程中，使用都很頻繁，所以建議不要關(guān)閉任何一個區(qū)域。如果不小心關(guān)閉了

5、，可以通過主菜單工具欄—視圖—重置視圖來找回。Axure教程axure新手入門基礎(chǔ)（2）2013-08-1921:47?清茶悟道?分類：原型設(shè)計?微信二維碼（二）Axurerp的線框圖元件?l?圖片圖片元件拖入編輯區(qū)后，可以通過雙擊選擇本地磁盤中的圖片，將圖片載入到編輯區(qū)，axure會自動提示將大圖片進(jìn)行優(yōu)化，以避免原型文件過大；選擇圖片時可以選擇圖片原始大小，或保持圖片元件的大小。l?文本在網(wǎng)頁中文本的名稱是lable，用于頁面中添加說明文字、文字連接，或一些動態(tài)的提示。l?矩形矩形的應(yīng)用比較廣泛，比如作為頁面的背景、按鈕、以及一些元件的遮蓋等；矩形的形狀可以通過鼠標(biāo)右鍵點(diǎn)擊

6、–編輯選項(xiàng)—改變形狀，來變成我們需要的形狀，比如做選項(xiàng)卡時候我們需要頂部圓角的矩形，就可以通過改變矩形的形狀來實(shí)現(xiàn)。l?占位符制作原型時，可以用它來代替對一些沒有交互或者交互比較簡單容易說明的區(qū)域；也可以做成關(guān)閉按鈕。占位符在保真比較高的產(chǎn)品原型中作用不大。l?圓角矩形這個個人認(rèn)為是因?yàn)閳A角矩形應(yīng)用廣泛，所以單獨(dú)拿出來作為元件給使用者，免去了對矩形的設(shè)置。l?動態(tài)面板非常重要的axure元件，必須要學(xué)會使用的元件，動態(tài)面板的顯示、隱藏、多狀態(tài)等，都是非常有用的。在這里不過多介紹，詳細(xì)介紹請參考：小樓axure圖文教程（五）動態(tài)面板的使用。l?水平線就是一條水平的線，可以作為表示

7、頁面一些區(qū)域分割時使用，比如在兩塊不同區(qū)域之間添加一條水平線，來明顯的區(qū)分。水平線可以通過設(shè)置元件屬性中的角度Roto變成斜線來使用。l?垂直線沒什么好說的，和水平線一樣的作用。l?圖片熱區(qū)用于點(diǎn)擊圖片中某個區(qū)域產(chǎn)生交互事件時使用，圖片熱區(qū)也是矩形的一種，可以通過設(shè)置矩形無邊框，背景色100%透明度來實(shí)現(xiàn)。l?文本框（單行）用于輸入文字的axure元件，用于登錄、標(biāo)題、密碼框（鼠標(biāo)右鍵–編輯選項(xiàng)–隱藏文本）等功能。l?文本框（多行）從字面意思就知道了它的功能，用于實(shí)現(xiàn)更多文字內(nèi)容輸入的axu