#設(shè)計(jì)案例研究#?“案例1：Firfox?Logo?重塑的秘密：”“簡(jiǎn)化有的時(shí)候不光是減法，如有必要，也需要加法。”不同于其他行業(yè)，設(shè)計(jì)界的團(tuán)體一直在致力于分享知識(shí)和經(jīng)驗(yàn)，很榮幸我們有這樣良好的學(xué)習(xí)環(huán)境，我們應(yīng)該保持這種狀態(tài)，信仰知識(shí)，渴望知識(shí)，樂于分享。?#SKYUI設(shè)計(jì)#

Firfox?Logo的簡(jiǎn)化改版

今天我們來談?wù)勱P(guān)于FireFox?的Logo改版，Firefox通過此次Logo的簡(jiǎn)化，營(yíng)造了一種適用性更好的瀏覽器形象。本文將簡(jiǎn)明的比較舊版和新版的不同。

何謂新，何謂舊？

2009-2013年Firefox的Logo可謂是了不起的藝術(shù)品。像是一種視覺上的進(jìn)化，更精確的圖形元素似乎像是一種宣言：我們要打造更有力、更新穎的瀏覽器——優(yōu)秀的產(chǎn)品理念打造優(yōu)秀的產(chǎn)品。那時(shí)候我每天都要用Firefox，感謝Mozilla的品牌理念，越來越多的用戶加入了Firefox的使用中。

Firefox能幫助我和客戶交互，通過視頻、文字、界面的形式，表達(dá)的效果清晰而又漂亮。Firefox使用可縮放矢量圖和顏色一致性的原則。文件傳遞、進(jìn)行反饋都非常迅速精確?，F(xiàn)在，Firefox通過重塑他們的Logo，來進(jìn)行新一輪的品牌進(jìn)化之路。

讓Logo更簡(jiǎn)單

風(fēng)格上的簡(jiǎn)化不意味著將圖形打回基礎(chǔ)的幾何形狀，然后使用純色。實(shí)際上，簡(jiǎn)化應(yīng)該是采用更協(xié)調(diào)的色調(diào)、更合適的比例、更完美的細(xì)節(jié)和形狀來一點(diǎn)一點(diǎn)修正圖像，去掉那些不必要的細(xì)節(jié)，強(qiáng)化核心上的細(xì)節(jié)。在此次簡(jiǎn)化中，確實(shí)是去掉了很多細(xì)節(jié)，但是也有增添，為了能夠兼容現(xiàn)今高分辨率的屏幕。我們將圖像制作成能夠兼容SVG（可縮放矢量圖）的形式，以便廣泛的應(yīng)用。

重塑Logo的第一步，就是去除細(xì)節(jié)，我們?nèi)サ袅藞D層混合模式中一些諸如正片疊底、濾色、重疊的細(xì)節(jié)，這能體現(xiàn)在圖中?1?尾巴處。

為了實(shí)現(xiàn)在可縮放矢量圖中效果完美無瑕的這一目標(biāo)，我們?cè)趦?nèi)部架構(gòu)上采用了SVG和CSS漸變。我們?cè)趫D中2狐貍的背部模糊了形狀，并且進(jìn)行更柔和的漸變。然后繼續(xù)剔除那些不必要的細(xì)節(jié)。為的是讓整個(gè)圖片更小，傳達(dá)的形象更清晰。

在我們?nèi)コ舸罅康募?xì)節(jié)之后，我們就開始考慮，哪些細(xì)節(jié)我們是需要強(qiáng)化的，尤其是在大尺寸的時(shí)候，如何將這些細(xì)節(jié)表現(xiàn)的更明顯？Stephen?Horlander重新刻畫了Logo里面3處的陸地輪廓。與此同時(shí)，我們?nèi)コ?/span>4處的高光，為的是將整個(gè)地球的色調(diào)變得更加柔和、更加深邃。加深地球的藍(lán)色的同時(shí)，點(diǎn)亮5出狐貍頭部的毛皮，這樣深刻的對(duì)比關(guān)系就出來了。即使尺寸不同，這種對(duì)比也很明顯清晰。

最后，你可能會(huì)發(fā)現(xiàn)新Logo中狐貍的整個(gè)肩部都伸出來了，而原來的只露出了手臂，首先，這傳遞了Firefox更加開放的姿態(tài)。其次，你仔細(xì)觀察，會(huì)覺得新版Logo中狐貍與地球的聯(lián)系更緊密，而舊版相較之下元素之間的聯(lián)系顯得生澀。

這就是Firefox?Logo重塑的秘密。記住，簡(jiǎn)化有的時(shí)候不光是減法，如有必要，也需要加法。