版畫設(shè)計語言在App插畫中的應(yīng)用

程諶

（武漢理工大學(xué)，武漢 430070）

一、版畫與插圖發(fā)展簡述

插畫是一門歷史十分悠久的藝術(shù)，目前發(fā)現(xiàn)人類最早的插畫是在公元前兩萬年的法國南部地區(qū)的“拉四格的洞窯畫”。經(jīng)過一段時期的發(fā)展，插畫被廣泛應(yīng)用于印刷書籍中。目前已知最早的插畫書是古埃及的《亡靈書》，這本書一共有190篇章全長9米，使用的紙張是莎草紙，里面記載著符咒、祈禱文、和贊美詩。到了14世紀，各式各樣的圖書館紛紛出現(xiàn)，以復(fù)制世俗文本的小作坊建立起來，插圖開始成為獨立的手工藝術(shù)活動。這些手抄本的裝飾圖案和插圖大量出現(xiàn)在宗教、植物學(xué)、醫(yī)學(xué)以及百科全書中，并且插畫的風(fēng)格都是以細密畫為主。

15世紀隨著歐洲中世紀藝術(shù)、文化以及冶金的發(fā)展，中國木板印刷的流入，插圖的復(fù)制技術(shù)得到了改進。這些木板印刷首先被應(yīng)用到了織物裝飾品上，接著大量的運用在宗教畫像上，在這個時期中插圖最多最豐富的書是由哈特曼·舍德爾（Hartmann Schedel）在紐倫堡出版的《紐倫堡編年史》（圖1）。這是一部含有豐富插畫的世界歷史書籍。原稿全書共包含有645副插畫。到了15世紀后半葉開始出現(xiàn)多色印刷法，并開始出現(xiàn)銅板凹版，刻板方式分為干刻法和腐蝕法，直到17世紀版畫的藝術(shù)表現(xiàn)形式得到了極大的發(fā)展，誕生了美柔汀版畫、飛塵腐蝕版畫等成熟刻板技法，版畫讓插圖顯得更加生動逼人，使圖像傳播的信息得到了質(zhì)的飛躍。

20世紀后，印刷技術(shù)的提高使得版畫往多領(lǐng)域發(fā)展，并出現(xiàn)了絲網(wǎng)印刷、綜合版畫和數(shù)字版畫，版畫的商業(yè)性越來越小。社會發(fā)展到今天，插畫被廣泛地用于社會的各個領(lǐng)域。隨著藝術(shù)的日益商品化和新的繪畫材料及工具的出現(xiàn)，插畫藝術(shù)進入商業(yè)化時代。現(xiàn)代插畫的概念已遠遠超出了傳統(tǒng)規(guī)定的范疇，插畫不再局限于某一風(fēng)格，它打破了以往單一使用一種材料的方式，通過廣泛地運用各種現(xiàn)代技術(shù)手段，使插畫藝術(shù)的發(fā)展獲得了更為廣闊的空間和無限的可能。現(xiàn)在，隨著智能手機的普及，使用人群的擴大，插畫開始大量進入手機圖形用戶界面設(shè)計中。

二、App插畫的發(fā)展

> 圖1 哈特曼·舍德爾的《紐倫堡編年史》

> 圖2 Window phone7 的扁平化風(fēng)格

> 圖3 電商傳統(tǒng)節(jié)日Banner

近年來，App插畫普遍呈現(xiàn)扁平化趨勢。手機界面上的扁平化，最早出現(xiàn)在微軟發(fā)布的windows phone7的移動界面設(shè)計上。早期微軟公司將這種設(shè)計風(fēng)格命名為metro design，其后更名為modern ui（圖2），在風(fēng)格上體現(xiàn)為直觀簡單的形狀，粗并且干凈的字體，明亮對比的顏色，長投影以及減少復(fù)雜細節(jié)和紋理特征。從歷史的淵源來看，這種風(fēng)格來源于19世紀四五十年代瑞士的國際主義風(fēng)格，當(dāng)時主要影響層面是海報，將字體與圖像結(jié)合起來被視為視覺傳達交流的最有效的方式。

隨著2013年蘋果ios7的發(fā)布，扁平化得到了進一步發(fā)展，這也是蘋果公司在設(shè)計風(fēng)格上的重大轉(zhuǎn)變，完全拋棄了了ios之前版本的擬物化特征。與微軟的完全扁平風(fēng)格相比，增加了一定的陰影和分界線，并且大量使用了半透明效果和“毛玻璃”效果來體現(xiàn)層級，同時用sensor制作出視差效果和大量華麗動畫特效。因為涉及到很多產(chǎn)品，這種分割迅速在設(shè)計圈內(nèi)流行開來，并逐漸出現(xiàn)在一些App軟件配圖和輪播頁上。

