項目背景

但若不考慮云音樂自身內(nèi)容的復(fù)雜性與可擴(kuò)展性，為了扁平而扁平，將所有內(nèi)容平鋪，表面上信息是外顯了，實際上獲取信息的效率反而降低：過多的橫滑選項讓人迷失，越靠后的內(nèi)容越難以到達(dá)。

因此內(nèi)容顯示的優(yōu)先級還是要有所取舍。扁平化的最終目的是讓用戶更快到達(dá)所需，任何風(fēng)格規(guī)范只是輔助達(dá)到目的的方法。為此，我們打破現(xiàn)有結(jié)構(gòu)，重新梳理了不同用戶類型及其使用情境，最終將一級導(dǎo)航精減到4個：

1. 將原先“發(fā)現(xiàn)”里和推薦相關(guān)的內(nèi)容單獨(dú)提取出來作為一分支。這部分內(nèi)容在表現(xiàn)形式上講求直接呈現(xiàn)具體信息，方便“無目標(biāo)”型用戶快速發(fā)現(xiàn)云音樂的優(yōu)質(zhì)內(nèi)容。
2. 余下“發(fā)現(xiàn)”里的內(nèi)容則更針對“有目標(biāo)”型用戶，對于這類用戶來說，入口設(shè)計方便他們縱覽所有內(nèi)容模塊，從而快速定位自己所需。

這樣，不同用戶都可以快速切入主題，運(yùn)營內(nèi)容和社交元素都得到了恰當(dāng)?shù)恼宫F(xiàn)，入口設(shè)計減少加載，保證首頁全景圖橫向瀏覽過程中的流暢體驗。

二．減少迷失感

全景圖式導(dǎo)航（Panorama）在體驗上最大的一個弊端是，你無法在當(dāng)前屏看到全部導(dǎo)航，無法快速切換導(dǎo)航，只能通過依次橫滑去到達(dá)。如何減少這種周而復(fù)始地橫向瀏覽所帶來的迷失感，讓用戶更快找到自己需要的東西？

除了精減導(dǎo)航個數(shù)之外，我們也重新規(guī)劃了導(dǎo)航優(yōu)先級，以便更重要的內(nèi)容更容易在第一時間被發(fā)現(xiàn)：將“我的音樂”作為默認(rèn)進(jìn)入頁，因為這是每個用戶的 “家”。然后從“家”出發(fā)去探索，根據(jù)內(nèi)容優(yōu)先級，依次經(jīng)過推薦、發(fā)現(xiàn)和朋友動態(tài)。在設(shè)計上講究橫向瀏覽過程中頁面布局的變化，用戶可通過視覺輔助確認(rèn)自 己當(dāng)前所在模塊。

另外，旋律識別、搜索、設(shè)置等功能則被定義為“常用工具”，常駐在底部應(yīng)用欄（App Bar)。這樣，用戶處在首頁任何地方都能一鍵調(diào)用，無需記憶和尋找。

三.利用平臺特性，讓信息更扁平

歌單是云音樂的內(nèi)容核心。產(chǎn)品功能迭代至今，歌單界面已經(jīng)變得臃腫不堪，但仍就有很多信息難以被發(fā)現(xiàn)。巴掌大的手機(jī)界面，如何盡可能讓信息外顯，同時界面又不失優(yōu)雅？WP平臺的一些全新特性讓我們看到了機(jī)會。

UI扁平化后，可點擊區(qū)域變得不可預(yù)期。在WP歌單頁，我們將信息與操作分離得更徹底，除了與歌曲列表關(guān)系緊密的播放、下載，其它所有針對歌單的操 作都放置在應(yīng)用欄（App Bar)，不再讓用戶滿屏地探索，使交互更加可預(yù)期。同時，利用WP軸心圖（Pivot），將歌單的列表、介紹和評論并列呈現(xiàn)，無需跳轉(zhuǎn)，橫滑即可到達(dá)， 使信息更外顯。這樣，歌單層次變得清晰，所有信息一目了然，所有功能一觸即達(dá)。

四:扁平≠平庸

UI扁平化削弱了不同應(yīng)用之間的辨識度，在WP上似乎所有應(yīng)用都長得差不多。我們一直堅信與眾不同的視覺能賦予產(chǎn)品強(qiáng)烈的個性，觸動人心。

播放頁是整個軟件的視覺中心也是情感中心。在視覺設(shè)計過程中，我們也嘗試了許多更為扁平化的方案以適應(yīng)WP風(fēng)格，但始終覺得缺乏自己的特色。最終在扁平化和差異化的抉擇中，我們選擇保留標(biāo)志性的黑膠唱盤和血槽進(jìn)度條，同時在其它細(xì)節(jié)上處理得更輕盈，營造一種沉浸式體驗。

信息回歸本質(zhì)后，視覺亦然。視覺首先要符合其所處的環(huán)境，其次才是自己的性格。鮮艷的大色塊只適合首頁，內(nèi)容頁則以黑白灰為主色調(diào)以突顯信息本身，但是完全素色的界面又顯得死氣沉沉。通過反復(fù)嘗試紅色運(yùn)用在不同細(xì)節(jié)上的效果，最終達(dá)到紅色使界面更有個性的同時不搶內(nèi)容。

設(shè)計過程中對色彩、間距、字號的精益求精，開發(fā)過程中的百余次微調(diào)，對設(shè)計師和開發(fā)都是極大的考驗。

總結(jié)：

“真正的簡潔不是刪繁就簡，而是在紛繁中建立秩序”。打造全功能版的網(wǎng)易云音樂WP端，無論是設(shè)計還是開發(fā)都經(jīng)歷了從混亂到有序的過程。

作為云音樂大家族最晚起步的平臺，Windows Phone平臺小眾，項目資源少，平臺限制多……盡管過程中遇到很多阻礙，我們?nèi)匀涣η笤谶@個用戶數(shù)不多的平臺上打造最好的體驗,并為之日夜奮戰(zhàn)。

改變意味著風(fēng)險，我們在WP1.0做了很多不一樣的嘗試，同時也意識到這個版本還有很多事來不及做。WPer，讓你們久等了，你們的支持與理解是我們不斷前進(jìn)的動力！

——寫在WP1.0上線之際

原文來自：網(wǎng)易UED