圖形用戶界面中圖標的視覺形式美探析

自從上個世紀圖形用戶界面的普及為人機交互行為和用戶體驗帶來了全新變革，無論是4K電視還是視網膜屏幕，分辨率的提高對圖形用戶界面，特別是圖標的視覺表現和形式美提出了更高的要求，用戶已經不滿足于視覺感官設計，他們需要在高分辨率下享受美麗且有細節的圖標乃至圖形用戶界面。文章以形式定義作為支撐，詳細闡述了圖標設計中的形式要素、形式美的特征以及形式美的原則等三個方面，最后根據前期的設計與研究經驗提出圖標設計形式美的兩個遞進式訓練方法的建議，希望能夠淺析圖標的形式美以及提供設計解決方案。

圖形用戶界面的發展與圖標（ICON）

“圖形用戶界面（Graphic User Interface）是二十世紀最重要的創造發明之一，它為數字化普及革命所帶來的巨大貢獻是軟件領域中其它任何發明所不能比擬的。”圖形用戶界面的起源于上個世紀60年代計算機操作技術革新，在這次變革中，圖形用戶界面替換了大量的字符命令，解脫了對命令的大量記憶負擔，同時由于采用圖形方式與計算機操作環境對接，對于用戶來說更為簡便易用，方便了非專業用戶的使用，人們可以通過窗口、菜單、按鍵等方式來方便地進行操作，其中尤為重要的就是圖標。

圖標也有廣義和狹義之分，廣義上是指所有的圖形標識，而這里討論的主要是狹義的圖形用戶界面圖標，是ICON意譯。由于圖形用戶界面（GUI）是一個舶來品，所以其中的“圖標”，也只能用西方語系中ICON來解釋。由于計算機技術和圖形用戶界面的發展，越來越多的圖形通過擬物化的設計方式參與替代計算機命令和信息，ICON逐漸成為圖形用戶界面的命令接口之一。當然，研究圖形用戶界面或者是其中的圖標（ICON），可以有多種角度，從認知心理學、人機工程學、行為學、符號學、社會學等眾多領域都可以切入，但無論目的如何，都無法回避圖形符號的視覺表現這一問題。今天的社會早已進入了一個高度發達的“讀圖時代”，特別是物聯網以及移動互聯的飛速發展，指代計算機命令的圖像信息更是撲面而來，蘋果、微軟、谷歌乃至國內的小米、長虹等眾多企業不惜余力的發展圖形用戶界面，更加重視圖標在界面中的作用和美的體驗。小米以極客引領粉絲的方式推出自定義用戶界面，甚至把圖標作為藝術品來推廣，用戶可以根據自己喜好下載更符合自己審美需求和習慣的圖標安裝，打造唯美的藝術界面。

圖標的形式和形式美淺析

假設圖標可以作為藝術作品成立，那么任何藝術作品都必須通過一定的組織結構和表現手段體現出來，因此用來表現作品內容的組織結構以及表現手段，就是作品的形式，圖標也不例外。在藝術領域中，形式一般為表現內容而產生。圖標的內容主要是提供計算機指令信息，當前絕大多數圖標的組織結構和表現手段為擬物化的設計，讓我們來看一個大家熟悉的例子，“搜索”圖標。搜索，其實是一個動詞，但是為什么要用擬物化的名詞“放大鏡”來表現哪？“我們大腦中充滿了鏡像神經元，它們使我們能夠快速的憑直覺了解他人的意圖，甚至感同身受”。設計師呈現擬物化的放大鏡作為圖標形式的時候，其實希望用戶聯想到別人或自己曾經的搜索、尋找的行為，以模仿行為的隱語方式告知用戶這就是搜索命令的內容。

那么，形式的要素有哪些？什么樣的形式才美？ “形式美是指自然、生活、藝術中各種形式要素（色彩、線條、形體、聲音），及其規律的組合所具有的美。”在圖標設計中，形式美是指形狀、空間、質感、影調、色彩等形式要素的組合所具有的美。

1.圖標中形式的本質要素（形狀、體積、空間）和表現要素（影調、質感、色彩）的視覺表現

形狀、體積、空間是形式的本質要素，質感、影調、色彩是形式的表象要素。在圖標設計中，形式的要素都離不開在屏幕上的視覺表現。因此，我們更加強調以體積感和質感以及色彩構成形式美的視覺表現。

圖標視覺表現的立體感，即體積感，使擬物化的圖標更加生動自然、真實可信的重要因素。在屏幕上設計圖形與空間上的藝術方式（例如雕塑）不同，主要還是通過二維空間塑造形象。通常情況下塑造栩栩如生、富有表現力的圖標視覺表現，主要運用其自身所固有造型語言在二維空間上模擬對象的三維空間，即表現出擬物化對象的形狀、體積和所占空間大小。

圖標所比擬的物體的表面結構，稱為質感。并非所有物體的質感都值得表現，但卻是所有物體都必不可少的重要形式部分，因此圖標設計中對它的視覺呈現一定程度上會使圖形出彩，增強藝術感染力。例如蘋果公司打造的水晶系列按鈕和圖標就為Macintosh系統迎來視覺表現上的溢美之詞。圖標設計過程中通過對被模擬物體的影調、光線的視覺表現來實現表面狀態的質感。

色彩，自古就是所有圖形圖像語言表達的重要因素之一。圖標設計中通過色彩的調整，不僅僅是客觀描繪被模擬物體的色彩特點，還可以發揮色彩的性格來定義不同的主觀情調，增強藝術表現力的同時帶給用戶良好的情感體驗。圖標設計中的色彩運用既要符合造型藝術用色的一般規律，同時也要考慮屏幕載體的色彩模式特點。

2.圖標中形式美感的特征

