項目背景

Windows Phone一直是各家公司缺少投入的平臺，WP用戶不得不經(jīng)常面對一個成熟的APP到了WP上就變得各種功能缺失、體驗支離破碎，他們渴望應用軟件在體驗上能和其它平臺一樣受到同等重視，音樂APP也不例外。作為一款有誠意的音樂產(chǎn)品，打造名副其實“云”的概念，網(wǎng)易云音樂當然不會忽視WP用戶的呼聲，歷經(jīng)重重困難于近期重磅推出“功能無閹割”的WP客戶端，還WP用戶一個完整的音樂體驗。

嶄新的平臺，改變的契機

與眾不同的WP風格設計，決定了云音樂WP版在現(xiàn)有平臺上找不到任何可以直接移植的設計。不過，也正因為從零開始，設計師得以放下“破壞用戶已有習慣”的思想包袱，重新審視這些年產(chǎn)品的痛，在WP上做一次大膽的改變。

化繁為簡,從不是件簡單事。如何既保證功能體驗完整，又體現(xiàn)WP平臺自身極簡、輕量的特點，成了貫穿我們設計始終的思考。

一．更加簡潔、高效的導航

為支撐起云音樂豐富的內容，現(xiàn)有手機端均出現(xiàn)了原本PC/Web上才會出現(xiàn)的雙層甚至多層嵌套的導航結構，以使信息更外顯。而WP極度扁平的導航結構顯然無法消化云音樂日益擴充的內容。如果將目前層級結構直接移植到WP，則“發(fā)現(xiàn)音樂”下的4個二級導航要變?yōu)槿肟凇＿@種設計用戶第一眼看不到任何有效信息，推薦等核心內容的層級變深了，也不利于產(chǎn)品運營。

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

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

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

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

二．減少迷失感

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

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

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

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

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

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

四:扁平≠平庸

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

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

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

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

總結：

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

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

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

——寫在WP1.0上線之際