視覺傳達(dá)設(shè)計(jì)在移動(dòng)UI界面設(shè)計(jì)中的應(yīng)用與現(xiàn)狀

摘要：隨著觸摸屏技術(shù)和網(wǎng)絡(luò)技術(shù)的日漸成熟，使得移動(dòng)通信行業(yè)得到飛速的發(fā)展，給人們的生活了帶來了巨大變化和便利。移動(dòng)UI設(shè)計(jì)包括使用界面、人機(jī)交互、用戶研究三個(gè)部分，使用界面在移動(dòng)設(shè)備的日常使用中是最先接觸也是最常接觸的一部分，視覺設(shè)計(jì)師只有合理的設(shè)計(jì)移動(dòng)界面，注重用戶情感需求，才能使移動(dòng)產(chǎn)品在激烈的市場競爭中脫穎而出。本文對(duì)視覺傳達(dá)設(shè)計(jì)概念進(jìn)行了分析，然后從色彩、文字、圖形和界面布局的視覺傳達(dá)設(shè)計(jì)方面對(duì)其在移動(dòng)UI設(shè)計(jì)中的運(yùn)用進(jìn)行了探討，以期對(duì)移動(dòng)UI的設(shè)計(jì)和應(yīng)用提供幫助。

關(guān)鍵詞：視覺傳達(dá)設(shè)計(jì);移動(dòng)UI界面設(shè)計(jì);現(xiàn)狀分析

視覺傳達(dá)設(shè)計(jì)所遵循的是審美原則和邏輯性，移動(dòng)設(shè)備技術(shù)的革新帶來了全新的觸覺體驗(yàn)，更多的是移動(dòng)設(shè)備的界面設(shè)計(jì)帶給人們?nèi)碌囊曈X感受?？v觀當(dāng)下移動(dòng)多媒體的應(yīng)用已經(jīng)作為人們?nèi)粘Ｉ钪胁豢苫蛉钡囊徊糠?，智能時(shí)代信息技術(shù)正在潛移默化地融入到人們的衣食住行，而用戶界面設(shè)計(jì)的優(yōu)良成為人們選擇移動(dòng)設(shè)備的標(biāo)準(zhǔn)。生活品質(zhì)的不斷提高帶給人們的追求層次也在不斷發(fā)生變化，產(chǎn)品的使用標(biāo)準(zhǔn)不僅僅要滿足顧客的使用需求，還要更高層次的滿足用戶的心理需求?？傊O(shè)計(jì)師可以在創(chuàng)作的過程中通過設(shè)計(jì)風(fēng)格的改變來體現(xiàn)出多元的文化特點(diǎn)，或者加入生活化的故事情節(jié)，以緩解高速運(yùn)轉(zhuǎn)的生活工作壓力，為枯燥乏味的日常生活增添活力。

1 基本概念和理論支撐

1.1 UI設(shè)計(jì)

關(guān)于移動(dòng)設(shè)備的UI設(shè)計(jì)，一般說來包括應(yīng)用界面、人機(jī)交互、用戶研究三個(gè)部分組成，應(yīng)用界面是設(shè)計(jì)師與用戶溝通最為直接的形式，設(shè)計(jì)師通過將界面中的文字、圖形、色彩經(jīng)過精心的設(shè)計(jì)排版，做出符合大眾審美需求的用戶界面，并融入生活化的設(shè)計(jì)元素，做出能夠迎合時(shí)代發(fā)展潮流，并具有個(gè)性化的移動(dòng)界面設(shè)計(jì)更容易吸引用戶的眼球，建立在科學(xué)性上的移動(dòng)UI設(shè)計(jì)把追求個(gè)性化和人性化功能作為新的追求，未來勢必向著滿足人們情感化需求的方向發(fā)展。

1.2 視覺傳達(dá)設(shè)計(jì)

