陳苡涵

（東軟集團股份有限公司，遼寧 沈陽 110000）

隨著信息時代的飛速發(fā)展，新興學科“信息設計”一詞浮出水面。信息設計通常指的是具有信息傳遞功能的產(chǎn)品設計，開發(fā)商為滿足用戶的參與感與體驗感，同產(chǎn)品設計師研究出視覺與交互兩者為產(chǎn)品的賣點。視覺感受評分高的產(chǎn)品更受用戶青睞，而良好的交互體驗感可以增加用戶對產(chǎn)品的依賴性，增加產(chǎn)品的附加值。

本文重點闡述UI 設計的本質(zhì)、色彩與圖形符號元素等對界面的重要性以及對視覺效果、用戶體驗、交互設計三大模塊進行比較和分析。

1 UI 設計的本質(zhì)探討

1.1 UI 的概念

UI 即User Interface（用戶界面）的簡稱。主要是指對軟件的人機交互、操作邏輯、界面美觀的整體設計，也叫界面設計[1]。

20 世紀90 年代初，有學者將“界面”一詞引入到管理科學領(lǐng)域。JefRaskin 在《人本界面，交互式系統(tǒng)設計》一書中指出：“就消費者而言，界面就是產(chǎn)品。”[2]一個好的產(chǎn)品不僅要有個性、有品位的視覺外表，還要有易于用戶操作的簡單、自由、舒適的特點。

1.2 UI 設計的分類

UI 設計由用戶研究、交互設計和視覺設計三部分組成。用戶研究是指在新產(chǎn)品開發(fā)前期，明確用戶的需求，了解產(chǎn)品的定位、目標群等，致力于進行深入的探討，以外部用戶需求作為產(chǎn)品目標，體系化地建立產(chǎn)品設計語言，并用創(chuàng)意設計助力客戶業(yè)務，推動設計體驗與業(yè)務發(fā)展的對接。本著“用戶體驗至上”的原則進行溝通與交流，由抽象到具象再返回抽象的全鏈路過程。一套完整的產(chǎn)品設計要分為五大層面去研究考慮，即表現(xiàn)層、框架層、架構(gòu)層、范圍層、戰(zhàn)略層。最終，設計出讓客戶與用戶兩者皆滿意的產(chǎn)品。

比爾·莫格里奇（Bill Moggridge），世界上第一臺筆記本電腦GRiD Compass 的設計師，在1984 年一次設計會議上提出“交互設計”概念，當時命名為“軟面（Soft Face）”，后更名為“Interaction Design”[3]。交互設計由交互設計師主要設計軟件的操作流程、軟件結(jié)構(gòu)、操作規(guī)范等，軟件開發(fā)工程師用代碼配合實現(xiàn)完成。

視覺設計通常被人們稱為“平面設計”，在這里包含種類頗多，分為標志設計、包裝設計、字體設計、圖像設計、廣告設計、裝潢設計、界面設計等。目前，UI 設計師從事的工作主要為界面設計，界面設計在我們?nèi)粘９ぷ魃钪袩o處不在。例如，手機App 客戶端、企業(yè)公司后臺管理系統(tǒng)、各大門戶網(wǎng)站、數(shù)據(jù)可視化大屏展示等。從心理學意義來分析，界面設計包含視覺、聽覺、觸覺、情感等。一套完整且高質(zhì)量的設計效果圖絕不是設計師與開發(fā)者自己主觀的意見，而是需要考慮使用者、使用環(huán)境、使用方式，最終實現(xiàn)為用戶而設計。用戶在體驗操作中進行反饋，這是一個漫長的過程。

2 UI 設計中存在的心理學

2.1 格式塔心理學

格式塔心理學又叫完形心理學，主張研究直接經(jīng)驗和行為，強調(diào)經(jīng)驗和行為的整體性，其探討人類對于圖形色彩語言的認知反應，是心理學發(fā)展中的一個重要分支。在形式上、顏色上、距離上進行自發(fā)的關(guān)系構(gòu)建[4]5。

圖像在空間上呈現(xiàn)了它的機理，這種機理被用戶的潛意識感知。在UI 設計中以格式塔心理美學為指導，用戶可以在設計師設計的圖形與色彩語言的指導下進行有目的性的操作，并且這種行為是在用戶無意識自主作用下進行的，這種潛意識的行為對于交互設計的介入有著極大的鋪墊作用。

