王碧琳

摘要：移動(dòng)互聯(lián)網(wǎng)高速發(fā)展，移動(dòng)端界面設(shè)計(jì)有著不同的風(fēng)格，本文主要研究常見的幾種插畫風(fēng)格的運(yùn)用。從幾種插畫風(fēng)格的分類出發(fā)，向在界面設(shè)計(jì)中運(yùn)用的特點(diǎn)進(jìn)行分析，總結(jié)了插畫風(fēng)格在移動(dòng)端界面設(shè)計(jì)中的獨(dú)特性和重要性。插畫風(fēng)格界面設(shè)計(jì)是傳統(tǒng)繪畫藝術(shù)和現(xiàn)代科技的完美結(jié)合，提升7用戶使用的愉悅性，加深了用戶對(duì)品牌形象的理解。

關(guān)鍵字：插畫界面設(shè)計(jì)移動(dòng)互聯(lián)網(wǎng)

互聯(lián)網(wǎng)行業(yè)發(fā)展迅速，根據(jù)《移動(dòng)互聯(lián)網(wǎng)藍(lán)皮書：中國移動(dòng)互聯(lián)網(wǎng)發(fā)展報(bào)告（2018）》，“移動(dòng)互聯(lián)網(wǎng)用戶總量增長放緩，用戶結(jié)構(gòu)優(yōu)化，數(shù)據(jù)流量倍增，2017年中國移動(dòng)互聯(lián)網(wǎng)接人流量達(dá)到246億GB，全年月戶均移動(dòng)互聯(lián)網(wǎng)接人流量達(dá)到1775兆（MB），是2016年的2.3倍”，我們可以了解到，我國移動(dòng)互聯(lián)網(wǎng)用戶使用率居高不下。

在移動(dòng)互聯(lián)網(wǎng)的發(fā)展中，移動(dòng)界面設(shè)計(jì)，也就是移動(dòng)端UI設(shè)計(jì)的優(yōu)良與否，對(duì)行業(yè)的發(fā)展也起著非常重要的作用。優(yōu)秀的界面設(shè)計(jì)能夠拉近用戶與應(yīng)用軟件的距離，能夠增加對(duì)用戶的吸引力。

一、移動(dòng)端界面設(shè)計(jì)中常見的幾種插畫風(fēng)格

用戶的審美能力逐漸提高的今天，各式各樣優(yōu)秀的界面設(shè)計(jì)風(fēng)格也在市場(chǎng)上流行開來。作為視覺設(shè)計(jì)的一種常見的表現(xiàn)形式，插畫在移動(dòng)界面設(shè)計(jì)中的運(yùn)用也越來越普及，出現(xiàn)了很多插畫風(fēng)格的移動(dòng)界面設(shè)計(jì)，比較常見的插畫風(fēng)格有扁平插畫風(fēng)格、手繪插畫風(fēng)格、MBE插畫風(fēng)格、半立體插畫風(fēng)格。

1.扁平插畫風(fēng)格

背后是計(jì)算機(jī)技術(shù)與交互設(shè)計(jì)互相交織的大數(shù)據(jù)時(shí)代，扁平化風(fēng)格依靠著現(xiàn)代人刪繁就簡的生活理念，已經(jīng)滲透到了移動(dòng)端界面設(shè)計(jì)的方方面面。從微軟的Windows phone到谷歌的Android 7，再到現(xiàn)在蘋果的IOS 12，扁平化風(fēng)格設(shè)計(jì)勢(shì)不可擋，風(fēng)靡界面設(shè)計(jì)行業(yè)。由此基礎(chǔ)上發(fā)展而來的扁平插畫風(fēng)格，特點(diǎn)鮮明，普及率高，主要特點(diǎn)有簡潔明了，去掉繁文縟節(jié)，對(duì)事物最大程度的概括和沉淀。扁平化風(fēng)格再結(jié)合插畫的生動(dòng)活動(dòng)，使界面又不失趣味性。

用戶在接觸此類風(fēng)格界面的時(shí)候可以更快地理解到信息的核心，節(jié)約時(shí)間和成本，對(duì)于APP的推廣和提高受眾接受度也十分有利。

2.手繪插畫風(fēng)格