所謂視覺傳達(dá)設(shè)計(jì)，其實(shí)就是通過視覺設(shè)計(jì)對(duì)頁面布局、繪畫等進(jìn)行較好傳達(dá)表現(xiàn)的設(shè)計(jì)方法。實(shí)際的視覺傳達(dá)設(shè)計(jì)，通常采用二維手段，通過融入文字獲得較好的信息傳達(dá)效果。在日常生活中，人們通過眼睛看到的事物就是一種視覺符號(hào)，需要采取某種方式進(jìn)行傳遞，傳遞內(nèi)容包含主體、目的、對(duì)象等。凡是人的視覺能夠感知到的基礎(chǔ)層面的設(shè)計(jì)都可稱之為視覺設(shè)計(jì)，圖形、色彩、文字是視覺設(shè)計(jì)中最為重要的表現(xiàn)元素。筆者則認(rèn)為視覺傳達(dá)設(shè)計(jì)最簡單的的概述就是一種通過信息的表現(xiàn)，來傳達(dá)出設(shè)計(jì)師的想法，從而引起受眾情感共鳴的一種設(shè)計(jì)形式。

2 視覺傳達(dá)設(shè)計(jì)在移動(dòng)UI設(shè)計(jì)運(yùn)用分析

面對(duì)當(dāng)前人們心理需求匱乏的情況下，在移動(dòng)界面設(shè)計(jì)由原來單純的視覺平面設(shè)計(jì)向情感化設(shè)計(jì)的方向延伸，在UI界面的設(shè)計(jì)中運(yùn)用色彩、文字和界面，拉近移動(dòng)與用戶之間的距離，更加符合當(dāng)代用戶的感性消費(fèi)理念。

2.1 移動(dòng)UI色彩設(shè)計(jì)

移動(dòng)設(shè)備（如日常應(yīng)用的移動(dòng)、平板電腦、導(dǎo)航儀等）的普及，以及各種APP的誕生，人們?cè)诹宅槤M目的界面呈現(xiàn)中更加追求具有美觀性的設(shè)計(jì)，在移動(dòng)UI界面的設(shè)計(jì)中，色彩對(duì)于整個(gè)界面的呈現(xiàn)有著重要的影響作用，在界面設(shè)計(jì)中靈活的運(yùn)用色彩，并使之與設(shè)計(jì)師的想法結(jié)合創(chuàng)造出有特色的設(shè)計(jì)，引起受眾的共鳴是設(shè)計(jì)的重點(diǎn)之所在。

每個(gè)人對(duì)色彩的感受都是不同的，同一種顏色面對(duì)不同的受眾會(huì)有不同的心理感受，在移動(dòng)界面的色彩使用中設(shè)計(jì)師應(yīng)該把握具有共性的色彩元素進(jìn)行創(chuàng)作，簡而言之就是要充分把握用戶的審美心理，盡量避免使用太突兀的色彩進(jìn)行創(chuàng)作，特定的情節(jié)環(huán)境色彩元素在移動(dòng)UI設(shè)計(jì)中是一個(gè)舉足輕重的組成部分。同一個(gè)人在不同的心理狀態(tài)下搭配不同的色彩使用。比如在情景化的設(shè)計(jì)中界面色彩的使用要與故事情景相互融合，能夠起到渲染畫面的作用，更能增強(qiáng)整體界面設(shè)計(jì)的藝術(shù)性。移動(dòng)設(shè)備界面的色彩設(shè)計(jì)對(duì)設(shè)計(jì)師提出了更高的要求，首先，在進(jìn)行色彩選擇的時(shí)候要具備敏銳的觀察能力，要求設(shè)計(jì)師對(duì)色彩要有獨(dú)特的色彩感覺，還要運(yùn)用扎實(shí)的理論基礎(chǔ)進(jìn)行組織編排，由于移動(dòng)界面這一實(shí)體的特殊性，在進(jìn)行色彩搭配的同時(shí)要靈活運(yùn)用思維進(jìn)行具體問題具體分析。

