譯者小船：今年早些時候，我向Apple Music（一生的機會）申請平面設計實習，但是被客氣的拒絕了，他們表示盡管非常喜歡我的這個項目，但是希望看到更多的練習和成長。

首先，我是非常受挫的——Northwestern University 沒有提供任何基本的平面設計課程，所以如果要成長都必須靠自學...

...但是當我意識到后，我開始了對Apple Music長達三個月的研究。

對我來說，這是一個讓我可以深入了解UX研究和設計的好機會，可以花費更多時間學習Sketch和Principle的借口，可以跟周圍的人解釋為什么我在繪制粗略的線框圖...

你可以在下面的案例中找到一些為Apple Music存在的問題提供的解決方案，以及未來發展的想法。我的設計過程是基于本質上的用戶研究，Apple官方設計原則，和自己的設計直覺。

介紹

作為一個擁有音樂作品和表演背景的設計師，我總是熱衷于把音樂和技術結合起來。通過設計，我希望有一天能夠使音樂的體驗更容易更令人愉悅。

然而，蘋果音樂總是讓我失望，它正在經歷青春期，即意味著穩步成熟但與完全成熟相比，如Spotify，仍未有足夠吸引力。

為了更好的了解Apple Music，我放下對它之前的印象并開始重新認識。

Apple Music 給人第一印象是混亂的界面和不成熟的視覺效果。

△ 音樂庫

在iOS 10，Apple公司以簡約為原則發布了版本的更新。

雖然這個新的界面有很清晰的導航，可我依舊覺得這里的空間很擁擠。界面讓人感覺凌亂，甚至會產生幽閉恐懼癥，盡管也是使用的簡潔的色彩和大氣的排版，但與Apple的優雅相差甚遠。

我的重設計分為三個步驟，分別包括：

• 核心體驗
• 品牌識別
• 視覺界面

1. 核心體驗：發現音樂

首先我發現使用者一般符合下面的范圍：

△ 標記下自己的位置，我在中間的區域

左邊為收集者：

• 隨著時間收集了大量的音樂
• 更有選擇性的聽音樂

普通聽眾：

• 依賴播放列表/推薦內容
• 可能已經在使用Spotify

打開Apple Music 你可能會在說明中找到：

如果聽到你喜歡的音樂，把它加入你的音樂庫

將播放列表當作發現音樂的工具來處理是Apple Music像iTunes一樣過時的原因之一。但是，播放列表目前實施的方式令人感到僵硬。我發現用戶對添加整個播放列表到音樂庫的體驗很不好，尤其是播放列表在不斷更新的情況下。

如果想擴大普通聽眾的人群，就必須在現有的用戶基礎上實現擴張。這就意味著需要在「藝人」和「專輯」這兩個地方代替播放列表創建發現音樂。

私人定制

我在基于了解用戶前提下，發現即使用戶進入音樂庫也不愿意通過播放列表添加新音樂。個人認為，一個好的體驗是用戶能夠通過視頻或案例可以得到更多的信息，方便他們選擇是否加入音樂庫或每周的播放列表。

進入私人定制，在用戶面前呈現出一系列藝術家的頭像和其對應的歌曲。用戶可以提前聽到15秒的歌曲，并且可以通過向上滑動拒絕聽歌或向下滑動添加到個人的音樂庫。

我選擇用手勢交互，方便用戶在不看屏幕的情況下也能做選擇。一旦用戶結束了操作，他們選擇的內容會被新建一個音樂列表，方便他們聽音樂。

這種做法的背后動力來源于下面的采訪：

“蘋果低估了游戲化的力量”

— 我在洛杉磯采訪的一位交互設計師同時是蘋果音樂的使用者

我已經明白了，通過游戲化的體驗，用戶能夠很快的與發現音樂建立聯系。另外，私人定制可以為蘋果音樂提供關于聽眾喜好的信息，使APP和它的用戶一起成長和發展。

2. 品牌識別

我在Sony Music實習期間，我了解到，品牌視覺在流媒體服務中必須是可識別的。Spotify這點做的非常好，他們的播放列表專輯使用半色調封面就很有識別性。

相比之下，Apple Music 的視覺品牌現在是這樣的：

有很多不同的特征：3D效果，和黑白的照片。

另外，有關拼貼主題的封面并沒有真正給用戶傳達關于播放列表想表達的任何內容。

