淺談圖標(biāo)設(shè)計(jì)

許馨之

摘 要：當(dāng)計(jì)算機(jī)時(shí)代來臨，圖形界面得到越來越多的重視，圖標(biāo)設(shè)計(jì)作為界面設(shè)計(jì)的設(shè)計(jì)主體成為重中之重。它有著不可替代的重要性，并有其優(yōu)點(diǎn)和缺點(diǎn)。對(duì)于設(shè)計(jì)師來說，圖標(biāo)成為了設(shè)計(jì)中最主要的部分。于是，應(yīng)該怎樣做好圖標(biāo)設(shè)計(jì)，即滿足可識(shí)別性，又不失藝術(shù)性，是設(shè)計(jì)圖標(biāo)的過程中應(yīng)當(dāng)考慮的問題。

關(guān)鍵詞：圖標(biāo)設(shè)計(jì) 界面設(shè)計(jì)

一、圖標(biāo)的起源和發(fā)展

“icon”，原意為圖像，在字典里被定義為宗教圖騰。計(jì)算機(jī)時(shí)代來臨之際，尤其是在1973年施樂開發(fā)出GUI 接口與鼠標(biāo)之后，計(jì)算機(jī)圖形開始迅速發(fā)展。在半個(gè)世紀(jì)的發(fā)展中，蘋果公司和微軟公司呈現(xiàn)出不同的風(fēng)貌和樣式，同時(shí)界面的發(fā)展也是精彩紛呈。在這些豐富多彩的圖形界面中，圖標(biāo)起到不可忽視的作用。

和早期的計(jì)算機(jī)界面相比，圖形界面對(duì)于用戶來說來得更加簡單和直觀。硬件的發(fā)展帶來了圖形化界面的發(fā)展，所以從圖標(biāo)的發(fā)展歷史來看，則是一部計(jì)算機(jī)發(fā)展的歷史。如通過分析蘋果和微軟的操作系統(tǒng)的發(fā)展史，我們可以看出整個(gè)圖標(biāo)的發(fā)展以及圖標(biāo)本身涵義發(fā)生的變化。同時(shí)現(xiàn)代手機(jī)飛速發(fā)展，手機(jī)更加多樣化，這也體現(xiàn)了用戶個(gè)性的多樣化，并且界面對(duì)于用戶來說尤為重要，圖標(biāo)作為界面的主體則是重中之重。但這就使得圖標(biāo)的設(shè)計(jì)更趨于復(fù)雜和多樣。但是，圖標(biāo)的多樣化也帶來新的問題，用戶在眾多圖表中則感到眼花繚亂，圖標(biāo)的設(shè)計(jì)也開始變得參差不齊。這也使得我們?cè)O(shè)計(jì)師在面對(duì)圖標(biāo)的設(shè)計(jì)的時(shí)候似乎無處下手，但是，我們?nèi)匀豢梢酝ㄟ^分析已有的圖標(biāo)，總結(jié)出圖標(biāo)設(shè)計(jì)的原則。

二、圖標(biāo)的設(shè)計(jì)原則

（一）可識(shí)別性原則?？勺R(shí)別性原則，指的就是圖標(biāo)的設(shè)計(jì)應(yīng)當(dāng)能被用戶簡單的解讀和認(rèn)識(shí)，即當(dāng)用戶看到這個(gè)圖標(biāo)時(shí)，我能夠明白圖標(biāo)所代表的含義。例如，交通標(biāo)志的設(shè)計(jì)應(yīng)當(dāng)是當(dāng)之無愧的好的圖標(biāo)設(shè)計(jì)，因?yàn)閹缀鯖]有司機(jī)看到交通標(biāo)識(shí)而不知道其意義的，交通標(biāo)識(shí)的可識(shí)別性在這里得到了極大的發(fā)揮。

（二）差異性原則。差異性原則指的是圖標(biāo)之間應(yīng)該有區(qū)別和差異，這樣當(dāng)用戶看到圖標(biāo)能識(shí)別出它們彼此的不同，從而區(qū)分不同圖標(biāo)的功能性。如果不同功能的圖標(biāo)采用了易混淆的元素，這樣的軟件操作起來必然會(huì)使用戶陷入困境。

（三）合適的精細(xì)度。圖標(biāo)并非越精細(xì)越好，我們要明白，圖標(biāo)首先是拿來用的，即是識(shí)別性，第二才是美觀性。在圖標(biāo)的設(shè)計(jì)中，起初圖標(biāo)的識(shí)別性會(huì)隨著精度的上升而提升，但是，當(dāng)精度上升到一個(gè)點(diǎn)之后則會(huì)呈現(xiàn)下降趨勢(shì)，所以我們?cè)谠O(shè)計(jì)圖標(biāo)的時(shí)候，要注意把握好這個(gè)點(diǎn)，有時(shí)候過度追求精細(xì)和質(zhì)感對(duì)于圖標(biāo)的識(shí)別性并沒有更多的幫助。