在扁平風(fēng)大行其道的時(shí)代，還有一部分界面設(shè)計(jì)是采用傳統(tǒng)手繪風(fēng)格的。手繪插畫具有豐富性、生動(dòng)性等特點(diǎn)，表現(xiàn)力強(qiáng)，展現(xiàn)范圍廣，對(duì)設(shè)計(jì)師的美術(shù)功底要求較高。以前的手繪插畫是采用傳統(tǒng)的繪畫工具來體現(xiàn)的，一般是借助筆墨紙硯、顏料來創(chuàng)作。在傳統(tǒng)手繪插畫的基礎(chǔ)上，可以借助新興的數(shù)碼科技，在移動(dòng)端界面上應(yīng)用數(shù)碼手繪插畫，同樣可以體現(xiàn)繪畫中的肌理、筆觸、質(zhì)感等等。手繪插畫風(fēng)格的界面設(shè)計(jì)藝術(shù)效果更具有親和力和情感化。

3.MBE插畫風(fēng)格

MBE風(fēng)格是2015年法國設(shè)計(jì)師MBE在driloble網(wǎng)站上創(chuàng)作的一種Q版卡通風(fēng)格。這種風(fēng)格在移動(dòng)端界面設(shè)計(jì)界運(yùn)用較為廣泛，因其簡潔的造型、明確的邊緣、鮮明的色彩、圓潤的輪廓、可愛活潑的視覺感受而造成了突出的視覺效果。MBE風(fēng)格在填色方式方面獨(dú)具特色，內(nèi)部的色塊要向平行方向偏離一點(diǎn)，距離輪廓線條有一點(diǎn)距離，這個(gè)距離最寬的地方數(shù)值往往不低于輪廓的寬度數(shù)值，以此可以體現(xiàn)高光和陰影，塑造光感。描邊線條往往采用斷點(diǎn)式和無斷點(diǎn)式交互出現(xiàn)，不死板，有呼吸感。

4.半立體插畫風(fēng)格

半立體插畫風(fēng)格是在扁平化風(fēng)格的基礎(chǔ)上，保持簡潔概括的處理手法，加入一些元素使物體具有一定的立體感，其中包括了漸變插畫風(fēng)格、2.5D插畫風(fēng)格、肌理插畫風(fēng)格。

漸變插畫也叫微光插畫，在顏色是使用上一般采取鄰近色或者是近似色，種類不多，風(fēng)格唯美高雅，不會(huì)大面積使用高純度色彩，一定會(huì)搭配同色系的不同純度色彩來調(diào)和畫面感覺。畫面明度落差雖大，但具有漸變的特點(diǎn)，過渡柔和，不突兀。

2. 5D插畫是可以在二維的空間里展現(xiàn)三維的視覺效果，利用色塊、線條、透視來達(dá)到目的。這種風(fēng)格現(xiàn)代感強(qiáng)烈，視覺沖擊力強(qiáng)烈，可以展現(xiàn)立體感、科技感、未來感。

肌理插畫是在扁平插畫的基礎(chǔ)上增加顆粒感，展現(xiàn)物體的質(zhì)感和光影關(guān)系。

在筆者看來，扁平化風(fēng)格依然是地位堅(jiān)固，在快節(jié)奏的生活中，人們對(duì)信息的復(fù)雜和繁瑣依然存在或多或少的抵觸心理，所以高度概括、簡潔明了的界面設(shè)計(jì)依然深得人心。所以在此之上，半立體插畫風(fēng)格既能是滿足人們快遞掌握信息的需要，也可以提供一定程度的趣味性和生動(dòng)性，將兩者結(jié)合共同展示優(yōu)勢(shì)，只是孰多孰少的問題。

二、插畫風(fēng)格在移動(dòng)端界面設(shè)計(jì)中的特點(diǎn)

1.界面視覺沖擊力強(qiáng)烈

在界面設(shè)計(jì)中使用插畫風(fēng)格，特別是在移動(dòng)端這種高速瀏覽的平臺(tái)中使用，對(duì)于吸引用戶注意力具有相當(dāng)強(qiáng)的優(yōu)勢(shì)。插畫使用傳統(tǒng)繪畫的創(chuàng)作技法，本身就已具備繪畫的視覺沖擊力強(qiáng)的特點(diǎn)，再加上數(shù)碼科技的處理，與交互設(shè)計(jì)的融會(huì)貫通，在第一時(shí)間吸引用戶的注意力。在插畫風(fēng)格的移動(dòng)端界面設(shè)計(jì)中，往往使用鮮明的色彩、強(qiáng)烈的對(duì)比或是明確的輪廓線條、色塊的切割來體現(xiàn)視覺沖擊力，增加畫面的觀賞性。

