吳倩

?摘 要：UI設(shè)計是多媒體環(huán)境之下誕生的新興專業(yè)，主要研究的是人機(jī)交互整個實現(xiàn)過程中界面的美觀與合理化處理;交互行為往來的框架結(jié)構(gòu)便捷化;以及用戶體驗設(shè)計。其中，關(guān)于藝術(shù)美學(xué)設(shè)計的涵蓋方向主要表現(xiàn)于用戶界面處理階段。也就是UI中的GUI分支。它好比人類的外觀穿著，類似于“人靠衣裳，馬靠鞍”的俗語。GUI視覺設(shè)計主要解決的是用戶使用APP過程中，對于界面美化以及信息提取的合理性和便捷性。體現(xiàn)在對于圖標(biāo)或按鈕控件的設(shè)計，和整套應(yīng)用程序的視覺標(biāo)準(zhǔn)顏色的設(shè)置，以及配套的插圖元素和廣告內(nèi)容的限定?？傊畬τ诮缑嬉曈X方面的標(biāo)準(zhǔn)與要求工作都屬于界面視覺設(shè)計的范疇。

關(guān)鍵詞：APP界面 界面設(shè)計 視覺設(shè)計

手機(jī)應(yīng)用程序?qū)τ诋?dāng)今社會背景下的主流人群而言是每天必不可少、反復(fù)進(jìn)行的人機(jī)交互過程實現(xiàn)的最主要載體途徑。所以APP的視覺設(shè)計美觀化是十分必要的。

在做視覺美化工作之前，我們首先要明白，關(guān)于APP常見的界面類型有哪些？比如：程序啟動頁，或者稱之為閃屏頁，這類頁面通常存在于每款A(yù)PP首次打開時的系統(tǒng)更新過程;程序引導(dǎo)頁，作為閃屏啟動頁與程序首頁之間的中間穿插頁面，肩負(fù)著對于本款應(yīng)用程序功能介紹以及主體文化的宣傳作用;程序注冊頁，發(fā)展至今其外觀視覺結(jié)構(gòu)相對來講更加簡潔化。注冊頁面對于APP使用者而言具有很好的歷史記錄作用以及個人隱私保護(hù)的作用。能夠形成獨(dú)立的社區(qū)平臺文化;最后是應(yīng)用程序首頁，她所涵蓋的視覺內(nèi)容相對來說是剛才所介紹的所有頁面內(nèi)容中元素最多的。肩負(fù)著對于整體應(yīng)用程序的使用功能區(qū)分鏈接，相當(dāng)于整個APP最核心內(nèi)容的展現(xiàn)。

關(guān)于應(yīng)用程序的啟動頁面，在功能上一般會在視覺停留上保持3～5秒鐘的時間，這個時間限制取決于對APP自身的文化宣傳以及避免受眾使用感的疲勞影響。啟動頁面一般由以下部分內(nèi)容組成：啟動按鈕和確認(rèn)進(jìn)入程序狀態(tài)按鈕;應(yīng)用程序的標(biāo)準(zhǔn)顏色或圖片的選擇使用;APP文化相關(guān)的廣告語。

一、啟動圖標(biāo)的視覺形成

關(guān)于UI界面中的圖標(biāo)大致方向上可以劃分為擬物化階段到扁平化階段的發(fā)展。這兩個方面的圖標(biāo)具有明顯的視覺化風(fēng)格差異，各有優(yōu)劣?；旧峡梢詺w納為擬物化圖標(biāo)便于引入受眾的心理情感表達(dá)，因為它主要針對的是圖標(biāo)自身質(zhì)感的還原，所以情境化特征明顯。但是“比葫蘆畫瓢”的嫌疑過重。相對來說對于設(shè)計的過程可能性比較小;相反，扁平化圖標(biāo)雖然外觀簡潔，多見于線型和正負(fù)形面狀圖標(biāo)的展現(xiàn)。但是，設(shè)計創(chuàng)作方法可能性很廣。但它也有自身的不足。由于扁平化圖標(biāo)形式感過強(qiáng)，對于原始對象的比擬程度較弱，所以說難免給消費(fèi)者帶來一種過于理性和冰冷的使用感受。

除了啟動圖標(biāo)之外，APP啟動頁上通常還會有時間倒計時按鈕，它的作用在于提醒受眾關(guān)注自身與進(jìn)入APP首頁使用過程的時間距離。另一方面，也減少了等待程序加載過程的枯燥感。

二、標(biāo)準(zhǔn)色和圖片的視覺形成