2.2 視覺色彩心理學

色彩與人類心理有著緊密的聯(lián)系，在不同的意識形態(tài)、不同的領(lǐng)域，人們可能有著不同顏色的喜好。色彩通過心理的轉(zhuǎn)化，從知覺到情感再到思想記憶，其反應與變化是極其復雜的。那么用戶看到不同色調(diào)的界面效果，隨之心理也會產(chǎn)生不同的情緒反應。例如，大家熟知的學習強國App，整體界面風格都采用肉眼觀看舒適的紅色基調(diào)，既體現(xiàn)出國家政治的黨性特點，又能激發(fā)黨員與群眾的學習熱情，兩全齊美。在專業(yè)色彩學中，色相、明度、純度、對比度、飽和度等都發(fā)揮著其不同的作用。在電子屏幕的視覺環(huán)境中，視網(wǎng)膜中間的椎細胞對紅、黃、綠色系最為敏感，所以研究觀察到，一個界面最為突出顯示的地方或提示詞、按鈕等設計都是以這三種顏色為主。反之，黑、白、灰這類顏色則大多為背景色。從這可以得出，色彩在某種程度上是主觀的，大部分用戶對色彩都會有一個共同的認知，并達成一致。

用戶的視覺色彩對心理映射也有著不同的象征意義。通常情況下，以科技感為主題的設計選定藍色；環(huán)保、節(jié)能、安全為主題的設計選定綠色；政治、黨員、國家為主題的設計選定紅色。

3 UI 設計中整體架構(gòu)與風格的應用

3.1 框架構(gòu)圖的重要性

為了更好地給用戶展示交互性能，設計師需要對不同尺寸屏幕進行塊狀分割。布局是界面構(gòu)成的前提，是后續(xù)展開交互設計和界面設計的基礎(chǔ)。設計者需要根據(jù)需求及操作優(yōu)先級等內(nèi)容特點，選擇合理布局。無論移動端、PC 端都應保證色彩、字體、圖標、圖片尺寸、常用組件這些必備元素的舒適性與合理性。

在UI 設計中必不可少的是常規(guī)狀態(tài)欄及次要信息欄的區(qū)域劃分。根據(jù)調(diào)查研究顯示，大約87%的左腦主導性人群比右腦主導性人群視覺范圍少12px，為了保證獲取信息的有效范圍，ios 和Android 系統(tǒng)分別對系統(tǒng)顯示中的導航欄、狀態(tài)欄、信息欄等進行了相應的調(diào)整。調(diào)整后的調(diào)查顯示，用戶的視覺舒適度與視覺承受力上升了約12%[4]12。

3.2 色彩的基本原理與視覺習慣思維

光源與物體的色彩對用戶的感知能力產(chǎn)生極大的影響。如果我們對來自兩個不同光源環(huán)境下的相同屏幕進行分析比較，可以發(fā)現(xiàn)界面所呈現(xiàn)的顏色并不相同。這是因為，物體在不同光源照射的情況下產(chǎn)生的有效光頻率不同。

在UI 設計中，文字、圖標符號與背景色之間有著千絲萬縷的聯(lián)系。例如，一段字號較小的文字想要突出顯示，那么文字本身色彩就需要吸人眼球，反之，背景色區(qū)域要進行色彩柔和調(diào)整，讓背景與文字有著強烈的色彩對比，這樣更易于使用者眼睛的迅速搜索。

色彩由明度、純度、色相三要素組成。色相決定顏色本身的屬性，而顏色的改變要隨著明度和純度的變化而變化。明度則較為特殊，它可以獨立地存在，不受色相與純度的影響。色彩的力量也體現(xiàn)在每個顏色都能產(chǎn)生不同的面積大小，把兩種色值相同且面積大小一致的顏色放在一起，因為明度、純度、色相的不同，也會給人視覺產(chǎn)生不同大小的感覺。

3.3 UI 設計的視覺元素與美學表達

圖形符號語言的發(fā)展使用過程可以追溯到人類符號的創(chuàng)建初期，因此，從廣義上是指具有指代意義的圖形符號，具有高度濃縮、快捷傳遞信息、便于記憶的特性。從狹義上是指應用于計算機軟件上的圖形符號，包括文字符號、密碼符號、圖騰等等。在界面設計中，我們稱它為“現(xiàn)代化的命令”。

