axure設計網(wǎng)頁導航菜單原型圖的思路與實例介紹
我要評論Axure8.0是一款原型設計工具，是產品經理必不可少的工具，經常使用Axure制作網(wǎng)頁導航，該怎么制作網(wǎng)頁導航菜單呢？今天我們就來通過一個實例來介紹怎么畫導航菜單的原型設計，以淘寶APP導航為例來詳細說明，詳細請看下文圖文介紹。
一、前期準備
1、首先我們的電腦上需要安裝原型設計工具Axure：
2、需要具備一些基礎的軟件設計知識：
二、導航狀態(tài)制作
1、打開原型設計工具：
2、新建一個母版，命名為導航菜單，然后再工作區(qū)域內拖動兩個長方形，調至合適的尺寸：
3、從庫中拖動一個圖形至畫圖區(qū)，雙擊，從電腦上選擇合適的圖標：
4、雙擊圖標，在右擊的彈出框中選中轉換為動態(tài)面板：
5、之后會彈出一個設置框，修改名稱，以及添加兩種狀態(tài)：選中和未選中：
6、雙擊未選中，然后點擊未選中頁面上的圖標，從電腦上選中未選中的圖標；這樣一個圖標的兩種狀態(tài)就都有了。
7、依照上面的方法，畫出其他四個圖標：
三、制作菜單頁面
根據(jù)導航欄，分別創(chuàng)建5個單獨的頁面，然后命名：
四、制作菜單單機效果
1、選中菜單，雙擊右側鼠標單機時：
2、選中當前窗口：
3、在當前窗口，選擇打開首頁：
4、后面的四個菜單依照上面的方法制作，只是需要根據(jù)菜單選擇不同的頁面，最后的效果如下圖：
五、制作切換效果
1、單機導航菜單母版，右擊選擇添加到頁面中：
2、根據(jù)自己的需求選擇頁面：
3、雙擊首頁：
4、選中右側的頁面載入時：
5、點擊設置面板狀態(tài)，如果選中的是首頁，那么只有首頁頁面狀態(tài)為選中，別的頁面狀態(tài)都為未選中：
6、其他的四個頁面依照上面的步驟設置：
六、最后效果
單機菜單會顯示相應的頁面：
以上就是axure制作網(wǎng)頁導航欄菜單的教程，希望大家喜歡，請繼續(xù)關注腳本之家。
相關推薦：
Axure RP 8設計網(wǎng)頁原型怎么添加水平菜單?
相關文章
Axure RP8怎么使用全局變量? Axure定義全局變量的方法
Axure RP8怎么使用全局變量？Axure RP8制作網(wǎng)頁原型的時候，經常需要使用全局變量，該怎么定義全局變量呢想？下面我們就來看看Axure定義全局變量的方法，需要的朋友可以參2019-07-05
Axure怎么繪制虛線效果的圓形? axure線性圖形的制作方法
Axure怎么繪制虛線效果的圓形？Axure中想要創(chuàng)建一個虛線效果的圓形，該怎么制作這個圖形呢？下面我們就來看看axure線性圖形的制作方法，需要的朋友可以參考下2019-07-04
Axure RP8中文本框怎么添加提示信息？Axure RP8經常會用到文本框元件，該怎么給文本框添加提示信息呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2019-07-02
Axure RP 8圖片元件怎么使用？Axure RP8經常用于設計網(wǎng)頁原型，其中圖片元件很長使用，該怎么使用圖片元件呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2019-07-02
墨刀怎么設計axure中的動態(tài)面板？雖然平時小編制作網(wǎng)頁原型喜歡用axure，但是墨刀中也可以設計網(wǎng)頁的動態(tài)面板，該怎么制作呢？下面我們就來看看詳細的教程，需要的朋友可以2019-07-01
Axure怎么設計網(wǎng)站后臺產品導航欄？Axure中想要設計一款網(wǎng)站后臺的產品導航欄，該怎么制作這個網(wǎng)頁的原型呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2019-06-26
使用瀏覽器預覽Axure原型文件，我們可以根據(jù)習慣或者其他要求來設置默認瀏覽器，例如谷歌、火狐，怎么方便怎么來。Axure8怎么設置默認預覽瀏覽器？請看文章說明2019-06-25
Axure原型怎么設計大于7頁的分頁效果？Axure制作網(wǎng)頁原型的時候，如果遇到大雨7頁的分頁效果，該怎么布局呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2019-06-14
Axure矩形怎么去邊框? Axure矩形隨意去掉邊框的教程
Axure矩形怎么去邊框？Axure中想要將矩形的邊框去掉，該怎么去邊框呢？下面我們就來看看Axure矩形隨意去掉邊框的教程，需要的朋友可以參考下2019-06-11
Axure怎么制作點擊即可刪除Tag標簽動效？Axure中想要制tag標簽，并且有可以刪除的交互效果，該怎么制作呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2019-06-02