插畫風(fēng)格多種多樣，在表現(xiàn)事物或情感上可以采用多種藝術(shù)處理手法。在圖形方面，可以對(duì)圖形進(jìn)行創(chuàng)意表達(dá)的處理，靈活運(yùn)用構(gòu)成要素，以及運(yùn)用多種圖形的構(gòu)成形式等。在色彩方面，靈活運(yùn)用對(duì)三大要素的認(rèn)知和掌握，對(duì)色彩感覺的綜合表達(dá)等。在移動(dòng)端界面設(shè)計(jì)中，插畫風(fēng)格可以充分發(fā)揮自身的特質(zhì)，更好地展現(xiàn)平臺(tái)特色，為用戶服務(wù)。

2.富有藝術(shù)氣息與趣味性

信息化社會(huì)的逐步建立和計(jì)算機(jī)技術(shù)的快速發(fā)展，使得人們?cè)絹碓浇邮芸萍蓟a(chǎn)品充斥在生活的方方面面，由此帶來了人們的需求轉(zhuǎn)變。在人們習(xí)慣了科技感十足的事物時(shí)，審美意向也在變化，不是說傳統(tǒng)的、古老的審美已經(jīng)過時(shí)，而是如何與現(xiàn)代審美相結(jié)合，讓人們更樂于接受。此時(shí)，插畫風(fēng)格的界面設(shè)計(jì)，在體現(xiàn)科技感、時(shí)尚感的同時(shí)，也可以給用戶帶來一定的藝術(shù)感受。需要展現(xiàn)人性化的、溫暖的、有趣味性的界面設(shè)計(jì)往往可以采用手繪插畫、半立體插畫等風(fēng)格，將科技美感與藝術(shù)美感有機(jī)地結(jié)合起來。

3.信息傳遞的豐富性與高效便捷

傳統(tǒng)的插畫創(chuàng)作較為復(fù)雜，需要多種工具、材料、工藝的支持。從數(shù)字技術(shù)介入開始，插畫創(chuàng)作發(fā)生了巨大轉(zhuǎn)變，需要通過計(jì)算機(jī)軟件來完成。常見的圖形處理軟件有Photoshop、Illustrator、Painter、Sai等，對(duì)圖形的強(qiáng)大處理能力.大大節(jié)約了插畫創(chuàng)作的時(shí)間成本效果方面雖不及手工繪制的特殊藝術(shù)效果，但也具有生動(dòng)寫實(shí)、精致整潔的畫面效果。在界面設(shè)計(jì)中，插畫生動(dòng)地表達(dá)了枯燥繁瑣的信息，優(yōu)化了信息傳遞的方式，科技與藝術(shù)的結(jié)合提升了信息傳遞的效率。同時(shí)，與別的媒體相結(jié)合，可以更全面地展現(xiàn)信息，例如加入音樂、動(dòng)態(tài)圖像等媒體，效果更好。

4.體現(xiàn)情感化與人性化

現(xiàn)代設(shè)計(jì)理念中非常提倡人性化設(shè)計(jì)、情感化設(shè)計(jì)，無外乎將現(xiàn)代設(shè)計(jì)與人們所熟悉的感性認(rèn)知相結(jié)合。那么在界面設(shè)計(jì)中，插畫風(fēng)格可以滿足這樣的需要。通過插畫傳遞出的美好的視覺語言，可以引起人們對(duì)經(jīng)歷過的美好事物的聯(lián)想，從而引起情感上的共鳴。在插畫風(fēng)格的移動(dòng)端界面設(shè)計(jì)中，往往采用具有親和力、身份認(rèn)同感的事物，處理手法也較為柔和，注重用戶體驗(yàn)感受。多種多樣的插畫風(fēng)格能夠給予人們不同的心理感受，可以是清新活力的，也可以是羅曼蒂克的;可以是朝花夕拾的，也可以是未來科技的……不同的風(fēng)格針對(duì)不同的用戶群體，滿足個(gè)性化的需求。

三、結(jié)語

在信息化時(shí)代，為了更好地將傳統(tǒng)繪畫藝術(shù)與現(xiàn)代科技結(jié)合，為了讓用戶感受到多種多樣的界面設(shè)計(jì)風(fēng)格從而提升使用愉悅感，為了更好地實(shí)現(xiàn)手機(jī)軟件與用戶之間的精神溝通，本文進(jìn)行了簡要的幾種插畫風(fēng)格在移動(dòng)端界面設(shè)計(jì)中的運(yùn)用研究。不同插畫風(fēng)格的不同魅力，使軟件用戶在使用過程中能夠獲得更為愉悅的感受，從而加深了品牌形象在用戶腦海中的印象，在移動(dòng)端界面設(shè)計(jì)中占有十分重要的地位。