2017年6月5日，蘋果在wwdc上發(fā)布了ios11，9月20日該系統(tǒng)在北京正式推送。與前期相比，系統(tǒng)改變最大的是蘋果應(yīng)用商店。在蘋果應(yīng)用商店中增加了今日視圖，并大量增加插圖使用面積，軟件的展示插圖占了手機屏幕幾乎三分之二，并且將每種軟件和游戲的風(fēng)格進行了細致的歸類。同時在視覺風(fēng)格上采用卡片加陰影的設(shè)計形式。隨著蘋果以插畫為主導(dǎo)的設(shè)計思路的引領(lǐng)，大量的插畫應(yīng)用在圖標、文章配圖、banner圖上，以實景圖作為插圖的風(fēng)格的軟件越來越少。

三、App插畫風(fēng)格現(xiàn)狀

目前交互和視覺設(shè)計師們將軟件視覺效果的設(shè)計重點放在了App的插畫設(shè)計上。在這種背景下，更多的插畫風(fēng)格應(yīng)運而生。近幾年App插畫的主流風(fēng)格大致分為扁平插畫、肌理插畫、手繪插畫、漸變插畫、立體插畫、描邊插畫、MBE插畫。扁平插畫是消除掉立體感將能明顯表現(xiàn)體積的顏色過渡、紋理、陰影等元素。肌理插畫則是在扁平化圖像上增加紋理豐富的插畫質(zhì)感。手繪插畫則是普通的繪畫流程。漸變插畫是在色塊中采用同一色漸變，整體畫面給人一種唯美的感受。立體插畫是在二維的空間表現(xiàn)出三維的空間，將被繪制的物體以二分之一側(cè)面和半俯視呈現(xiàn)，并消除掉空間透視。描邊插畫則是在運用色塊的基礎(chǔ)上添加描邊，將事物進行抽象化處理。MBE插畫則是在描邊插畫的基礎(chǔ)上給描邊輪廓有規(guī)律的作斷線處理。從這些延伸而來的插畫風(fēng)格來看，都是在扁平插畫的基礎(chǔ)上添加一種特殊效果，以此來豐富畫面的成效效果。相比較而言，版畫與App插畫在形式上相似，尤其是日本浮世繪套色版畫。以葛飾北齋的《富岳三十六景》為例，整體畫面以線為主，通過線條的穿插表現(xiàn)前后關(guān)系，并且走線柔美流暢，以密集的點或者線來制造灰面，增添細節(jié)。顏色上以平鋪為主，通常以一種顏色為主色，其他幾種顏色為輔助色，這種表現(xiàn)方式通過改良轉(zhuǎn)變成現(xiàn)在我們所看的的App插畫風(fēng)格。兩者都拋棄了諸如陰影、漸變之類的效果，純粹用平鋪的色塊和線條去表現(xiàn)物體。同時，版畫與App插畫在功能屬性上類似。在批量印刷之前，插圖還是以手工版畫印刷為主，版畫所印刷出來的插圖與現(xiàn)代App插畫雖然承載物不同，但在功能上都是以闡釋或補充文字為主，并通過圖像來增加對讀者的感觀刺激。另外，版畫與App插畫都具有相同的人群載體和市場指向。兩者針對的人群都是普通大眾，版畫早期主要運用在廣泛傳播的宗教書籍或科學(xué)圖鑒上，例如《圣經(jīng)》和《世界圖書百科全書》。而現(xiàn)代社會人人都用手機APP插畫，面向的也都是普通大眾。批量印刷以前的版畫與App插畫都具有商業(yè)性，目的都是為了更好地傳播與推廣。

四、版畫設(shè)計語言在App插畫中的體現(xiàn)

版畫設(shè)計語言能很好的運用在商業(yè)banner圖上，尤其是與傳統(tǒng)節(jié)日相關(guān)。首先版畫相對于實景圖更具有趣味性和藝術(shù)性，能夠增加其視覺沖擊度。主流App軟件在各種傳統(tǒng)節(jié)日中會替換與節(jié)日氣息相近的banner圖。（圖3）

版畫設(shè)計語言也能運用在App的啟動頁上。本身啟動頁就是為掩飾一些啟動時需要花很多時間進行初始化的應(yīng)用，避免展示一個空的頁面給用戶。后來開發(fā)者意識到這一小塊空白時間可以被利用得更加充分，比如像微信一樣加入一些品牌展示的插圖，或者是加入節(jié)假日營銷插圖給用戶親近感。現(xiàn)在啟動頁已成為表達品牌調(diào)性、產(chǎn)品定位的一塊重要區(qū)域。各種產(chǎn)品經(jīng)理都想盡量將啟動頁這塊做得更具有趣味性。產(chǎn)品的理念通過插畫的方式濃縮在三到四張啟動頁中。在站酷這款A(yù)pp產(chǎn)品中，啟動頁使用了黑白版畫的形式表現(xiàn)了站酷App（圖4）以“設(shè)計”“原創(chuàng)”“交流”為中心的產(chǎn)品定位，并在畫面中添加類似搖點刀的散點作為肌理，顏色上采用最為簡單的黃黑雙色。

