1、打開Axure工具，在歡迎頁面選擇“New File”，界面如下：

2、右擊左邊Pages中的Page1，選擇Rename，可重命名該頁面，我們重命名為“音樂播放頁面”。

3、打開我們自己手機中的音樂播放器中的音樂播放頁面，截圖，做參照用，此處我用的是咪咕音樂，復制截圖，粘貼到該page頁面中，如圖所示：

4、如上圖，底色是白色的，此時圖片與底色的邊界不清晰，我們先修改底色。方法：選中空白部分，點擊右側STYLE中的Color，選擇深一點的顏色，邊界變清晰，如下圖：

5、下面我們比照此圖，畫出自己的音樂播放頁面。首先按住Ctrl+鼠標滾輪下滾，使參照頁面都顯示在屏幕上，接下來，拖動一個Box1，放在參照圖的右邊，并調整大小與左圖相同，調整時注意把W和H中的小鎖解除鎖定，如下圖。

6、觀察參照圖片，圖片大體可分為如下標出的5部分，分別為歌曲名、專輯圖片、歌詞、個人設置和進度控制5部分：

7、按住標尺往下拉，在需要標尺標記的部分添加標尺線，如圖，需要下拉5次：

8、添加歌曲名稱，先拖拽一個Box1到第一個標尺線下，再調整文字的大小、字體和粗細，再修改右側BORDER下的Thickness為0去掉邊框，如下圖：

9、接下來添加作者及音效情況，按住鍵盤上的CTRL鍵，拖動“蘭亭序”這個Box，可復制Box，我們復制出三個來排列好，如下圖：

、

10、先修改作者的文字及樣式，修改文字后，再修改其大小、文字顏色和粗細，如下圖：

11、再修改音質，涉及文字的大小、文字顏色、粗細和邊框，如下圖：

12、再修改音效，涉及文字的大小、顏色、粗細和邊框，如下圖。

注意，這里的文字和邊框顏色，如果摸不準可以用拾色器，如下圖，點擊一下拾色器，再點擊有想要的顏色的部分就可以取到了。

這里的邊框是圓角的，我們這樣調整，選擇文本框后，左上角會出現小三角，往里拉小三角即可，如下圖。

13、接下來拖動一個image，并調整大小，當做專輯圖片

14、再拖動一個H1，輸入內容并調整相關參數，當做歌詞：

15、接下來拖動圓圈調整大小當做個人設置圖標，并設置圖標向上對齊和圖標間距相等，進度圖標同理：

16、拉兩條橫線，分別作為總進度條和已播放進度，將總進度條調整長度后拉到最下面的標尺線處，已播放進度條設置邊框顏色為紅色后先放一邊：

17、選中全部標尺線刪除。將已播放進度條拉至總進度條左側與總進度條重合。拖動一個圓圈，填充上紅色，并調整大小為30*30，拖到已播放進度條尾部。

完成。