主要的問題似乎是蘋果音樂把所有的東西都貼出來當作封面，而不是真正設計一種統一的視覺語言，使蘋果音樂的封面在海量的專輯封面中脫穎而出。

我的解決方案遵循下面的原則：

專輯作品應該被視為UI的一部分，而不是獨立的可視化組件

歌手展示

這個啟發來自于蘋果音樂的歡迎頁，我選擇在圓形圖案中展示歌手的頭像。圓形的靈感來自于iPod的輪播圖 — 蘋果音樂的標志性部分。“頭像在圓形內”的特征在iOS其他的也有使用，尤其是通訊錄。

另外，我選擇將歌手展示和UI視覺更好的協調在一起。最后，我將顏色限制在藍色，紫色，紅色這三個色系中，來呈現蘋果音樂的圖標。

△ 歌手展示

重構播放列表

對于播放列表，我的想法是和歌手展示保持一致，通過使用顏色展示播放列表的氛圍。列表的背景則選擇將該頭像高斯模糊后作為背景（靈感來自iOS的背景模糊）。對于部分封面，我會稍微添加些漸變的紅色（蘋果音樂的品牌色）來增加維度感。

△ 重新設計的播放列表

主要的播放列表

最后，我更新了主要的幾個播放列表的視覺，使用的排版依舊和前面歌手展示保持一致。

△ 主要的播放列表

3. 視覺界面

總體的改善

蘋果音樂當前的頁面最大的問題是令人感到沒有激情，缺乏愉悅感。為了解決這個問題，我以細微的調整頁面寬度的方式優化了整個頁面，如下圖所示：

我不認為對“音樂庫”的改變是必要的。所以對留白處和字體做了調整。取消了“我的下載音樂”，因為我覺得app可以根據當前的網絡狀態自動判斷用戶可訪問的音樂。

下圖是為了增加互動添加了下拉交互動效（適用在不同的tab下）。

為你推薦

“為你推薦”是Apple Music的核心。Apple Music可以通過用戶根據喜好建立的播放列表和封面更深入地了解用戶。

我收集了關于“為你推薦”的反饋意見，因此對于重設計，我的主旨是減少用戶投放內容的同時增加其余內容的曝光度，就像Facebook和Instagram的“熱門文章”。

“為你推薦”中開始的內容展示“私人定制”，代替了“我最喜歡的”和“我新添加的音樂”。“最近播放”不做改動，因為對用戶來說它是很有用的。

向下滾動，會發現我根據位置，時間和最近的社交媒體活動對“周播放列表”進行了調整。

就像在Facebook上搜索café?搜立即展示結果一樣，Apple Music 根據用戶的播放列表選擇更新Mood，這不是很好嗎？

我們在社交媒體上分享我們的生活，同時也可以從中得到一些反饋，你覺得如何？

下圖是每日推薦，根據用戶的喜好推薦給他們相應的視頻。比如，我非常喜歡凱蒂·佩里，如果她的音樂發布，那就可以重點展示凱蒂的視頻。

向后滑動，你就會發現“藝術家聚集地”。我將新的品牌視覺效果與其他界面協調一致。

最后，如果用戶沒有在“為你推薦”中找到感興趣的內容，為了方便他們能夠快速訪問更多的音樂，可以讓他們預覽“最受喜愛”或“最多播放”的音樂。

Connect功能發生了什么改變？

這是好問題。事實上，我并沒能從我的研究中看到任何數據來證明現在App中Connect Feed功能的存在是正確的。用戶們有更多的興趣通過音樂與朋友和家人建立聯系，而不通過Twitter與藝人建立聯系。

我認為Apple公司應該注重整合現有的社交媒體與Apple Music的結合，而不是試圖向已經有很多選擇的用戶再推一個社交媒體應用。

瀏覽

我收到關于當前“瀏覽”最多的反饋是它令人感到太乏味。也有些用戶對“為你推薦”和“瀏覽”之間的區別感到困惑。

我的方案是根據蘋果網站的風格重新設計了幻燈片 — 寬度與屏幕寬度一致，底部的橫線標記著用戶當前所在的幻燈片位置。我相信這樣改變會更能突出精選內容。

同時將 “收音機”列表合并到了“瀏覽”。

觀看

