為什么網(wǎng)易云音樂的banner總是那么吸引人？
首發(fā)：樂觀做設(shè)計
原標(biāo)題：《探索：來圍觀網(wǎng)易云音樂客戶端的banner設(shè)計》
本期將與大家探討網(wǎng)易云音樂的banner視覺設(shè)計，分析一下banner中存在的視覺合理性和美觀性。用過不少音樂軟件，它們的banner設(shè)計和網(wǎng)易大同小異，這也說明受眾和市場是接受的。個人相對來說還是比較喜歡網(wǎng)易云音樂，拋開神人輩出的評論區(qū)，作為設(shè)計師，對于網(wǎng)易云音樂的視覺設(shè)計還是很喜歡的，而banner作為主面板的視覺核心區(qū)，承載著整個面板的宣傳焦點，新歌首發(fā)、歌星訪談以及其他營銷信息都會在這里以輪播的形式不斷展示，所以設(shè)計重心自然而然就落在這一塊區(qū)域，縱觀以往的banner設(shè)計，至今網(wǎng)易云音樂都保持了較高的水準(zhǔn)，風(fēng)格搭配內(nèi)容，配色結(jié)合排版，總能吸引人的視線。
我的網(wǎng)易云音樂主面板
上面是我的網(wǎng)易云音樂面板，頂部個性推薦那一列就是主banner視覺區(qū)。我們先來看幾個設(shè)計案例，看看從中能現(xiàn)些什么設(shè)計手法。
不知道大家有沒有發(fā)現(xiàn)，上面所列舉的banner設(shè)計，代表了5種不同的排版組合，第一張和第二張是左文右圖和左圖右文的組合，第三張是形象居中，文案在兩側(cè)的組合，第四張是文案居中搭配背景，第五張是形象為前景，浮在文案之上的形式，第六張是以人物組的形式出現(xiàn)。接下來和大家探討一下這幾種組合形式。
一、左圖右文&左文右圖
這兩種其實可以歸為一類，主要特點是畫面左右分割明顯，文案作為一個整體，圖像作為另一整體。這也是基本的排版方式，這種方式能夠非常直觀有效的傳遞出畫面所要表達的信息。
如上面的案例，無論是何種風(fēng)格的封面圖，都運用了這一種排版組合方式，你能夠很清晰的看到banner中主題是什么，歌手是誰以及是何種風(fēng)格。我們知道排版四大原則是重復(fù)性、親密性、對比和對齊。
以上圖遠東韻律和張碧晨聯(lián)合的這張banner為例，左文右圖的形式清晰分割了畫面，左側(cè)最為粗大的MAPS強調(diào)了它就是文案的主體，而其他文案依次居中排列，文案部分很好的體現(xiàn)了對齊、對比和親密性的原則。在看右圖部分，同樣的圓角矩形將歌手放置其中，依次排列，美觀有序，這是重復(fù)性的表現(xiàn)。
而像解憂唱片行這一張為代表的單形象，則可以使用最基本的排版，只要保證人物主體和文案組的合理放置，遵循排班的基本原則，便可以組合成一個美觀的畫面。
二、形象居中，文案在側(cè)
這種方式可以將人物形象信息最大化的展示出來，人物占據(jù)視覺中心，成為畫面焦點，讓人的視線集中于此，從而增強歌手在觀眾心中的印象，然后將文案按照排版原則去放置，再加上烘托氛圍的背景元素，畫面即成。
焦邁奇這張banner是我個人非常喜歡的，整個畫面風(fēng)格迷幻，人物形象突出，配合編排有序的文案，讓整個banner相當(dāng)出彩。類似的畫面還有下面這些。
三、文案居中+抽象背景
抽象背景也可以是無人物形象的背景元素，這種方式適合表達一些特定的主題，像心情類、話題類、投票類、電臺宣傳以及一些產(chǎn)品營銷等等這樣的信息聚合類的banner設(shè)計。
四、人物為前景浮于文案之上
其實這類有兩種形式，一種就是人物浮于文案之上，另一種是文案疊在人物之上。這一種和人物居中的形式有類似之處，也有細(xì)節(jié)的區(qū)別。這種形式文字和圖像并非完全分隔，而是相互之間有所遮擋或相互穿插，讓畫面更具特點。
五、以人物組形象出現(xiàn)
以人物組出現(xiàn)的方式大多用于樂隊組合或者幾位與主題相關(guān)的人物。這類風(fēng)格的banner往往是要表現(xiàn)一個群體主題，像熱評、頒獎、歌單推薦等等，用人物組合的方式向受眾傳遞畫面信息。
以上是我總結(jié)的網(wǎng)易云音樂主流的幾大畫面組合形式，我每天都會關(guān)注云音樂客戶端主banner的更新，也一直在觀察它的風(fēng)格變化，總的來說大方向就是這些，其實不光是云音樂的banner設(shè)計，任何媒介的焦點圖大都離不開這些形式，大框架之下就看設(shè)計師們?nèi)绾伟l(fā)揮自己的小創(chuàng)意，讓視覺更出彩更吸睛，從而產(chǎn)生高點擊，達到宣傳目的。
接下來再來欣賞一些比較不一樣的版式形式，也是出自網(wǎng)易云音樂。
視覺傳達是本著利益受眾的理念去組合畫面，而最終既能讓受眾喜歡又能達到傳達目的，這就是一個成功的設(shè)計。通過以上對網(wǎng)易云音樂banner的設(shè)計發(fā)現(xiàn)，我們在以后的設(shè)計工作中就能更加清晰的理順設(shè)計思路，設(shè)計出讓各方都滿意的作品，這也是一個設(shè)計師的價值所在。
今天的分享就到這里，感謝每一位堅持讀到最后的朋友，閱讀和設(shè)計一樣，是一個不斷往返的過程，保持樂觀，堅定信念，期待你的進步！
數(shù)英用戶原創(chuàng)，轉(zhuǎn)載請遵守規(guī)范
轉(zhuǎn)載請在文章開頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權(quán)，侵權(quán)必究。
評論
評論
推薦評論
全部評論（12條）