版畫的設(shè)計語言很適合運用在一些面向兒童的App（圖5）中。在兒童教育App“Lake涂色書”中，精選全球知名藝術(shù)家的高質(zhì)量插畫線稿，lake涂色書中的插畫大多數(shù)都是平涂式插畫。通過用戶的再上色完成屬于自己的插畫作品。涂色過程猶如版畫中的套色，選中調(diào)色盤的顏色點擊被線稿分割的空白色塊完成上色。用戶僅通過選色點擊就能完成接近于原作的效果，特別能緩解焦慮并給用戶更多成就感。

> 圖4 站酷App啟動頁面

> 圖5 Lake涂色書中的平面插畫

> 圖6 WWDC獲獎的5款游戲應(yīng)用

版畫設(shè)計語言在游戲設(shè)計中也表現(xiàn)良好。蘋果的年度設(shè)計大獎已延長21年，越來越多地突出高質(zhì)量的原創(chuàng)應(yīng)用，并將界面的美感與用戶體驗相結(jié)合。設(shè)計師經(jīng)常會在設(shè)計獎項列表中了解Apple所重視的應(yīng)用程序設(shè)計風(fēng)格。其中，獲獎的有5個高品質(zhì)的游戲，在圖形、音樂和情節(jié)上都比較出彩（圖6）：

《佛羅倫薩》一款互動故事書手機游戲，于2018年情人節(jié)推出，由紀念碑谷的首席設(shè)計師推出。講述一個女孩的第一個愛情故事和令人心碎的低谷的高潮。雖然游戲故事和內(nèi)容都比較簡單，但在藝術(shù)風(fēng)格上贏得了很多玩家的喜愛。

《INSIDE》是丹麥 Playdead工作室繼《Limbo》后的又一力作。可以說，INSIDE有資格在畫面、聲音、情節(jié)、內(nèi)涵和精神方面代表獨立游戲的最高成就。自推出以來，已經(jīng)斬獲無數(shù)獎項，包括E32016獎最佳獨立游戲、TGA2016最佳藝術(shù)指導(dǎo)、最佳獨立游戲獎、GDC最佳視覺效果、最佳音效獎等等。

《阿爾托的奧德賽》，游戲中充滿了藝術(shù)的氣息。相對于前作增加了各種游戲玩法，同時保留了內(nèi)核的橫向版本。你的角色是一個滑雪者，翱翔在微風(fēng)輕拂的沙丘之上，穿過令人興奮的峽谷，探索神秘的寺廟和城市，遠離家鄉(xiāng)。

《FROST》引導(dǎo)粉碎的顆粒找到生命的和諧，這是令人賞心悅目的，通過一些簡單的旋律和粒子融合的游戲，美麗的色彩讓你無需了解就能沉浸其中。

《奧德瑪》是一款出色的平臺冒險游戲。全手繪水平滾動場景使其看起來不想像一個游戲，更像是電影或動態(tài)漫畫。

從獲獎名單中的這五款游戲的藝術(shù)風(fēng)格上來看，不難發(fā)現(xiàn)其中摻有版畫藝術(shù)的影子，手機游戲不再是以真實的畫面為切入點，而是退回到二維，著重豐富藝術(shù)效果，抽象化物體，強調(diào)色彩與光影效果。

可以預(yù)見，App中的插畫配圖形式，今后還會延續(xù)插畫的潮流。各種風(fēng)格的插畫可以完美搭配各種App的使用場景以及用戶群體的特點，使得App呈現(xiàn)出不同個性化的使用體驗，它可以更符合當(dāng)前追求個性化定制體驗的年輕用戶社區(qū)的需求。版畫設(shè)計語言在遵守界面設(shè)計的功能性和有效性的的基礎(chǔ)上，App應(yīng)用可以在很大程度上豐富現(xiàn)有的App插畫形式。■

圖片來源：

圖1：https://www.bostonathenaeum.org/about/publications/selectionsacquired-tastes/liber-chronicarum-nuremberg-1493

圖2：http://www.zcool.com.cn/article/ZNTI5NjIw.html?switchPage=on

圖3：http://www.zcool.com.cn/work/ZMTk4NzY1NjQ=.html

圖4：https://www.zcool.com.cn/work/ZMTMwOTc1ODA=.html