亚洲av无码成人专区片在线观看,亚洲av岛国动作片在线观看,少妇,喷水,亚洲av成人无遮挡网站在线观看,天堂网www资源在线

恭喜你成為UI中國推薦設(shè)計師 (詳情)
//百度統(tǒng)計 20220402 uicn

您的意見是我們 UI 中國進步的動力!
點擊立即反饋按鈕,發(fā)表您的意見!
立即反饋
QQ群反饋
您也可以加入UI中國官方反饋群進行反饋!
群號:302892100
備注:反饋問題后@管理員能讓我們及時了解您的意見

提交需求

賽事與廣告咨詢合作,請?zhí)顚懶枨蟊韱?,我們會在第一時間與您聯(lián)系!

0/20
0/200

設(shè)計大賽

  • 設(shè)計大賽
  • 發(fā)布廣告
  • 發(fā)布招聘
  • 其它需求

提交完成
感謝您對UI中國的支持和信賴!
小圖標大學問!我是如何設(shè)計著名音樂軟件Spotify里的圖標
0.0°

@陳子木 編者按:本文的作者是設(shè)計師Jon Hicks,是原文所在網(wǎng)站HicksDesign的創(chuàng)辦人和設(shè)計主導者,網(wǎng)站的The Hickensian欄目記錄了Jon的設(shè)計歷程和經(jīng)驗總結(jié),非常值得閱讀。本文就是Jon參與設(shè)計著名音樂軟件Spotify圖標集的過程,其中打磨圖標的思路,和細節(jié)處理的手法非常值得學習。閱讀愉快。

去年秋季,著名音樂軟件Spotify主管設(shè)計師聯(lián)絡(luò)的Andreas Holmstrom同我聯(lián)系上,問我是否有興趣參與他們的新版圖標集的設(shè)計,并與他們正在重新設(shè)計整個Spotify軟件的設(shè)計團隊協(xié)同合作。作為一個狂熱的樂迷,我其實是已經(jīng)用了6年Spotify的重度用戶了,我必須抓住這個機會!坦率的說,我通過Spotify發(fā)現(xiàn)的音樂遠遠多于我通過其他媒體挖掘到的。

關(guān)于圖標設(shè)計,下面的文章值得一讀:
《漲姿勢!這些LOGO背后的含義你未必知道》
《經(jīng)驗分享!IUNIOS1.0 ROM設(shè)計總結(jié)》
《再不知道字體圖標就落伍啦!字體圖標制作詳解》

一個月之前,整個重新設(shè)計項目基本完成,我終于有機會將這次難得的設(shè)計體驗寫下來,分享給大家。

發(fā)現(xiàn)階段(Dsicovery Phase)

通常,我喜歡將這種大型的圖標設(shè)計項目開始的階段稱之為“發(fā)現(xiàn)階段”,因為在這個環(huán)節(jié)我會找來許多不同的圖標進行觀察,發(fā)掘其中的設(shè)計方法,隱喻以及風格。同時,這些現(xiàn)成的案例也會確保我們設(shè)計圖標集的時候能保持正確的大小、格式以及命名方式。在設(shè)計過程中,我同來自Spotify設(shè)計團隊的Andreas、Stanley、Daniel 和 Sebastian一起合作,共同完成了新的圖標集。我們的職責是設(shè)計出一套簡約,圓潤,友好,直觀,又不顯得可愛幼稚的圖標。與此同時,這套圖標的設(shè)計風格還要兼顧到Spotify現(xiàn)有的品牌元素,圖標風格,以及Spotify重新設(shè)計所用的Proxima Nove字體。

動手設(shè)計的時候,我們是從專輯、藝術(shù)家、合集(用戶自己的音樂合集)、發(fā)現(xiàn)、播放列表、個人資料和音樂臺這些主要欄目的圖標設(shè)計開始的。

在設(shè)計過程中,一大挑戰(zhàn)就是要展現(xiàn)的很多現(xiàn)實中并不存在的元素。當然,諸如音樂播放控制這樣的操作是有現(xiàn)成的隱喻和通用的圖標樣式的,但是實際存在的音樂又該如何呈現(xiàn)呢?Spotify擁有巨大的音樂庫,但是并沒有一個足以代表它的圖標和外觀。

我們有個早期的想法是使用一個標志性的音樂專輯封面來當作音樂瀏覽的圖標——比如 平克?弗洛伊德 的專輯《Dark Side of the Moon》的封面。

不過我們未曾采納這種設(shè)計方案。在接下來的設(shè)計中,我們參考了黑膠和CD的外觀,它們相似的外觀可以抽象到圖標設(shè)計中來——都是一個方塊內(nèi)兩個圓。比起之前的設(shè)計,我們認為這樣的設(shè)計更簡約也更有用。尤其是瀏覽圖標(這個我最喜歡了)與這個圖標有著內(nèi)在的關(guān)聯(lián),令人想起唱片在唱機里悠悠旋轉(zhuǎn)的過去。懷舊?的確,好在用它做隱喻還沒有像代表Email的信封icon一樣廣泛普及。

