通過系統圖標風格發展淺談圖標設計的原則

摘要系統圖標的發展經歷了30年的歷史，這其中每一款系統圖標都各不相同，其風格也是花樣翻新。系統圖標的風格經歷了從單色到多色、從平面到立體、從單一風格到多樣化的發展進程。本文就通過系統圖標風格的發展與變化，來研究總結出圖標設計的經驗原則。

關鍵詞:系統圖標 創意設計 發展原則

中圖分類號:J50 文獻標識碼:A

引言

圖標(icon)，網絡語言是圖標、圖符的意思。現在的圖標，也可以泛指一些只有很小尺寸但很精美的藝術表現符號。在計算機科學中，圖標將應用程序、文件、目錄或特定計算機系統中的設備，用圖形化的方式表現出來，就形成了系統圖標。當系統安裝到計算機上，就會自動出現一些圖標，如我的電腦、我的文檔、IE瀏覽器、網上鄰居、回收站等系統圖標。系統圖標是操作系統中的一個重要概念，它表示操作系統的應用對象，通過圖標向操作系統傳達命令。

系統圖標發展到現在已有30年的歷史，從1981年Xerox Star系統開始，到21世紀出現的Windows XP系統、BeOS Zeta系統，系統圖標的風格經歷了花樣翻新的過程，越來越精美新穎，越來越富有創造力和想象力。下面就通過對系統圖標的發展風格的研究，談談圖標設計的原則。

一 系統圖標的發展進程

系統圖標在過去幾十年的發展過程中，大概有如下幾方面可以歸納:

1 從技術成熟的角度上講圖標發展所能表現出來的色彩、線條、層次等演變的特點

早期的圖標色彩，大多數只應用了黑和白這兩種顏色。從1981年的Xerox Star系統開始，到1985年的TOS系統，圖標大多數采用32象素×32象素的尺寸。

后來從1989年的NeXTSTEP/OPENSTEP系統的圖標開始，到2000年的Windows 2000系統圖標，這一時期由于圖標尺寸有所增加，色彩的不斷豐富促使圖標越來越精致、生動，這一階段系統圖標的尺寸基本都發展到了48象素×48象素。圖標色彩也從1990年的Windows 3.0圖標的問世，開始真正豐富起來了，這套圖標采用了16色。而在1997年發布的Mac OS 8.5中，我們看到了更精美的圖標，其顏色從256色擴展到數百萬色。

伴隨著尺寸、質量的不斷發展，顏色數量的不斷增加，圖標風格在原來抽象圖形化的基礎上，出現了一些具象形象，增加了一些視覺效果。如:1989年NeXTSTEP系統的圖標就打破了之前圖標簡單的輪廓外型，應用了陰影效果。這套圖標的創造性設計及勇于探索的精神，為系統圖標后來的豐富視覺效果及向寫實風格的發展開辟了道路。1992年的Windows 3.1系統圖標，除了出現了一些陰影效果，還出現了一些漸變效果。1993年的OS /2系統在第三個版本中采用了3D效果，在第四個版本中甚至采用了一些Copland風格。這些效果的出現，使圖標風格更加細膩，趨向于寫實。

從2001年Mac OS X系統的圖標問世開始，圖標的構成要素全部都發生了改變，完全采用了寫實手法，使圖標不再只是抽象的幾何化的象征符號。這里借用《Apple Human Interface Guidelines》里的話:“Mac OS X系統圖標有一種像照片一樣的全新風格。圖標應用了跟照片類似的寫實手法。圖標有128象素×128象素的足夠空間來展示細節。反鋸齒使表現曲面和曲線成為可能。透明和半透明的通道可以表現復雜的陰影效果。所有的這些特性使圖標像華麗的圖片成為可能。”圖標的內容比之前版本的圖標內容多了512倍。512倍足夠使圖標的寫實風格“完全得以實現”。

2 空間視覺的效果上圖標的多形式演化

早期的圖標是平面的線條、方形、矩形或圓形等，基本上是二維的。等經歷到1989年NeXTSTEP/OPENSTEP系統的圖標開始，到2000年的Windows 2000系統圖標，尤其是Mac OS的精美設計，圖標從平面的二維空間演變成立體的3D效果，大大增強了圖標的視覺識別感染力。現在更是新穎奇特，能從3D的立體形象演進到動感視效，以至于增加了觸摸功能。