（四）適量的元素選擇。在設(shè)計(jì)圖標(biāo)的時(shí)候，圖標(biāo)的元素并不是越多越好，而是適度就好。圖標(biāo)設(shè)計(jì)的原則可以說是“不要讓我思考”。例如vista圖標(biāo)的設(shè)計(jì)可謂是失敗的設(shè)計(jì)，雖然微軟在這套圖標(biāo)內(nèi)傾入了相當(dāng)?shù)男难?，但是因?yàn)檫x擇了過于多的元素，使得整體認(rèn)知產(chǎn)生了偏差。

（五）風(fēng)格統(tǒng)一原則。圖標(biāo)的設(shè)計(jì)往往是成套的，這就要求我們?cè)谠O(shè)計(jì)的時(shí)候統(tǒng)一它們的風(fēng)格。

（六）與整體環(huán)境的協(xié)調(diào)。圖標(biāo)并不是孤立存在的，他們應(yīng)當(dāng)彼此相關(guān)聯(lián)，如你想做一個(gè)80年代的復(fù)古設(shè)計(jì)，你的整體的色彩基調(diào)應(yīng)該在復(fù)古色的范圍之內(nèi)，且應(yīng)該和當(dāng)時(shí)的環(huán)境有一定的契合，元素可以選擇當(dāng)時(shí)的物件，畢竟當(dāng)時(shí)的產(chǎn)品和我們現(xiàn)代的物品有很大的差別。

（七）原創(chuàng)性。這一條對(duì)于圖標(biāo)設(shè)計(jì)提出了更高的要求，雖然原創(chuàng)性并非是圖標(biāo)必須的要求，而且在圖標(biāo)愈加豐富的今天，圖標(biāo)的風(fēng)格已經(jīng)千變?nèi)f化，過于追求圖標(biāo)的原創(chuàng)性可能會(huì)帶來識(shí)別性的降低，但是，有時(shí)候也可以根據(jù)產(chǎn)品本身的風(fēng)格加入更為藝術(shù)的效果，從而給圖標(biāo)設(shè)計(jì)帶來新鮮的血液。

三、圖標(biāo)的共時(shí)性和歷時(shí)性

可以說，圖標(biāo)的發(fā)展不是一成不變的，從圖標(biāo)的發(fā)展歷史我們可以發(fā)現(xiàn)，經(jīng)歷了像素圖標(biāo)和如今的超精細(xì)圖標(biāo)，改變的不僅僅是風(fēng)格，還有意義的變化。

adobe公司的圖標(biāo)隨著時(shí)代的發(fā)展也在變化。Adobe的軟件其實(shí)都很難根據(jù)功能提取出一個(gè)具體的形狀，于是早期的軟件都用羽毛、花朵、蝴蝶這些“精神層面”的物體來表達(dá)。但是，這很難在用戶和軟件之間建立起關(guān)聯(lián)。從CS3以后，adobe的套裝圖標(biāo)發(fā)生了很大的變化，雖然美觀程度不及以前，但這也讓用戶無需建立起對(duì)象和象征物之間的關(guān)聯(lián)，這不是表意而是直接告訴用戶“我是ps”。文字帶來最直接的響應(yīng)。

同時(shí)，由于蘋果手機(jī)的普及和影響，近些年來圖標(biāo)的設(shè)計(jì)更加統(tǒng)一，更趨于圓角方形化，但是圓角的圖標(biāo)過于流行和普及也帶來了一定的問題，這使得圖標(biāo)的設(shè)計(jì)過于單一，抹殺了圖標(biāo)的多樣性?？梢哉f，當(dāng)在各類圖標(biāo)設(shè)計(jì)網(wǎng)站看到很多圖標(biāo)都變成方形的時(shí)候，比如說所有的球類都變成了方形，所有可能的物品都被放入方形的框內(nèi)的時(shí)候，可以說，在圖標(biāo)設(shè)計(jì)方面，我們的方向出了問題。方形的圖標(biāo)設(shè)計(jì)實(shí)際上是蘋果公司在手機(jī)圖標(biāo)設(shè)計(jì)方面做出的妥協(xié)，因?yàn)樵谑謾C(jī)這個(gè)有限的屏幕之內(nèi)，自由形的排列會(huì)因?yàn)榭臻g問題顯得凌亂，于是就出現(xiàn)了方形圓角圖標(biāo)。并且因?yàn)閍pp store的開放性使得各個(gè)廠商可以自行決定自己的icon圖標(biāo)，即使是再不怎么好的圖標(biāo)設(shè)計(jì)，在整體圖標(biāo)效果上也會(huì)顯得整體和諧性，也就是統(tǒng)一性里面討論的問題。在圖標(biāo)外形方面，蘋果公司的這個(gè)規(guī)則只能說是一個(gè)方面，我們既不能完全按照這個(gè)方向走，也不能完全拋棄它，但是，當(dāng)我們?cè)O(shè)計(jì)的時(shí)候，我們應(yīng)該考慮新的解決方案來改進(jìn)圖標(biāo)設(shè)計(jì)，這也是我們?cè)O(shè)計(jì)師應(yīng)該去做的。

參考文獻(xiàn)：

[1] 朱銘，奚傳績.設(shè)計(jì)藝術(shù)教育大事典[M].濟(jì)南：山東教育出版社，2000

[2] 譚坤，王凱翔.軟件界面中的圖標(biāo)設(shè)計(jì)[J].飾，2007（04）

作者單位：南京藝術(shù)學(xué)院