今年，蘋果公司確認Apple Music公司將要擴展視頻流媒體內容，努力的將蘋果音樂變為流行文化的核心。我很好奇該要如何播放視頻，尤其是在手機App上，所以我創建了獨立的標簽頁專門用來瀏覽視頻內容。

添加獨立標簽頁的另一個好處是，“瀏覽”可以專門保留音頻內容

以后這個標簽下將會有豐富的內容，但現在我的設計是基于蘋果音樂已經爆料的信息和現有的視覺語言。

搜索

現在蘋果音樂搜索功能最主要的問題在于它的已有模式：必須分別在“蘋果音樂”和“音樂庫”下進行搜索。

使用這個app的兩年時間里，我發現自己依舊會在搜索功能下感到失望，尤其是音樂庫有不同的方式處理關鍵字：

這非常令人討厭，因為輸入錯誤的可能性會很大，尤其是他們在音樂庫中查找新發布的歌曲或藝人的時候。

我的解決方案是將兩個模塊合并在一起統稱為“搜索”，搜索結果優先展示用戶的音樂庫的內容，接著是蘋果音樂相關的內容。

可以很明顯的看出我是Lady Gaga的粉絲嗎？

音樂庫的內容也應該支持關鍵字的模糊搜索。如果將來能夠通過關鍵字實現有關的情緒或活動內容，那一定會很有趣。

播放頁面

我喜歡Apple現在的播放頁面，也覺得不需要太多的調整。所以決定保持現在的界面視覺效果。但是，我認為在現有的基礎上添加一些簡單的手勢交互會是一個很好的體驗方式。

對很多用戶來說，包括我自己，對通過“喜歡”和“不喜歡”評價歌曲的意義并不是很理解。并且目前這兩個操作是被隱藏起來的，當用戶表示“喜歡”一首歌曲的過程需要在手機上打開一個獨立的菜單，這個過程很繁瑣。

“如果隱藏的這么好是不是意味著這個功能不是特別需要？”

我的解決方案是通過大多數用戶已經很熟悉的手勢? ——? 雙擊來實現。我注意到，很多用戶試圖按動專題頁面...那為什么不在此基礎上給用戶一個反饋呢？

另外，用戶可以通過橫向滑動進行瀏覽。我相信這會給用戶更直觀的方式讓他們自行控制聽覺體驗。

接下來？

回顧我初次在頭腦風暴期間潦草的筆記，我為自己三個月內能取得的進步感到驚訝。

在這個項目開始之前，我對Principle完全沒有接觸，不會使用Sketch中混合編輯模式。現在...誠實的說，我仍然認為自己在app原型制作中是新手，但是，我會努力做到最好。

我并不認為Apple Music公司的優秀人士能夠從這個案例中用到任何東西，但是如果在AppleMusic工作的人看到這篇文章我會很驚喜，同時也希望這個項目能夠帶給你一些想法。

通過這個項目，我了解了我戲劇專業背景與UX設計的關系 —— 設計師的經驗和戲劇藝術家對人類的同理心的理解是相似的。

不久，我將開始我下一個重大的經歷：羅德島設計學院的BFA平面設計。雖然對要告別這個過程（和西北大學）感到很不舍，但我真誠地希望這僅僅是體驗設計生涯的開始……通過同理心改變世界。

歡迎關注譯者的微信公眾號：

「干貨超足的5個改版實戰經驗總結」

1. LOGO 改版：《揭秘LOGO設計流程！超詳細的騰訊云LOGO 改版記錄全過程》
2. 官網改版：《QQ官網全新蛻變！IM QQ 改版（第一期）設計總結》
3. Pinterest 改版：《改版實戰！聊聊PINTEREST官網再設計過程的經驗思考》
4. QQ 新版表情：《騰訊ISUX丨揭秘QQ 新版表情背后的設計故事》
5. 提升數據：《騰訊ISUX丨通過優化，我們將QQ會員付費用戶數提高了5倍！》

原文地址：medium

【優設網 原創文章 投稿郵箱：yuan@uisdc.com】

================明星欄目推薦================

優優教程網： UiiiUiii.com 是優設旗下優質中文教程網站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎設計愛好者也準備了貼心的知識樹專欄。開啟免費自學新篇章，按照我們的專欄一步步學習，一定可以迅速上手并制作出酷炫的視覺效果。

設計導航：國內人氣最高的設計網址導航，設計師必備：http://hao.uisdc.com