2.1.1 界面顏色的選用要符合具體行業(yè)的總體特點(diǎn)。特定顏色的使用在各個(gè)行業(yè)中所包含的意義不同，所呈現(xiàn)出的各式各樣應(yīng)用之所以能夠讓用戶在短時(shí)間內(nèi)做出區(qū)分，在于各種應(yīng)用顏色上的使用不同，在移動(dòng)界面設(shè)計(jì)中合理的配色有著十分重要的意義。在配色的使用上不僅要符合具體行業(yè)的總體特點(diǎn)，還要滿足受眾在移動(dòng)設(shè)備應(yīng)用的使用過程中更加舒適的用戶體驗(yàn)。例如在醫(yī)療類的移動(dòng)應(yīng)用中一般多使用藍(lán)色、綠色而比較張揚(yáng)的大紅色則較少使用。

2.1.2 相同色相，不同的明度變化。在界面顏色的使用中，往往使用的色彩較少。之所以看上去沒有很單一，是因?yàn)樵谙嗤纳嘀?，?duì)色彩的顏色進(jìn)行了明度上的變化，在UI界面設(shè)計(jì)中顏色上的漸變效果是經(jīng)常使用的一種手法，但要盡可能避免多色的混亂模式出現(xiàn)，在色彩中適當(dāng)?shù)募尤氚咨?，讓畫面簡潔清晰的同時(shí)，增加界面的美觀度，從而達(dá)到畫面意想不到的視覺效果。

2.1.3 在同類色的使用中合理加入補(bǔ)色。在色彩的搭配中經(jīng)?？梢娫O(shè)計(jì)中互補(bǔ)色的使用，互補(bǔ)色就是在色相環(huán)中相差180度的色彩區(qū)域，在界面顏色的使用上適當(dāng)?shù)募尤胙a(bǔ)色能夠增加畫面的平衡感，在整體界面的設(shè)計(jì)中起到畫龍點(diǎn)睛的作用，通常在電子商務(wù)類的應(yīng)用界面比如天貓、京東等APP的設(shè)計(jì)中，設(shè)計(jì)師有意識(shí)的在需要引起顧客注意的地方加入補(bǔ)色的使用，以此來吸引顧客眼球，起到很好的宣傳作用。

2.2 移動(dòng)UI文字設(shè)計(jì)

