菜鳥必知的幾個Axure小設計

標籤：

以下介紹幾個常用Axure教程，還是那句話——內容簡單，適合菜鳥查閱，老鳥可飄過，順便幫忙點個贊哈

/偷笑。

一．頂部導航凍結，頁面下拉可跟隨

例如：下拉網頁進行瀏覽，頂部導航懸停，固定在頂部位置

示範

1.按照自己理解，拖動幾個元件，把導航和主體頁面設計好；

2.導航處，右鍵設定“轉換為動態面板”，並命名top；

3.頁面空白處，選擇互動方式（視窗滾動時）；

4.添加動作移動→選擇導航→移動：絕對位置→X座標為0,Y座標插入變數或函數（Window.scrollY）

步驟1

步驟2

二．註冊模組（手機註冊、郵箱註冊互切換）

示範

1.拖動元件，先布局好手機註冊內容表，所需的內容，包括（手機輸入框，點擊擷取驗證按鈕，2次輸入密碼框，註冊按鈕）；

2.手機註冊內容表，右鍵設定“轉換為動態面板”；

3.手機註冊內容表，右鍵設定“管理面板狀態”，動態面板名稱設定為“add”,下面的面板狀態修改State1的名稱為“iphoneadd”,並添加一個狀態，命名為“emailadd”;

4.點擊“emailadd”，進入動態網頁，為郵箱註冊內容表添加元件，所需的內容（電子郵箱輸入框，2次輸入密碼框，註冊按鈕，邊框）注意：邊框需要去除頂部框線；

5.設定手機註冊、郵箱註冊互切換，對手機註冊框，設定滑鼠點擊互動→添加動作“設定面板狀態”→選擇狀態“iphoneadd”；

6.設定手機註冊、郵箱註冊互切換，對郵箱註冊框，設定滑鼠點擊互動→添加動作“設定面板狀態”→選擇狀態“emailadd”；

步驟1

步驟2

步驟3

三．簡單捲軸設計

示範

1.拖動2個元件，矩形和動態面板，準備一個捲軸素材，我這裡用的是藍色條狀素材；

2.設定矩形長為500，寬為20,（這個看自己愛好），把矩形設定為圓角，個人覺得這樣好看些；

3.把動態面板也設定為長為500，寬為20，匯入條狀素材，覆蓋到圓角矩形上；

4.設定動態面板互動屬性，載入時→添加動作設定尺寸→當前元件→寬1高20；

5.再添加一次設定尺寸動作→當前元件→寬500高20,→動作為線性，時間為5000毫秒（即5秒）

步驟1

原文來自:簡書／產聯不絕_品而第之

菜鳥必知的幾個Axure小設計