手機APP啟動界面的視覺構成分析

吳倩

?摘 要：UI設計是多媒體環境之下誕生的新興專業，主要研究的是人機交互整個實現過程中界面的美觀與合理化處理;交互行為往來的框架結構便捷化;以及用戶體驗設計。其中，關于藝術美學設計的涵蓋方向主要表現于用戶界面處理階段。也就是UI中的GUI分支。它好比人類的外觀穿著，類似于“人靠衣裳，馬靠鞍”的俗語。GUI視覺設計主要解決的是用戶使用APP過程中，對于界面美化以及信息提取的合理性和便捷性。體現在對于圖標或按鈕控件的設計，和整套應用程序的視覺標準顏色的設置，以及配套的插圖元素和廣告內容的限定。總之對于界面視覺方面的標準與要求工作都屬于界面視覺設計的范疇。

關鍵詞：APP界面 界面設計 視覺設計

手機應用程序對于當今社會背景下的主流人群而言是每天必不可少、反復進行的人機交互過程實現的最主要載體途徑。所以APP的視覺設計美觀化是十分必要的。

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

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

一、啟動圖標的視覺形成

關于UI界面中的圖標大致方向上可以劃分為擬物化階段到扁平化階段的發展。這兩個方面的圖標具有明顯的視覺化風格差異，各有優劣。基本上可以歸納為擬物化圖標便于引入受眾的心理情感表達，因為它主要針對的是圖標自身質感的還原，所以情境化特征明顯。但是“比葫蘆畫瓢”的嫌疑過重。相對來說對于設計的過程可能性比較小;相反，扁平化圖標雖然外觀簡潔，多見于線型和正負形面狀圖標的展現。但是，設計創作方法可能性很廣。但它也有自身的不足。由于扁平化圖標形式感過強，對于原始對象的比擬程度較弱，所以說難免給消費者帶來一種過于理性和冰冷的使用感受。

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

二、標準色和圖片的視覺形成

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

三、廣告語的視覺形成

作為視覺要素中能夠將信息表達準確的文字要素，在界面中一般會以廣告語的形式存在。字數不會過多，但是精到且準確。文字字體一般采用個性化設計處理，不建議使用字體庫中常用的字體。目的是為了展現出APP本身與同類產品的差異化特征。關于文字含義方面，要求能夠吻合應用程序本身的訴求點以及達到受眾需求的情感心理。在視覺方面分析的話，如果說大圖虛化背景作為塊面形式存在，啟動圖標或倒計時提示按鈕作為點狀結構存在，那么此刻我們所說的廣告語，則作為整個畫面的線性協調要素存在，能夠很好地綜合過大的塊面與過小的點狀結構之間的強烈碰撞，綜合整個界面的秩序感與統一化。

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

參考文獻

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

[2] 宮珺.對比聯想與特異構成在視覺傳達設計中的復合應用[J].藝術與設計（理論），2018，2（08）：40-42.

[3] 陳宇平.手機UI設計中視覺藝術元素的構成研究[J].大眾文藝，2018（15）：89-90.

[4] 李鵬.論手機UI設計中視覺藝術元素的構成[J].城市建設理論研究（電子版），2018（19）：72.

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

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

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

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

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

[10] 羅曉萌. 智能手機APP圖標的設計研究及實踐[D].山東師范大學，2015.