藝術(shù)設計中UI設計及其應用

袁韞璐（上海大學 上海美術(shù)學院，上海 200072）

隨著移動互聯(lián)網(wǎng)時代的到來，新媒體藝術(shù)逐漸滲入人們的生活，新技術(shù)開始改變?nèi)藗兊纳罘绞?。當下電子產(chǎn)品中的應用程序和軟件的類型也正不斷增加，幾乎涵蓋了人們工作，生活，學習，娛樂等各個方面。被大家所熟知的蘋果公司的智能產(chǎn)品iPad、iPhone，華為榮耀系列手機，廣受消費者的喜愛。這其中原因不僅僅是出色的軟件和硬件設計，流暢美觀的UI設計也激起了消費者的購買欲望。在這種背景下，有關UI設計的藝術(shù)設計迅速發(fā)展，人們對此也越來越關注。

一、UI設計及其分類

UI即User Interface的縮寫，譯為用戶界面，可以引申“為用戶與界面之間的關系”。UI設計也可稱為界面設計，它主要指對軟件的人機交互、操作邏輯和界面美觀進行設計，提高軟件的品位和個性化，使其操作變得更為簡單和快捷，并基于用戶群體進行視覺方面的設計，從而體現(xiàn)出軟件的特點。但從藝術(shù)角度來講，UI設計則是信息技術(shù)、藝術(shù)美感和市場三者結(jié)合的產(chǎn)物，它需要考慮操作、界面設計的藝術(shù)美感、消費者的需要和對產(chǎn)品的期望，綜合了用戶需求、軟件功能、硬件配置和使用環(huán)境等多種因素。

通過對UI設計的不同需求以及界面設計元素對用戶行為的影響，UI設計可以分為以下幾類：

①基于功能實現(xiàn)的UI設計。交互式設計界面的最基本性能是它的功能和可用性。通過簡單的界面設計，順利地將作品本身的信息傳遞給用戶，使得用戶能成功完成操作，即用戶就是功能界面存在的基礎和價值。例如地鐵購票界面（如圖1-1），設計都很簡約直接，剔除了不需要的元素，讓人能夠方便操作。

圖1 -1 （來源：網(wǎng)頁）

②注重情感表達的UI設計。設計真正的藝術(shù)魅力，在于通過界面與用戶進行情感傳遞。主要注重于用戶在該界面時，看著界面接觸到界面里的各種美化產(chǎn)生的情感。Android手機的鎖屏頁、時間、背景頁面的設計能夠跟隨季節(jié)和時間的變化而變化（如圖1-2），將用戶現(xiàn)實的感受融合進了虛擬界面。

圖1 -2（來源：筆者自截）

③基于環(huán)境因素的UI設計。這一點是將界面結(jié)合環(huán)境一起考慮的，周圍的環(huán)境對設計作品的信息傳遞有特殊的影響。比如網(wǎng)頁的顏色或者界面在強光下看，或者在黑暗的環(huán)境里瀏覽會影響用戶體驗。

二、藝術(shù)設計中UI設計的原則

在適應市場流行的UI設計要求和樣式的同時，我們需要更加注意用戶操作的便利性，用戶屬性信息，用戶排列分組與人性化要求，應遵循以下幾條合理的設計原則：

1. 風格設計原則

風格設計原則整體表現(xiàn)在界面效果的表現(xiàn)形式與平臺整體的風格要求，即保持其一致性。

UI界面設計的一致性即通過視覺結(jié)構(gòu)、視覺層次、視覺元素等達到設計的統(tǒng)一整體，減少用戶認知成本。如果在設計過程中忽視一致性原則，設計看起來比較復雜，那么用戶的認知成本就會提高，給用戶帶來使用上的困難，延長用戶的學習時間，使用戶感到厭倦。

以常見的iOS系統(tǒng)中的界面設計來說，由于iPhone和iPad在設計風格上較為統(tǒng)一（如圖2-1），形成了一套固定的設計風格，所以無論人們先使用其中的前者還是后者，都可以很輕松地上手另外一樣。

2. 簡化操作原則

“好的設計是無意識的，就像我們在實際生活中操作一樣?！币虼嗽谶M行界面設計時，我們也需要對人類的一些日常行為習慣進行深入了解?！袄硐肭闆r下，UI設計要盡可能地簡潔，讓用戶有一個直接操作的感覺?！?/p>

例如，人們在生活中閱讀過報紙和書籍，對翻書的動作非常熟悉，但是他們?nèi)绾卧陔娮悠聊簧戏瓡?？蘋果ibooks閱讀器的設計很好地解決了這個問題。 在書籍的展示或翻頁動作的設計中，它基于人類的生活習慣，并使用模擬的生活環(huán)境和情況，讓用戶從本能上能夠很好地操作界面。

3.掌控體驗