我們還曾嘗試過其他的有關(guān)音樂的隱喻,比如用樂隊的歌單、卡帶式混音器來做播放列表的圖標,或者基于通行證的外觀來設(shè)計個人資料的圖標。雖然使用混音器來作為圖標是非常老派而獨特的設(shè)計,但是更加簡約通俗的音符的形象更接近大眾的認知和普遍認同的常識。

總的來說,考慮到所有因素,我們制定了一套設(shè)計余下圖標的設(shè)計規(guī)范。

  • 首先是尺寸的規(guī)范,每個圖標都會有16px、24px、32px和64px四種大小。而隨著尺寸大小的增長,圖標內(nèi)線條的粗細與整體的比例會變小,視覺上會更細,防止整個圖標看起來“矮胖”。比如當圖標大小是16px的時候,線條粗細是1px,可是當圖標增長到64px的時候,線條的粗細并不是等比的4px(右側(cè)),實際尺寸已經(jīng)接近2px了(左側(cè))。

  • 在選擇圖標型態(tài)的時候,會盡量選擇最簡單直觀的,這樣用戶就無需通過底部菜單的文字說明就能正確操作了。
  • 所有的邊角都會四舍五入,比如藝術(shù)家頭像這樣的圖標,多少都會有稍許細節(jié)超出邊界,這都可以根據(jù)實際情況進行小幅度調(diào)整。

類型圖標(Genre icons)

接下來就是要解決分類類型圖標了。不同于出現(xiàn)在主界面上的圖標,在“瀏覽”的界面內(nèi),這些分類圖標擁有更大的空間來展現(xiàn)更多的細節(jié)。

下面這些胸像icon都是剛開始做類型圖標時,做的一點有意思的探究。最終版里面,這些都已被駁回了。

從左到右分別是:Gene Simmons (KISS), Redfoo (LMFAO), Michael Jackson 以及“Workout lady“。

原本想把Redfoo的胸像圖標用來表示“Party”(搖滾聚會?)的,但是我們都認為這樣過于晦澀難懂。所以,想通過圖標來傳達意境這樣的東西的確是一件非常麻煩的事情。

后來,我們決定這樣來處理類型圖標:對于特定類型的音樂,我們會用這種音樂形式獨有的或者有代表性的樂器來表現(xiàn)它。特別是搖滾和搖滾的子類型,我們會用不同的吉他來表現(xiàn)它們。我們用Gibson Les Paul來代表經(jīng)典搖滾,用Flying V來代表硬搖滾,F(xiàn)ender Jaguar則代表著另類搖滾,等等。

我希望這些設(shè)計能夠足夠統(tǒng)一,具有整體性,但是結(jié)果并不一定能那么理想:

另外有一些用來表現(xiàn)意境和氛圍的圖標,并沒有使用與音樂相關(guān)的物體來表現(xiàn),比如下面的蛋型椅子,就是用來表現(xiàn)放松的意境。

目前,這個項目仍在逐漸完善中,不斷有新的圖標添加到這個合集中來。

更新:2014-07-23

收藏

39人已收藏

yaya0101

學習中 多指教

  • 36

    作品

  • 745

    粉絲

  • 5

    關(guān)注

  • UI中國志愿者招募
  • Apple Watch會給瑞士手表帶來麻煩嗎?
  • 折紙效果圖標制作教程
  • Dave Whyte的幾何動效變化
相關(guān)標簽
優(yōu)秀設(shè)計師icon

    猜你喜歡

      小圖標大學問!我是如何設(shè)計著名音樂軟件Spotify里的圖標

      0.0°

      你確定要舉報小圖標大學問!我是如何設(shè)計著名音樂軟件Spotify里的圖標?

      如果查出惡意舉報,十天內(nèi)禁止提交任何舉報申請。

      0/200

      上傳證據(jù): 超過10M的附件請使用網(wǎng)盤地址

      點擊上傳附件

      對誰可見:

      全部設(shè)計師
      • 全部設(shè)計師
      • 推薦設(shè)計師和認證設(shè)計師

      您確認要推薦?

      該作品發(fā)布時間:2014年07月23日

      評分

      完整度

      啟發(fā)性

      勤奮性

      排版布局

      推薦心得

      建議20-200字以內(nèi)

      0/200

      15
      39
      2

      賬號或密碼錯誤,請重新輸入

      賬號或密碼錯誤,請重新輸入

      登錄

      手機號

      發(fā)送驗證碼 120s 驗證碼錯誤

      登錄
      第三方賬號登錄