畢業設計微信小程序音樂播放器

原創

2020-02-27 19:52

大學室友根據網易雲的API自己製作的微信小程序，獲得校級優秀畢業設計（如果你是大佬請繞行），下面簡單介紹一下：

根據多次的使用不同的音樂APP發現，網易雲音樂的頁面設計最適合作爲本微信小程序的頁面基礎模板。由於本作品是微信小程序，就需要剔除APP中的各種冗餘的功能，頁面設計也需要儘可能的簡單直接，內容也要充實。然後根據以上幾點，對應用的功能模塊進行大量的分析與重構，最終確定應用的主體架構如圖3-1所示。

圖3-1 主要頁面結構圖

如圖所示，可以看出本微信音樂播放器的結構主要有三大部分組成：在第一部分的登錄頁面中，輸入已有的網易雲音樂賬號和密碼然後點擊登錄就可以進入“發現音樂”和“我的音樂”頁面。第二部分是本微信音樂播放器的最主要的頁面，本頁面總共分了四個子頁面以及一個跳轉頁面，在“個性推薦”頁面，有輪播圖推薦、FM、每日歌曲歌單推薦等等，這些都能很好的滿足基本推薦需求；在“歌單”頁面，有今日推薦的全部歌單，並且可以通過右上角的分類來篩選歌單；在主播電臺頁面，這裏會推薦各種精彩的電臺；在“排行榜”頁面，會有網易雲音樂官方的排行榜以及各類的全球榜；“搜索”頁面可以搜索歌曲、歌單、專輯等等諸多內容。第三部分“我的音樂”是用戶自己的頁面，上方展示了用戶最近播放的歌曲、雲盤以及收藏的歌曲，下面就是用戶已經創建好的歌單、喜歡的音樂以及收藏的歌單等等。這幾個主要頁面構成了本播放器的主體，在這些頁面中也實現了不少功能。

模塊需求描述

本微信小程序是一款擁有基礎功能卻又不侷限於僅有基礎功能的音樂播放器，在做到播放功能、搜索功能等等的基礎之後，還需要實現歌單歌曲推薦、排行榜、歌曲評論等等附加功能。這些將會很好的提升用戶體驗。在本作品中，主要涉及下述模塊：login模塊，home模塊，個人中心模塊，專輯模塊，歌手模塊，DJ廣播模塊，FM電臺模塊，歌單模塊，播放模塊，播放列表模塊，評論模塊，排行榜模塊，搜索模塊，相似單曲推薦模塊，熱門推薦模塊等等。

登錄模塊，這是本微信小程序的入口模塊，點擊輸入正確的網易雲音樂用戶名以及密碼然後點擊登錄就可以進入主頁面。主頁模塊是主頁面，默認是展示“個性推薦”這個子頁面，在頂部還可以選擇“歌單”、“主播電臺”或者“排行榜”等子頁面，“個性推薦”中的最上面會有一個輪播圖推薦，下面有FM、歌曲推薦以及雲音樂熱歌推薦；接着會有推薦歌單、最新歌曲以及主播電臺的展示效果，每個區域裏會展示六個推薦的內容。在“歌單”這個子頁面中，會顯示所有當前熱門歌單，還可以通過右上角的“選擇分類”中設置自己的聽歌口味後進行篩選歌單。“主播電臺”這個子頁面中會有精彩電臺節目推薦以及熱門電臺，方便用戶找到屬於自己的電臺。“排行榜”子頁面展示了網易雲官方排行榜以及各種全球榜。個人主頁模塊裏面包含了最近播放、我的雲盤、我的收藏以及用戶自己創建以及收藏的歌單。專輯模塊裏面有專輯裏面的所有音樂，以及專輯封面、歌手以及專輯發行時間。

小程序主頁面

在設計小程序的主頁面的時候，我查看了很多音樂APP的主頁，發現大多數的主頁面都平平，只有網易雲音樂的主頁比較充實。於是在主頁面添加了一個輪播圖用來展示新歌的推薦，輪播圖的下面有FM、今日歌曲推薦以及熱歌榜，這可以讓用戶根據自己的喜好去查看想要欣賞的音樂。下面還有歌單、歌曲以及電臺推薦，在這裏的推薦會展示出一些推薦歌曲歌單等的封面、名稱以及播放量來吸引用戶發現新的音樂，主頁面如圖4-2所示。