文字在視覺設(shè)計(jì)中作為指示性語言，已經(jīng)成為界面與用戶之間溝通的重要形式。文字在移動(dòng)設(shè)備界面中作為各級(jí)菜單標(biāo)題存在，能夠讓用戶一目了然所處層級(jí)的操作用途，除此之外文字的設(shè)計(jì)還可以作為對(duì)所讀信息的狀態(tài)說明等。UI設(shè)計(jì)中的文本要經(jīng)過設(shè)計(jì)師加工提煉，用最精確的語言描述信息所包含的視覺內(nèi)容，除此之外篩選出來的文字應(yīng)該具有代表性，能夠使用戶完全明白操作程序的具體用途，不應(yīng)該具有含糊不清的文字在內(nèi)，在界面設(shè)計(jì)中需要凸顯的文字要做出適當(dāng)?shù)淖兓?，在整體畫面和諧的前提下，給文字做出顏色上或者字體上的變化，進(jìn)行設(shè)計(jì)的前提不要妨礙用戶的界面操作，還要滿足整體界面的視覺舒適度。對(duì)移動(dòng)設(shè)備界面的文字進(jìn)行處理，要注意視覺層級(jí)上文字大小的設(shè)計(jì)，使文字之間保持相對(duì)舒適的距離，使用戶操作起來不至于對(duì)密密麻麻的文字產(chǎn)生視覺疲勞，文字行距也要進(jìn)行適當(dāng)?shù)恼{(diào)整，在界面設(shè)計(jì)中文字不可排的過滿，畫面中適當(dāng)留白，讓畫面有呼吸的空間存在。

2.3 移動(dòng)UI圖形設(shè)計(jì)

相比文字來說圖形跟便于人們進(jìn)行識(shí)別，圖形傳達(dá)語義的速度比文字也要快得多，由于所處地域文化的差異在文字的表達(dá)上難免引起歧義，圖形的傳播就相對(duì)來說更為方便，具有直觀性、概括性等特點(diǎn)。用文字進(jìn)行描述要占用移動(dòng)設(shè)備界面大量的篇幅，在當(dāng)下較快的生活節(jié)奏下，用戶很難為無用信息停留更多的時(shí)間，因此選用圖形進(jìn)行闡述是適應(yīng)時(shí)代潮流的必然之舉。移動(dòng)設(shè)備界面中的圖形創(chuàng)意設(shè)計(jì)帶給用戶新的視覺感受，打開了讓受眾認(rèn)識(shí)世界的窗口。圖形語言已經(jīng)成為世界性的語言，在移動(dòng)設(shè)備界面設(shè)計(jì)中加入生動(dòng)形象的圖形設(shè)計(jì)，在為畫面增添情趣的同時(shí)，能夠靈活的與用戶產(chǎn)生互動(dòng)，并在界面設(shè)計(jì)中起到對(duì)用戶進(jìn)行提示操作的用途。移動(dòng)設(shè)備界面設(shè)計(jì)中圖形創(chuàng)意具有（下轉(zhuǎn)頁）

（上接頁）深刻的語義和創(chuàng)新性帶給用戶具體可感的形象世界感受。

2.4 移動(dòng)UI板式設(shè)計(jì)

移動(dòng)設(shè)備中的版式設(shè)計(jì)同海報(bào)中的版式設(shè)計(jì)有著許多相同之處，只是所賦予的整體環(huán)境上的區(qū)別，以及畫面版式大小的不同。在移動(dòng)設(shè)備的版式設(shè)計(jì)中，要嚴(yán)格把控功能區(qū)與任務(wù)區(qū)的界限，要想在較小的移動(dòng)設(shè)備界面設(shè)計(jì)中盡可能多的展示更多內(nèi)容，需要設(shè)計(jì)師做到界面空間的合理劃分，并學(xué)會(huì)運(yùn)用視覺設(shè)計(jì)語言進(jìn)行創(chuàng)意化表達(dá)，諸如在界面設(shè)計(jì)中為強(qiáng)調(diào)特殊部分得內(nèi)容可以對(duì)其他區(qū)域進(jìn)行適當(dāng)留白，轉(zhuǎn)移用戶的視覺重點(diǎn)，保持界面的視覺均衡。在移動(dòng)設(shè)備界面版式設(shè)計(jì)中且不可使畫面內(nèi)容太過飽滿，過于飽滿的視覺設(shè)計(jì)容易造成用戶視覺疲勞，保持界面設(shè)計(jì)的輕松愉悅性，對(duì)視覺元素中的符號(hào)進(jìn)行合理規(guī)劃對(duì)用戶的使用體驗(yàn)有著重要的作用。

3 結(jié)語

移動(dòng)UI在設(shè)計(jì)實(shí)踐中要加強(qiáng)界面色彩、文字和布局的視覺傳達(dá)設(shè)計(jì)，通過簡單的界面進(jìn)行內(nèi)容的直觀展示，從而減少界面信息獲取過程中的認(rèn)知障礙，為用戶的應(yīng)用體驗(yàn)做出了大幅度的改進(jìn)。

參考文獻(xiàn)：

[1] 周璨.視覺傳達(dá)設(shè)計(jì)在移動(dòng)UI界面設(shè)計(jì)中的應(yīng)用[J].教育教學(xué)論壇，2019（12）.

[2] 韓晶晶，李潔.手機(jī)UI設(shè)計(jì)中色彩的重要性及應(yīng)用研究[J].電腦知識(shí)與技術(shù)，2017（27）.

[3] 何揚(yáng)帆，覃會(huì)優(yōu).論圖像學(xué)分析法對(duì)移動(dòng)UI界面設(shè)計(jì)的應(yīng)用研究[J].工業(yè)設(shè)計(jì)，2017（08）.

作者簡介：張毅（1983—），男，河南平頂山人，平頂山工業(yè)職業(yè)技術(shù)學(xué)院助教，研究方向：視覺傳播設(shè)計(jì)與制作。

（作者單位：平頂山工業(yè)職業(yè)技術(shù)學(xué)院）