關(guān)于界面顏色的表達(dá)，在視覺要素中色彩作為能夠被受眾視覺層面瞬時捕捉的要素，一直肩負(fù)著吸引受眾注意力的強(qiáng)大責(zé)任。所以對于APP而言，首先需要設(shè)定自身的設(shè)計發(fā)展定位，以及受眾人群的模擬定位，便于形成配套的能夠協(xié)助推廣APP使用市場的色彩理論體系。另外，啟動頁中除了大面積色塊的使用，還有一種形式也常用于制作過程，那就是大圖虛化作背景。關(guān)于圖片要素的要求無非是能夠適應(yīng)和配比界面的尺寸以及APP自身文化的傳承語言。并且色塊與大圖虛化背景這兩種形式的視覺處理方式，都能夠很好地與上一步我們提到的啟動圖標(biāo)進(jìn)行配合。啟動圖標(biāo)位于界面重心位置，但是畫面占有率較小，相對應(yīng)的色塊和大圖虛化背景的使用，則能夠很好的彌補(bǔ)畫面有效位置的虛空。

三、廣告語的視覺形成

作為視覺要素中能夠?qū)⑿畔⒈磉_(dá)準(zhǔn)確的文字要素，在界面中一般會以廣告語的形式存在。字?jǐn)?shù)不會過多，但是精到且準(zhǔn)確。文字字體一般采用個性化設(shè)計處理，不建議使用字體庫中常用的字體。目的是為了展現(xiàn)出APP本身與同類產(chǎn)品的差異化特征。關(guān)于文字含義方面，要求能夠吻合應(yīng)用程序本身的訴求點以及達(dá)到受眾需求的情感心理。在視覺方面分析的話，如果說大圖虛化背景作為塊面形式存在，啟動圖標(biāo)或倒計時提示按鈕作為點狀結(jié)構(gòu)存在，那么此刻我們所說的廣告語，則作為整個畫面的線性協(xié)調(diào)要素存在，能夠很好地綜合過大的塊面與過小的點狀結(jié)構(gòu)之間的強(qiáng)烈碰撞，綜合整個界面的秩序感與統(tǒng)一化。

手機(jī)應(yīng)用程序的啟動界面視覺設(shè)計，正迎合了那句俗語“麻雀雖小，五臟俱全”，它肩負(fù)著整款A(yù)PP功能介紹或者是品牌形象的外觀特征展現(xiàn)。又能將APP自身的特征用視覺元素直觀地呈現(xiàn)于消費(fèi)者面前，增強(qiáng)受眾的可信賴程度。啟動頁面的視覺構(gòu)成分級并不復(fù)雜，但是越簡潔的呈現(xiàn)方式越能夠暴露出設(shè)計的深度問題。所以對于應(yīng)用程序的啟動界面設(shè)計，在整塊APP視覺設(shè)計稿中占有舉足輕重的地位，名片式的性質(zhì)使得設(shè)計師不得不將設(shè)計火力集中開向啟動閃屏頁。優(yōu)秀的視覺構(gòu)成啟動界面，能夠帶給受眾良好的閱讀與使用感受增強(qiáng)，有助于增強(qiáng)APP自身品牌的文化理念植入。在后續(xù)的交互階段，便于在受眾心理上產(chǎn)生深入的品牌意識的建立。所以，視覺構(gòu)成要素在內(nèi)涵與形式、整體與細(xì)節(jié)等方面都足夠影響應(yīng)用程序整體的使用代入感。

參考文獻(xiàn)

[1] 韓林.淺析手機(jī)游戲UI設(shè)計中視覺藝術(shù)元素的構(gòu)成[J].美術(shù)教育研究，2018（16）：72-73.

[2] 宮珺.對比聯(lián)想與特異構(gòu)成在視覺傳達(dá)設(shè)計中的復(fù)合應(yīng)用[J].藝術(shù)與設(shè)計（理論），2018，2（08）：40-42.

[3] 陳宇平.手機(jī)UI設(shè)計中視覺藝術(shù)元素的構(gòu)成研究[J].大眾文藝，2018（15）：89-90.

[4] 李鵬.論手機(jī)UI設(shè)計中視覺藝術(shù)元素的構(gòu)成[J].城市建設(shè)理論研究（電子版），2018（19）：72.

[5] 范力中. 論圖像視覺對觀者心理與情感的影響[D].湖北美術(shù)學(xué)院，2018.

[6] 吳宜桐. 平面視覺語言在手機(jī)UI界面設(shè)計中的交互研究[D].東北電力大學(xué)，2018.

[7] 杜傳成. 智能手機(jī)綜合購物APP界面色彩分析與應(yīng)用研究[D].山東師范大學(xué)，2017.

[8] 徐延章.智能手機(jī)APP交互情境設(shè)計的審美要素分析[J].包裝工程，2016，37（24）：130-135.

[9] 郭紅美. 基于交互行為的智能手機(jī)APP界面視覺設(shè)計研究[D].華北理工大學(xué)，2017.

[10] 羅曉萌. 智能手機(jī)APP圖標(biāo)的設(shè)計研究及實踐[D].山東師范大學(xué)，2015.