人類往往對能夠掌控自己和周圍的環(huán)境感到很舒心，如果超出所能控制的范圍，則會使其感到焦慮。保證界面處在用戶的掌控之中，讓用戶能夠靈活、自由地控制程序的運行，這也會產(chǎn)生好的效果。

這里仍然以iPhone為例，自成立以來，它一直以觸摸設計的強大功能為特征。在長時間的使用過程中，大多數(shù)用戶已經(jīng)習慣了觸摸操作界面，在手機的整個使用過程中都具有控制經(jīng)驗，讓用戶能夠感到舒適和滿足。

三、藝術(shù)設計中UI設計元素

隨著互聯(lián)網(wǎng)技術(shù)的進一步的發(fā)展與普及，用戶對界面審美和個性化視覺的要求越來越高，對UI設計師同樣也提出了更多層次要求。

根據(jù)用戶的心理傾向，在一個移動設備有限的空間內(nèi)創(chuàng)造出更加符合用戶習慣和操作要求的界面，其中涉及到的元素內(nèi)容也有很多。

1.頁面布局和尺寸

整體頁面布局是UI設計的重中之重，它確定了整個界面的基調(diào)和主體，讓用戶對其有一個初步的認識，在這部分設計中，更需要注重美感。

頁面尺寸則是根據(jù)所要設計的屏幕大小和分辨率進行設計，一般以填滿屏幕為宜，不宜過小。

對于多界面UI設計，首頁界面設計也非常重要。首頁作為用戶最先看到的第一界面，它的交互體驗直接影響到用戶的后續(xù)體驗。以世界上最大的體育運動用品網(wǎng)絡零售商Footlocker app的界面為例（如圖3-1），為了吸引顧客，它的首頁內(nèi)容（右1和右2）較其他采集顧客信息以及購買支付頁面中內(nèi)容更為豐富。

（來源：筆者自截）

2.文字和圖片

文字和圖片是界面構(gòu)成的主要元素。文字元素看似細微，但其本身也能傳達其它元素無法傳達的信息。通過空間、文字、圖形之間的相互關系，建立整體均衡狀態(tài)，以此產(chǎn)生和諧的美感。

針對不同的目標群體可考慮設計不同的圖文提示，比如老年人使用的界面圖文可適當放大，突出人性化。Big Launcher軟件（圖3-2） 就是一個可以讓所有安卓手機瞬間變身老人機的應用。它界面簡潔，不花哨，符合老年人的審美觀。而年輕人使用的界面色彩設計可更加活躍一些，以此突出品牌特色，這種界面在生活中比較常見，本文就不一一舉例了。

3.色彩

色彩是絕大多數(shù)設計給用戶傳遞的最顯著的視覺元素之一，是藝術(shù)表現(xiàn)的要素之一，不同的色彩能夠使用戶產(chǎn)生不同的感受。比如，在開展 UI界面設計的過程中，藍色是UI設計中最常用的顏色之一，能夠給人一種信任感，F(xiàn)acebook、Twitter、Shazam、Safar等界面設計中大多是選擇藍色為主色調(diào)。

同時，色彩也并不是越多越好，通常配色方案當中，色彩數(shù)量盡量控制在3種左右。設計師根據(jù)色彩對人們心理的影響，合理地加以運用，通過創(chuàng)建配色方案，系統(tǒng)地對UI界面的色彩進行管理，能更好的進行視覺信息傳達。

另外也有一些特殊類型的軟件，采用色調(diào)顛倒的方式提高用戶的黏度。例如現(xiàn)在廣受大家喜愛的Keep運動軟件，它整體以冷色系為主，旨在與打造出簡潔、寧靜的輕運動風格，這種潤物細無聲的低強度積極情緒，即使用戶每天都打開來用，也不會因為 UI 界面而產(chǎn)生疲累等負面情緒。

四、UI設計的應用

美好的事物總是讓人心馳神往，在如今人們被電子產(chǎn)品充斥著的生活，優(yōu)秀的UI設計一定程度上更能吸引消費者的興趣，而融入了藝術(shù)設計的UI設計也直接影響了產(chǎn)品本身的品質(zhì)感。

iPhone和iPad，拋開科技水平的領先和大力的宣傳，富有美學的UI設計也是“果粉”們選擇它的原因之一。2019年，在蘋果的發(fā)布會上由喬布斯第一次為觀眾展示滑動解鎖的那一刻，從此UI設計走進了全世界。僅從這一項實例來看，UI設計的作用就不能被忽視。

結(jié)語

伴隨著科學技術(shù)的不斷發(fā)展，UI設計也跟隨時代和用戶需求不斷進步。同時，在未來的設計過程中，滿足規(guī)范性保障的前提下，更需具有一些美術(shù)、藝術(shù)基本理論和知識，來讓 UI設計更加具有藝術(shù)特征。只有這樣，UI設計才能為電子設備添加情感色彩，滿足人們的心理需求和情感交流，豐富人們的生活，體現(xiàn)出更加人性化的設計和科技帶來的舒適感。