前文中我們已經討論了圖標的形式美的定義和要素，接下來我們可以主動地分析，具備了什么特征可以成為形式美。

第一個特征：既然圖標設計中大多采用的是擬物化設計，那么形式美和自然以及人工物的物質屬性、規律有著密切的聯系。任何藝術設計形式的原理都來人們對生活的認知，但不是對自然物和人工無目的盲目的模仿，圖標設計師通過模擬自然的法則來構成畫面。這里談到的法則也就是物質屬性、規律。我們對自然界的認識和了解的實踐活動，伴隨時代發展而擴展。貝爾發明電話以前，又有誰會想到今天代表撥打電話命令的圖標會是聽筒的形式哪？更何況今天我們可以放大一千倍去看細胞，站在地球以外觀察銀河系，這必然為圖標的設計提供新的形式美。

第二個特征：具有一定的抽象概括性，形式美概括了自然和生活中美的某些共同特征。抽象概括性，所體現的內容是簡潔的、清晰的。我們面對紛繁復雜的圖像時代，信息量越來越龐大，身處其中非常容易迷失，這就越來越需要更加簡潔明了的突出圖標的擬物化和指代性，這不僅僅是功能的需求，同時也是視覺本能審美的需求。“我們的知覺往往偏好簡單的結構，直線、圖形以及其它簡單的秩序，我們在混亂的外部世界往往易于看清這類有規則的形狀，而不是雜亂的形狀。”人們在創造美的圖像時都具有自覺的高度概括性和抽象性。

第三個特征：相對的獨立性，這里指的獨立性是指形式美具有獨立的審美意義。前面曾經提過，圖標一詞來源于ICON，而符號學對ICON的定義源自古代宗教的圖形符號以及早期人類的巖畫，它們都具有獨立的審美意義。后來的藝術領域也有一定的嘗試，例如畢加索對公牛的抽象概括，即其簡潔的線條勾畫輪廓，讓簡潔的具有粗細變化的線條也具備了相對的藝術生命力。早期的黑莓手機圖標上也有類似的例子。

3.圖標設計中的形式美原則

從古至今，各地的圖形圖像，無論文化背景多么不同，外觀形象差異多大，不論是巴西皮奧伊州巖畫還是埃及法老金字塔壁畫，或是中國敦煌壁畫，不論是古典的紋樣還是現代藝術或者是圖標等等，單從形式條件來評價某一事物或某一造型設計時，人們都會存在一種共識，它依據的就是美的形式原則。比如，在我們的視覺經驗中的垂直線，在藝術形式上給人上升、高大、嚴格等感受；而水平線則產生開闊、平靜等形式感。所以，我們可以得出一個結論，“任何審美活動都離不開感性形式，這些感性形式是由體、線、面、質地色彩和音響組成的復合體，是一種在空間和時間中可以感性直觀的物質存在。”人們在創造美的事物中發展了形式美，并從大量美的事物中概括出美的形式的共同特點，由此產生了形式美的原則，主要包括對稱與均衡、抽象與變形、主從與層次等方面。

第一個原則“對稱與均衡”。 幾何學上的對稱包括：中軸對稱、中心對稱、平衡對稱等等，對稱是一種最穩定的物理狀態，也是最穩定的視覺形式，對稱可以給人穩定、秩序感、莊嚴感、神圣感，對稱與均衡是圖標擬物化設計過程中必須考慮的問題。例如近來飽受爭議IOS7用戶圖形界面中的圖標設計就具有強烈的對稱關系。

第二個原則，抽象與變形。由于大部分圖標所占區域為一個正方形像素矩陣，所以在形態上為了達到視覺均衡，我們不得不考慮適當的抽象變形，例如用一支鉛筆作為繪畫功能圖標的擬物化設計中，我們不得不對鉛筆的寬度放大，突破鉛筆自身的比例關系來表現，才能保證視覺上的平衡。

第三個原則，主從與層次是任何一門藝術的基本關系，心理學家告訴我們，人的視知覺是對事物或圖像具有一定的歸納和概括能力，這與視知覺追求簡化是一致的。圖標設計擬物化過程中常常會遇到多個物體組合或是一個物體上有多個組合元素的情況，這個時候就需要我們分清主次，通過視覺焦點突出主體，而后合理運用空間關系以及色彩明確視覺上的層與層的遞進關系。

圖標形式美的視覺訓練

圖標設計中的形式美是值得我們研究的，并非只是功能和審美的需求，同時也是良好的用戶情感體驗的需要。我曾經在視覺傳達的思維方法訓練的相關論文《“由表及里”的視覺傳達設計基礎訓練》中提到過一些可通用的訓練方法，也是基于形式的要素和整體視知覺的，其中兩個遞進式訓練方法在文章的最后加以引用，也可作為圖標設計形式訓練的工具。通過這樣的訓練可以為設計提供新的視野，不同的視覺體驗，幫助他們尋求多樣化的形式表達。

“首先、由‘復制形式本質要素轉為抽象思維訓練，訓練學生對形式的視覺感受能力，強調形狀或體積、空間等形式本質要素的抽象思維能力；其次、對形式表象要素的視覺訓練，光影構成訓練強調光影表現及正負形的構成關系，質感模擬訓練觸感轉化為視知覺的過程，色彩構成訓練著力探尋色彩世界中的視覺體驗”

注釋

黎 鷹 李 亮 “圖形用戶界面的發展與分類” 《工程地質計算機應用》 2006 年第 4 期 第24頁

[英]亞歷柯斯.本特利 馬克.伊爾斯 [美]邁克爾.奧布萊恩 著 何亞婧 譯《竊言盜行---模仿的科學與行為》 清華大學出版社 2013年2月 第49頁

（作者單位：四川美術學院設計藝術學院）

作者簡介：任宏偉，講師。