比起之前的圖標(biāo)，Yosemite的圖標(biāo)在屏幕看起來更有韻律。這組圖標(biāo)設(shè)計之前并未在網(wǎng)上發(fā)布過，為了達(dá)到外觀上的一致性，是肯定有一套柵格系統(tǒng)來確保這一點的。我們先看看新版圖標(biāo)的形狀。 當(dāng)你目光從老版系統(tǒng)的Duck上掃過的時候，這些在不同時期加入OSX的圖標(biāo)，擁有著不同風(fēng)格，不同形狀和色彩，以及不同的尺寸，你的眼睛會捕捉到它們間的差異和不協(xié)調(diào)，所以老版的OSX系統(tǒng)還是非常兼容并蓄的。在新版的Yosemite中，圖標(biāo)的尺寸大小更加協(xié)調(diào)，色調(diào)更一致，風(fēng)格也更加統(tǒng)一了。 圖標(biāo)造型與柵格 iOS7圖標(biāo)設(shè)計的柵格系統(tǒng)已經(jīng)在icon設(shè)計圈中廣泛流傳了，但是很少有人會注意到它和Yosemite的圖標(biāo)之間的關(guān)系。Andreas Wendker也僅僅只是在闡述圖標(biāo)設(shè)計統(tǒng)一性的時候輕輕帶過。 實際上，蘋果的設(shè)計師已經(jīng)在為Yosemite重新設(shè)計圖標(biāo)的時候用上了這套柵格系統(tǒng)。更準(zhǔn)確的描述是：他們開創(chuàng)了一套新的圖標(biāo)設(shè)計體系。（注：這些都基于Beta版的系統(tǒng)和剛剛發(fā)布的圖標(biāo)設(shè)計，對于剛剛接觸Yosemite設(shè)計者而言，這套柵格是非常有助于理解它的設(shè)計思路的。） Yosemite的圖標(biāo)系統(tǒng)可以分成3種基本的形狀，圓形，方形，和傾斜矩形。不同于移動端的iOS，Apple在MacOSX中，還是非常講究保持圖標(biāo)的個性，只有極少數(shù)圖標(biāo)的設(shè)計是出離于這套規(guī)律的。 為了讓你更清晰地看出這套圖標(biāo)的規(guī)律，我將iOS7的柵格系統(tǒng)覆蓋在Yosemite的圖標(biāo)之上，柵格尺寸是1024×1024。很明顯可以看出，圖標(biāo)們是非常規(guī)則的。
毫無疑問，這些基本形狀和柵格系統(tǒng)對應(yīng)起來非常不錯。接下來我們試試真實的圖標(biāo)。
iBooks的圓形圖標(biāo)和柵格系統(tǒng)完全對應(yīng)了，接近方形的系統(tǒng)設(shè)置圖標(biāo)和柵格系統(tǒng)雖未完全貼合，但是非常接近了。文本編輯器由于是傾斜的，圖標(biāo)中的草稿本的中心與柵格的中心點重合，傾斜的自動鉛筆則幾乎貼著內(nèi)測兩個圓之間的間隙插了進去。如果你仔細(xì)觀察系統(tǒng)設(shè)置的圖標(biāo)，你會發(fā)現(xiàn)它并非正方形，而是一個寬度比高度略大一點的長方形。Yosemite中的“方形”實際上分兩種，一種像系統(tǒng)設(shè)置圖標(biāo)一樣，寬度僅僅只是略大于高度，F(xiàn)inder與系統(tǒng)設(shè)置的圖標(biāo)均是如此。而另外一種則是終端和活動監(jiān)視器這樣的圖標(biāo)，它們的寬度會明顯大于高度。 在看看App Store的圖標(biāo)，內(nèi)側(cè)是筆和尺子組成的A，稍稍超出了圓形柵格的邊緣，這一點和嚴(yán)格遵循柵格的iBooks圖標(biāo)不太一樣，這主要是因為這個A的的視覺元素并不如iBooks圖標(biāo)里的圖書來的飽滿，所以這樣的調(diào)整會讓它們看起來更一致。Finder的圖標(biāo)尺寸很規(guī)范，和之前的Finder圖標(biāo)相比，Yosemite中Finder的笑臉看起來更快樂，更自然。 傾斜矩形的圖標(biāo)值得特別關(guān)注，因為它是第三方圖標(biāo)中最常見的類型。 以聯(lián)系人圖標(biāo)為例，左側(cè)為老版的傾斜矩形圖標(biāo)，它更像是處在一個三維空間中，符合透視規(guī)律，有消失點，整體看起來像是自然傾斜著。換句話說，你在制作這樣的圖標(biāo)的時候，將一個矩形逆時針選擇11度之后，還需要根據(jù)透視規(guī)律調(diào)整邊緣角度。 Yosemite的圖標(biāo)雖然保留了老版相似的正投影，但是并沒有透視，也沒有深度。所以，在制作Yosemite的圖標(biāo)之時，新建一個矩形輪廓，逆時針旋轉(zhuǎn)11度之后，你就可以開始制作細(xì)節(jié)了。比起之前，你也無需繪制極為逼真的紋理，這種差異你在上圖中非常容易體會到。 很明顯，Yosemite中的圖標(biāo)設(shè)計是有一套視覺規(guī)范的，尤其是圓形和方形的圖標(biāo)。這套圖標(biāo)均勻而規(guī)則地分布在二維平面上，如此一來Dock也無需制作成3D的樣子了。 所以，這套柵格就是準(zhǔn)則，而你的雙眼可以清晰地判斷出來。 曾經(jīng)有很多人猜測Yosemite的圖標(biāo)全會變成規(guī)則的圓形，值得慶幸的是，蘋果并沒有這么做（似乎很多奇葩的分析師喜歡會針對蘋果作出各種極端推測）。我認(rèn)為蘋果的設(shè)計師們作出了一套靈活的系統(tǒng)，保留了干凈清爽額外觀，又賦予第三方的設(shè)計師們足夠的靈活性和自由度。 參考了Yosemite的圖標(biāo)設(shè)計，我在iOS7的圖標(biāo)柵格系統(tǒng)的基礎(chǔ)上，制作出一套符合Yosemite的圖標(biāo)設(shè)計規(guī)范的新的柵格系統(tǒng)： 甭管你最后用不用它，你得知道它的存在。 層次 當(dāng)一套新的視覺規(guī)范被創(chuàng)造出來的時候，大家通常會來嘗鮮，而規(guī)范也常常被曲解。因此，動手前先稍等一下，想想你的APP是拿來干什么的，用哪種圖標(biāo)造型更能表情達(dá)意。 我并不認(rèn)為形狀的選擇是死板的規(guī)則，即便是蘋果本身也常常借助現(xiàn)實生活中的事物的實際形體來設(shè)計圖標(biāo)。我更傾向于深入理解這些基本圖形的功用，而不是生搬硬套。 圓形 圓形的圖標(biāo)多用于偏娛樂、用戶常用且輕量級的程序。它們看起來非常漂亮，但是那些專業(yè)的應(yīng)用大多不會使用這種造型的圖標(biāo)。那么像游戲中心和聯(lián)系人這樣的程序是不是也需要設(shè)計成圓形的呢？也不是不可能，關(guān)鍵還是要看看Yosemite正式版的圖標(biāo)設(shè)計。 方形 正方形的圖標(biāo)多是與系統(tǒng)相關(guān)的應(yīng)用程序。Finder，終端，系統(tǒng)設(shè)置，活動監(jiān)視器，Mission Control都在此之列。 傾斜矩形 自打MacOSX問世開始，這種傾斜矩形的圖標(biāo)設(shè)計就是它的設(shè)計語言中的重要組成部分，很多工具類的應(yīng)用都喜歡選用這種設(shè)計?，F(xiàn)如今系統(tǒng)版本都更新到10.10了，它依然存在，只不過簡化成2D平面的。 目前，傾斜矩形造型的圖標(biāo)是三種型態(tài)中應(yīng)用最廣泛的一種，那些帶有明顯工具屬性的應(yīng)用尤其喜歡將圖標(biāo)設(shè)計成這種造型。可能是因為傾斜矩形的圖標(biāo)設(shè)計擁有更大的靈活性，經(jīng)常可以將一些擬物的實體元素加入到圖標(biāo)中，讓它的外觀更有個性。 材質(zhì)與高光 現(xiàn)如今，低飽和度的色彩已經(jīng)被溫暖明亮的色調(diào)所取代。在Yosemite中，設(shè)計師為帶有金屬材質(zhì)的圖標(biāo)，加上了橘黃色的柔光，在背景增添了偏藍(lán)綠色的陰影，讓它們看起來更有質(zhì)感。它們并不是單純的色彩特效，這種色彩更接近于環(huán)境反光。 發(fā)布會上，Craig Federighi將Yosemite的Dock中的這種色彩稱為“半透明材質(zhì)”。我剛剛看到他的Keynote的時候就笑了：“這不就是一個帶模糊濾鏡的白色半透明圖層疊加上去么？”當(dāng)然，你可以將Craig的說法視作是為了方便營銷而創(chuàng)造出來的說法，但是Yosemite的圖標(biāo)的確不是單純扁平化，也不是單純只是設(shè)計一套操作系統(tǒng)圖標(biāo)而已，它們依然保留了材質(zhì)和環(huán)境光——它們與系統(tǒng)有“互動”。 這種環(huán)境光的濾鏡并沒有打在每一個圖標(biāo)之上，而是那些有著灰色金屬材質(zhì)（全部或者部分）的圖標(biāo)會呈現(xiàn)出這種環(huán)境光。 實際上你不用借助3D建模程序來創(chuàng)造環(huán)境光，PS也能做的出來，當(dāng)然你非要用3D軟件來渲染環(huán)境光自然更好。在這個案例中，球體被放置在橙色的底板上，而底板和球都都置于樹下，渲染出來的環(huán)境光就和Yosemite的圖標(biāo)的金屬部分的效果非常接近。 左側(cè)的球體是白色非拋光材質(zhì)的，你可以在它的表面看到綠色、黃色和棕色的環(huán)境反射光。在球體的底部，可以看到橙色底板反射出來的橙色陰影。這種源自現(xiàn)實生活的色彩就是這樣和Yosemite中的扁平化的元素?zé)o縫地結(jié)合在一起。（扁平和擬物并非處處對立?。?右側(cè)的球體是鍍鉻的，它像鏡子一樣反映出周圍的環(huán)境。在Yosemite中，大塊的金屬都是在模擬金屬鋁的材質(zhì)，而非鉻，所以它們的反光效果看起來更加虛幻和微妙。如果你將Yosemite的桌面背景更換一下的話，你會發(fā)現(xiàn)圖標(biāo)的金屬部分環(huán)境光會隨著“環(huán)境”的改變而有著微妙的變化。所以，如果你愿意仔細(xì)去鉆研蘋果的圖標(biāo)設(shè)計，你會發(fā)現(xiàn)很多令你驚訝的細(xì)節(jié)，開拓你的視界。 結(jié)語 圖標(biāo)的形狀、柵格、光源、細(xì)節(jié)都很重要，但是請千萬記住它們都只是基本的準(zhǔn)則而已，一個好的設(shè)計師應(yīng)該明白什么時候遵守準(zhǔn)則，什么時候打破常規(guī)。 請一定要注意圖標(biāo)的整體造型、色調(diào)和材質(zhì)，將它當(dāng)作一個客觀實體來對待，合理地簡化，多參考其他的圖標(biāo)的設(shè)計。坦率地講，圖標(biāo)設(shè)計上并沒有發(fā)生翻天覆地的改變，比起之前，它們只是更加一致和協(xié)調(diào)了。依據(jù)這套設(shè)計準(zhǔn)則來制作Mac應(yīng)用的圖標(biāo)是合乎情理的，如果你在這個前提下設(shè)計出更加清新脫俗的圖標(biāo)的話，反而會從這套圖標(biāo)系統(tǒng)中脫穎而出（小心被處女座or強迫癥用戶干掉?。５遣徽撊绾?，都一定要仔細(xì)打磨細(xì)節(jié)、角度和環(huán)境光。 