3 風格表現手段上的多樣化

早期系統圖標的共同特點是:圖標十分抽象、簡潔，外形輪廓主要應用了矩形、帶倒角的矩形及圓形這樣幾何化的圖形。如1981年的Xerox Star系統圖標，它是這一時期簡約風格的代表。這套黑白圖標，雖然是最早出現的系統圖標，但是它的設計卻很經典。這套圖標每個都剛好是一平方英寸，外形輪廓方方正正，通過粗細變化的簡單線條組合出了能夠代表系統命令的圖標。當時設計的一些圖標現在仍然被使用。比如說，文檔用一張折了一個角的白紙代表，這一形象已經根深蒂固的扎入人們心里，折角成為了文檔的代號。

隨著電腦技術的日趨成熟完善，圖標在表現手段上也自由隨意起來，由單色到多色，由線條到體塊，由單純實用到美觀趣味和藝術風格化。表現內容也更加豐富，可以是單單的色彩表現，也可以把圖標賦予各種材質，例如把系統圖標賦予金屬材質，很有真實感，就像我們生活里用的物件一樣。還可以把它形象化，例如女孩子喜歡的洋娃娃等，讓人很愜意，很親昵。根據不同人的需要設計成風格多樣的系統圖標，增加了人性化的多選擇性。

二 圖標的設計原則

通過對系統圖標風格發展的研究，我們要思考一個問題，即評價系統圖標的好與壞的準則是什么呢?什么是它可遵循的規律性原則呢?這就是我們要討論的圖標設計原則問題。

1 系統圖標設計的實效功能性——共性識別

共性識別是圖標設計首當其沖的。在圖標設計的風格演變過程中，難免會削弱或達不到圖標的最基本共性識別，這反而起到了設計的負作用。

2 在共性基礎上的藝術創造性設計原則

(1)圖標設計的創新多樣性

“創意”，其意思是創造新意。這里指設計師經過精心思考和策劃，運用藝術手段，把自己新穎的、與眾不同的思想和觀點，用設計作品表現出來的過程。

設計是一種創造性的行為，創新意識至關重要，臨摹與復制的再現不是設計的精神。現在的圖標創作，早已不是循規蹈矩的年代了，我們在遵循一些設計規范的前提條件下，完全可以大膽地實現我們的創意，把我們的想法統統實現出來。

創意從哪兒來呢?從你的生活而來。只要你是個細心的人，你會發現生活中有太多值得我們探索、贊美的東西。各種動物、植物、吃的糕點……任何東西都可以成為你創作的對象。不要僅局限于那些已經設計出來的風格。

就“垃圾桶”這個圖標而言，它不一定就是一個垃圾桶。我們可以把它設計成一個碎紙機或箱子甚至是一個破舊的竹筐。你也可以用皮夾、面包片等代替“文件夾”，諸如此類的聯想，它們全來自于你的生活。各個藝術門類、各個設計領域的優秀設計作品，也都可以給我們靈感，可以從技法、創意等不同角度啟發我們的創造性思維。

模仿等于死亡，創新才能生存，這是設計的真理。我們回頭看看系統圖標的發展，1989年NeXTSTEP/OPENSTEP 圖標最先采用了彩色和陰影效果，盡管圖標的風格并不統一，但是它得到人們的認可，人們肯定它的創意性設計。1993年在IBM公司OS/2系統第三個版本采用的3D效果、Copland/Mac OS 8系統圖標的Copland風格、Amiga OS 3.5采用的顫動手法，這些都使我們大家耳目一新，因此也在眾多系統圖標中總是能夠對它們映像深刻。

(2)圖標設計的適度性

隨著硬件的發展，高質量的圖標成為設計的重要特性之一，恰到好處的圖標設計可以給我們增加更多的嘆服和震撼。如暗影、反射和發光、透視、傾斜這些小的細節，都可以幫助我們把圖標刻畫得更精致，更生動，更嘆為觀止。因此在設計中很多人更要力求精進完美。懂得適度的、恰到好處的去把握，是設計中的關鍵原則。我們還以Mac OS X的系統圖標為例，這套具有照片似寫實風格的圖標，尺寸大、色彩絢麗、非常象形，這樣的視覺效果把握很突出，設計尺度也拿捏得非常到位。