圖標是UI 設計中除了文字以外最不可或缺的視覺元素，在界面中雖然只占很小的位置，但它卻是檢驗設計師基本設計水平的標準，并且擔當著整個產(chǎn)品點睛之重任，它可以直接影響一款產(chǎn)品的形象和氣質(zhì)。在界面中，圖標既是整個頁面的核心支撐體，又直接影響著產(chǎn)品的視覺體驗和產(chǎn)品調(diào)性。

圖標在生活中隨處可見，是國際通用性語言。例如，手機App中微信、支付寶、淘寶等軟件啟動圖標；室內(nèi)設計中商場指示牌等等。圖標具有形、意、色等多種刺激，具有傳遞信息的功能，抗干擾能力強，圖標大小可隨意調(diào)節(jié)，表示視覺和空間概念，便于布局美觀。圖標的形式多樣化，并且表現(xiàn)形式多種多樣，有線性圖標、面性圖標、線面結(jié)合圖標等等，在這里不一一贅述各分類，查閱相關(guān)圖片一看即懂。

4 淺談UI 設計中的理論知識

4.1 視覺認知理論

UI 界面設計中的視覺認知主要是指用戶對視線所觸及的信息產(chǎn)生視覺反應，進而產(chǎn)生心理活動并且逐步完成信息接收的過程[5]10。設計師在進行界面設計時，要充分保證用戶的視覺最大化范圍，關(guān)注點定在視覺范圍內(nèi)能感知的信息上，這就要求設計師要會運用心理暗示對用戶產(chǎn)生引導，使用戶用最快最有效的方法和途徑獲取最有價值的信息。

在視覺認知里，視覺聯(lián)想和視覺經(jīng)驗為兩大重要組成部分。視覺聯(lián)想是指建立在視覺經(jīng)驗基礎(chǔ)上由一個事物轉(zhuǎn)移到另一個事物的心理過程。視覺經(jīng)驗是指設計師在進行創(chuàng)作設計時進行的經(jīng)驗聯(lián)想[5]10。由于每個人所處環(huán)境、背景、接受的文化教育不同，進而經(jīng)歷不同，那么設計師會根據(jù)這些產(chǎn)生豐富的聯(lián)想，經(jīng)驗越多，設計的作品更趨于大眾化用戶群，在最大程度上滿足大多數(shù)用戶的視覺需求和心理認知。

4.2 信息傳播理論

在UI 界面設計中，設計師經(jīng)過理解、構(gòu)思、設計和規(guī)劃，用藝術(shù)的手法向某一特定的用戶群傳遞一個具體的信息[6]。因此，設計作為“視覺”進行“傳達”是傳播的一種形式。顯而易見，在傳播學的深度影響下所產(chǎn)生的效果更具影響力。界面就是設計師向受眾群傳達信息的一種媒介。

4.3 人機交互理論

人機交互是指人與計算機之間使用某種對話語言，以一定的交互方式，為完成確定任務的人與計算機之間信息交換的過程[7]。隨著設備的逐漸復雜化，我們將有更多、更好的交互方式，例如當下流行的語言控制、觸摸互動等。希望我們在以用戶為中心的前提下，創(chuàng)造出更多、更新奇的交互方式，并且簡單、易操作，這樣未來的交互體驗才會成功。簡言之，只有設計師真正地置身于用戶的角度，才能設計出更加實用、獨特、個性的產(chǎn)品，并最終滿足用戶群。

5 結(jié)語

通過調(diào)研總結(jié)，本文闡述了界面設計中存在的心理學、交互設計、用戶調(diào)研、界面整體架構(gòu)、色彩、圖形符號的應用，以及對理論知識的淺談。目前互聯(lián)網(wǎng)發(fā)展形勢大好，UI 設計應緊跟時代的步伐，用戶群需求越來越高，設計師需要在保證基礎(chǔ)功能的前提下，多元化發(fā)展，要根據(jù)目標用戶個性化定制開發(fā)，將以人為本的原則與設計經(jīng)驗緊密結(jié)合。在信息技術(shù)發(fā)展的驅(qū)動下，牢牢掌握新技術(shù)、新方向，使產(chǎn)品能夠成為一種特定的文化。文化構(gòu)成了我們生活的精神空間和物質(zhì)空間，優(yōu)秀的傳統(tǒng)文化貫穿其中，將中國悠久的歷史傳播開來，這樣既符合了用戶心理需求又升華了產(chǎn)品本身。