2012-4-24 藍(lán)藍(lán)設(shè)計(jì)的小編
轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)( tweetduck.com )是一家專注而深入的設(shè)計(jì)機(jī)構(gòu) ，為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
來源：騰訊CDC
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里
寫在前面
早在2011年7月，QQ音樂2011beta版的發(fā)布便確立了用品牌色–綠色，做為QQ音樂客戶端的默認(rèn)顏色，綠色代表和平、希望、生長和環(huán)保，對(duì)QQ音樂的品牌形象有積極的正面意義，此外，縱觀競(jìng)品，常見的客戶端配色多為黑和藍(lán)，用綠色也較利于提高產(chǎn)品的識(shí)別度。QQ音樂2012賀歲版的視覺，也是圍繞綠色和細(xì)節(jié)進(jìn)行全面的體驗(yàn)優(yōu)化。項(xiàng)目從去年12月31號(hào)開始，進(jìn)行了為期15天的設(shè)計(jì)和快速迭代。
改變工作流程
整個(gè)項(xiàng)目時(shí)間非常緊張，由產(chǎn)品發(fā)起需求–交互–視覺–開發(fā)的傳統(tǒng)流程無法適應(yīng)項(xiàng)目進(jìn)度，而由設(shè)計(jì)師發(fā)揮最大主觀能動(dòng)性，與產(chǎn)品、開發(fā)無縫對(duì)接，減少溝通成本，并驅(qū)動(dòng)實(shí)現(xiàn)更適合的體驗(yàn)。
設(shè)計(jì)理念
從對(duì)用戶聽歌時(shí)的心情和感覺的研究結(jié)果來看，發(fā)放的2000多份問卷中，有41.6%的用戶選擇“清新”，排第一位，其次是“陽光白云飛翔”和“憂傷”。因此，整體的視覺風(fēng)格的關(guān)鍵詞定義為：清新、精致、綠色，希望給用戶營造一種自然純粹、融入萬物的感官體驗(yàn)。
綠色的重新提煉
綠色是一種非常靈活的色彩，在色盤上偏向黃色部分的綠色感覺比較溫暖，而偏向藍(lán)色部分的綠則顯得比較冷。在項(xiàng)目初期，針對(duì)不同感覺的綠，做了幾稿視覺輸出嘗試，邀請(qǐng)了周圍的人來選擇，從中也有一些有趣的發(fā)現(xiàn)，比如男性比較喜歡明度低的深綠色，女性則偏愛明度高的嫩綠，另外，性格內(nèi)向的人喜歡飽和度偏低比較灰的綠，而性格外向的人則喜歡飽和度高更純正的綠色。
經(jīng)過反復(fù)比較，結(jié)合界面和圖標(biāo)的配色，以及希望傳達(dá)給用戶清新自然的感覺，最后選擇了用最接近春天，偏暖的綠色，做為客戶端的基準(zhǔn)色調(diào)。
圖標(biāo)的優(yōu)化
重新繪制的圖標(biāo)，更強(qiáng)調(diào)造型的飽滿和所有圖標(biāo)的均衡。在質(zhì)感上打造單色、輕薄、邊緣清晰而不銳利的視覺體驗(yàn)以適配換膚。光源統(tǒng)一為90度向下。
界面的優(yōu)化
1.質(zhì)感的打磨：調(diào)整質(zhì)感的輕重，對(duì)線條進(jìn)行弱化處理，讓面板的更加透氣和細(xì)膩。
2.頭部布局：優(yōu)化業(yè)務(wù)入口，對(duì)負(fù)載的功能做減法。
3.文字和圖標(biāo)的排版：尋找四個(gè)方向?qū)R點(diǎn)，使之平衡、整潔。
最終效果：
后記
距離發(fā)版已經(jīng)過去2個(gè)月了，從收到的反饋數(shù)據(jù)看來，效果還是比較理想的，日聽歌用戶數(shù)和安裝覆蓋率較之上個(gè)版本都有顯著增長。最后感謝開發(fā)同學(xué)在視覺還原上的耐心配合，感謝產(chǎn)品經(jīng)理的理解和支持。
自然賦予萬物聲響，音樂是人類獻(xiàn)給世間的第二自然，QQ音樂做為感情和思想的傳遞者，希望能將最完美的音樂體驗(yàn)帶給大家，這次改版，是一輪經(jīng)驗(yàn)和力量的蓄積，在用戶體驗(yàn)的道路上未來我們會(huì)做到更好。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://tweetduck.com