在看過2008年國際GUI大賽的一些作品后，在其中會發現很多設計作品嫻熟的軟件技法，令我們驚嘆，有的圖標如攝像機、電腦顯示器的照片擺在我們面前一樣真實。但在驚嘆其寫實技法的同時，我們會發現這些作品并不能給我們帶來對作品的思考，因為作品直白到不需要我們思考，只有華麗的外表。這樣缺少趣味性和藝術性的作品，在體現設計感上來說就是過度玄技。而獲得2008GUI最佳原創金獎的童真鳴作品，讓人耳目一新，躍然而出:純手工創作靈感來自于對質樸手工藝品的熱愛，兩套作品:一套粘土制作回歸最樸素的美，粘土手工捏造的小汽車，涂上很單純的兒童畫隨意色彩，車廂上歪歪扭扭的字體run，代表“運行”圖標，可愛的小鉛筆和一個小本本再現天真稚拙，感覺能拿起來，讓人愛不釋手，代表記事本圖標;另一套為木刻染色的手工作品名字叫“雕刻時光”，原始趣味和藝術性很強，作品增加了文化和時尚的感染力，在設計風格上很有突破。

3圖標風格的統一性

我們在繪制系統圖標時，必須使一套圖標的風格看起來是整體的，統一的。如圖標的大小、色彩、形狀、角度、效果都要保持一致，使它們表達的是同一思想，傳達的是同一含義，在整體視覺上達到完整統一。

(1)尺寸的一致性:一套圖標的尺寸設計不一致，圖標就不會有整體的感覺。如1985年的Amiga OS系統采用了一些很隨意的尺寸，不同的大小損害了這套圖標的整體效果，整套圖標看起來很混亂。因此在設計系統圖標時，盡量不要采用非正方形的尺寸。

(2)顏色的一致性:2001年的Mac OS X系統圖標采用了24位深度和8位的半透明遮照，并且應用了類似照片的寫實風格，但是圖標太過絢麗的色彩使整套圖標看起來很不協調，圖標里應用的明亮的藍色跟黃色對比強烈，缺乏統一感。

(3)形狀的一致性:這要提到最早的Xerox Star系統，它的所有圖標形狀都具有很好的一致性，圖標十分抽象，只用了圓形和矩形。整套圖標看起來簡潔、大方，設計感強，一些圖標到今天還在被使用。

(3)角度的一致性:我們能夠看到許多系統圖標都使用了不同的傾斜，像pland，Copland，BeOS，Windows XP，Mac OS X等等。這其中一些圖標的傾斜應用得很好，但是像我們比較熟悉的Windows XP系統圖標，在肯定它設計上的優點的同時，我們發現它也有不足，如Windows XP里采用了兩種傾斜，導致圖標形成了兩種不同的透視角度，而它們又沒有很好地融合在一起。因此，圖標的角度不同，通常也會導致圖標的不一致。

(4)效果的一致性:Windows系統在1985年發布的第一套圖標，是效果不統一的一個典范。隨便拿Windows1.0中的兩個圖標來比較，都會發現圖標之間的定位、風格，尤其是陰影效果很不一致，陰影有大有小，有的像時鐘，甚至沒有添加陰影，如此，只能使為數不多的圖標看上去卻不像是一套的。

通過以上例子的分析可以看出，缺乏統一性的系統圖標看起來會凌亂、不統一、沒有整體性，因此我們在設計圖標時保持風格的一致性是非常必要的。

最后我要說的是，任何理論都有它的相對性，無論是圖標設計風格的創新多樣性，還是尺度把握的適度性、圖標設計的統一性，都需要設計師去把握這個度，要在個性與共性、適度與過度、實用與審美之間去權衡。

參考文獻:

[1] On evolution of icons in graphical interfaces. http://www.guidebookgallery.org/articles/onethousandsquarepixelsofcanvas.

[2] “Windows XP Visual Guidelines，” http://www.microsoft.com/whdc/hwdev/windowsxp/downloads/default.mspx.

作者簡介:李凱，女，1978—，遼寧鐵嶺人，沈陽魯迅美術學院2009級在讀碩士研究生，講師，研究方向:多媒體設計，工作單位:沈陽師范大學職業技術學院。