中國傳統(tǒng)文化元素在交互界面設(shè)計(jì)中的應(yīng)用研究

朱爽蕾

（天津工藝美術(shù)職業(yè)學(xué)院,天津 300250）

一、交互界面設(shè)計(jì)的發(fā)展

交互界面是一門研究用戶交互體驗(yàn)的新學(xué)科，它產(chǎn)生于20世紀(jì)80年代的美國。雖然它的發(fā)展只有短短幾十年，但已經(jīng)深深地浸入到我們生活的方方面面，不斷改變著生活方式。自從臺式機(jī)的出現(xiàn)，人們就在不斷探索進(jìn)行更有效的人機(jī)交互。

當(dāng)今的信息時代，網(wǎng)絡(luò)信息化的快速發(fā)展，使我們生活中充斥著大量的信息。一方面，我們可以從無限的信息中心獲得所需的資源。另一方面，由于信息泛濫使得人們?yōu)橹_。人們逐漸意識到要想更好地進(jìn)行人機(jī)溝通，不僅僅是憑借界面設(shè)計(jì)的美觀性，更重要的是如何使信息溝通更加快捷、準(zhǔn)確，人們能夠快速準(zhǔn)確地接收、理解并使用信息。因?yàn)槿藱C(jī)交互界面以視覺傳播為主，所以信息可視化應(yīng)用和研究受到廣泛關(guān)注。

我國交互設(shè)計(jì)理論研究起步較晚，相對落后。早期只有知名設(shè)計(jì)公司及IT企業(yè)相繼設(shè)置了交互設(shè)計(jì)的相關(guān)小型機(jī)構(gòu)，其研究成果甚微，無法與國外相關(guān)研究機(jī)構(gòu)相比。近年來，由于我國通信互聯(lián)網(wǎng)行業(yè)的發(fā)展，智能手機(jī)、平板電腦、智能家電等互聯(lián)設(shè)備的廣泛應(yīng)用，使交互設(shè)計(jì)行業(yè)得到了很大的發(fā)展。在廣東、北京、上海相繼成立了創(chuàng)新工場、青蛙設(shè)計(jì)、洛可可等交互設(shè)計(jì)機(jī)構(gòu)，廣東省工業(yè)設(shè)計(jì)協(xié)會于2010年率先成立了交互設(shè)計(jì)委員會。使交互界面設(shè)計(jì)行業(yè)迅速得到發(fā)展。

目前國內(nèi)大部分交互界面設(shè)計(jì)都存在抄襲國外設(shè)計(jì)作品的現(xiàn)象，眾多的交互界面設(shè)計(jì)作品只是千篇一律。能夠體現(xiàn)中國文化，運(yùn)用中國元素設(shè)計(jì)的產(chǎn)品更是少之又少。將祖國傳統(tǒng)文化植根于現(xiàn)代交互界面設(shè)計(jì)中是我們應(yīng)該研究的重要課題。通過對中國傳統(tǒng)文化元素的挖掘和分析，探索在交互界面設(shè)計(jì)領(lǐng)域如何繼承中國傳統(tǒng)文化的途徑，提出新的設(shè)計(jì)方式，提升中國本土交互設(shè)計(jì)地位的設(shè)計(jì)作品才能夠喚起大眾對中國傳統(tǒng)文化的關(guān)注與喜愛。

二、中國文化元素應(yīng)用于交互設(shè)計(jì)中的意義

中國文化具有中華幾千年來的文明積累，博大精深，為我們的設(shè)計(jì)提供了豐富的資源。由于中國的民族多樣性，中華文化也匯集了多民族多地域特征的文化符號。將這些文化符號應(yīng)用于界面交互設(shè)計(jì)中，有助于形成具有中國文化特色的界面形象。

此外，由于交互界面應(yīng)用于互聯(lián)網(wǎng)，可借助網(wǎng)絡(luò)以新媒體的形式被廣泛傳播。再將中國元素與國際流行設(shè)計(jì)趨勢有效結(jié)合，可使受眾易于接受。

三、中國元素在交互界面設(shè)計(jì)中的應(yīng)用原則

（一）中國元素的運(yùn)用要與時代背景相融合

多媒體界面設(shè)計(jì)是將設(shè)計(jì)的美觀性、交互性、趣味性、情節(jié)性于一體的綜合性設(shè)計(jì)過程。其出發(fā)點(diǎn)是以用戶為核心。一味地追求中國元素的傳承，而沒有契合現(xiàn)代人的審美趣味，也難以被受眾所接受。多媒體界面設(shè)計(jì)勢必要將傳統(tǒng)文化元素加以變革，與現(xiàn)代審美相結(jié)合，才能使人喜聞樂見。

（二）運(yùn)用中國元素要有選擇性的創(chuàng)新

交互界面設(shè)計(jì)的創(chuàng)新過程不是簡單的照搬照抄。而是能夠?qū)⒎蠒r代發(fā)展、體現(xiàn)地域民族特征、展示傳統(tǒng)文化的元素，與傳統(tǒng)和現(xiàn)代的設(shè)計(jì)語言相融合。深入研究中國傳統(tǒng)視覺特征與現(xiàn)代的生活方式、使用習(xí)慣、情感特征等，找到它與界面設(shè)計(jì)的契合點(diǎn)并加以拓展、延伸，將交互界面設(shè)計(jì)風(fēng)格賦予中國特色和現(xiàn)代審美相融合。

（三）運(yùn)用中國元素要注重藝術(shù)性的體現(xiàn)

雖然多媒體界面交互設(shè)計(jì)集設(shè)計(jì)藝術(shù)、美學(xué)、社會學(xué)、傳播學(xué)、人機(jī)工程等多門學(xué)科基于一體，但它具有自身的結(jié)構(gòu)體系。受眾在使用交互設(shè)計(jì)產(chǎn)品時的感受和評價(jià)決定了交互設(shè)計(jì)作品是否成功，是否較其他交互設(shè)計(jì)作品更具感染力和吸引力，是否更好地體現(xiàn)界面的交互性，是否具有更好地親和力，使人賞心悅目。

總之，中國傳統(tǒng)元素應(yīng)用于交互界面設(shè)計(jì)中，不是簡單地拿來照搬，而是要在符合人機(jī)交互、操作邏輯、界面美觀的基礎(chǔ)上，對中國傳統(tǒng)圖案元素進(jìn)行分解重構(gòu)，與現(xiàn)代國際流行的扁平化設(shè)計(jì)風(fēng)格相結(jié)合，才能設(shè)計(jì)出具有中國特色的界面交互設(shè)計(jì)作品。

四、如何將中國元素應(yīng)用于交互界面設(shè)計(jì)中

（一）戲曲臉譜元素的開發(fā)

戲曲臉譜是舞臺演出時的化妝造型，是根據(jù)人物的性格、身份特征繪制在演員臉上的繪畫。臉譜根據(jù)不同的行當(dāng)，面部妝容不一。一般“生”“旦”妝容略簡單。而“凈”與“丑”面部繪畫比較復(fù)雜，我們所說的京劇臉譜一般指“凈”的面部繪畫。以戲曲臉譜造型為基本元素，進(jìn)行交互界面設(shè)計(jì)能夠展現(xiàn)我國戲曲獨(dú)特的文化特色。

以戲曲臉譜元素的界面圖標(biāo)設(shè)計(jì)為例。此作品對眾多臉譜紋飾進(jìn)行提煉，視覺流程清晰，尺寸比例規(guī)范，界面設(shè)計(jì)簡潔。戲曲臉譜的圖形和色彩恰當(dāng)融合，加以干凈利落的邊界處理，平涂的方式，融合了現(xiàn)代的扁平化設(shè)計(jì)風(fēng)格。該界面基于蘋果IOS10系統(tǒng)規(guī)范設(shè)計(jì)，界面分為Icon圖標(biāo)設(shè)計(jì)，鎖屏界面設(shè)計(jì)、主屏幕設(shè)計(jì)、Widget頁面設(shè)計(jì)、信息頁面設(shè)計(jì)、聯(lián)系人及聯(lián)系人詳情頁設(shè)計(jì)。其中icon圖標(biāo)設(shè)計(jì)，外輪廓使用了卡片的表現(xiàn)形式，以戲曲紋樣整理提煉后作為基礎(chǔ)圖形，將功能圖標(biāo)（電話、時鐘、天氣、信件等）放置于基礎(chǔ)圖形的頂層，有利于用戶對圖標(biāo)功能性的識別。臉譜圖標(biāo)色彩搭配取材于傳統(tǒng)戲曲臉譜中的紅忠、白奸、黑直、藍(lán)剛、綠翠、黃殘、雜奇等配色，展現(xiàn)不同濃郁的戲曲色彩風(fēng)格。戲曲臉譜的圖案以植物、動物、星辰符號、線條及幾何紋樣等元素構(gòu)成。界面的壁紙以數(shù)字繪畫的方式呈現(xiàn)，別具風(fēng)格。戲曲臉譜元素的交互界面設(shè)計(jì)將戲曲臉譜的圖形元素提煉重構(gòu)，將古老的戲曲臉譜藝術(shù)，加以與多媒體界面的重構(gòu)設(shè)計(jì)，使得將中國傳統(tǒng)臉譜藝術(shù)以新的設(shè)計(jì)方式展現(xiàn)出來，給人耳目一新的視覺體驗(yàn)。

（二）傳統(tǒng)建筑元素的開發(fā)

榫卯是無須任何五金件或膠水，通過各種嵌套結(jié)構(gòu)就可以把木制零件牢牢固定在一起的工藝，是中國古代建筑、家具及其他器械的主要結(jié)構(gòu)方式，是中國傳統(tǒng)建筑與家具工藝中的精髓，體現(xiàn)了中國古代文化的智慧。由于這種工藝面臨失傳，因此這款《榫卯》移動應(yīng)用作品的開發(fā)非常有意義。它可以使用戶通過移動端，用手指輕輕滑動屏幕就可以充分了解榫卯結(jié)構(gòu)。實(shí)現(xiàn)了木工設(shè)計(jì)師關(guān)于榫卯的夢想。體現(xiàn)了一隼一卯，生生世世的傳統(tǒng)魅力。

榫卯這款應(yīng)用的設(shè)計(jì)充分運(yùn)用了現(xiàn)代的技術(shù)手段與古樸的設(shè)計(jì)風(fēng)格相融合，巧工妙思，簡約古樸，精美絕倫。首頁以三維模型的方式展示了27種榫卯結(jié)構(gòu)，背景以淡灰色光暈效果襯托了榫繆結(jié)構(gòu)的精美。用戶通過點(diǎn)擊屏幕來展開每款榫繆結(jié)構(gòu)，還可進(jìn)行旋轉(zhuǎn)、拆解等操作，觀察榫繆的結(jié)構(gòu)組成。直觀有趣、易于理解。通過點(diǎn)擊左上側(cè)菜單導(dǎo)航可進(jìn)入《榫卯》知識部分。界面分別為木、器、漆、史等四個方面介紹了木料、制作榫卯的工具和榫卯的歷史等很多與榫卯相關(guān)的木工知識。界面設(shè)計(jì)以淡灰光暈為背景加以相關(guān)橢圓形圖片，下面配楷書文字，簡約具有濃郁的書卷氣。

“匠木”是泰格憂思在“榫繆”基礎(chǔ)上開發(fā)的國粹游戲，意在延續(xù)榫繆的成果，讓大家更多地去了解榫卯結(jié)構(gòu)這一傳承千年的文化。也是目前市場上為數(shù)不多的國粹游戲,充分展現(xiàn)了古代文化。讓玩家盡情地發(fā)揮自己的腦洞和想象力，在玩游戲的同時還能學(xué)習(xí)，玩法很有創(chuàng)新。更多樂趣在于玩家之間的DIY，于好友之間進(jìn)行出題，切磋。

匠木的界面設(shè)計(jì)及布局較榫繆更為精致，設(shè)計(jì)風(fēng)格展現(xiàn)了濃郁的中國風(fēng)。打開開始界面中國紅背景映入眼簾，隨之從左上角徐徐飄來片片丁香花瓣，伴隨著鳥鳴聲金黃色的木質(zhì)榫繆結(jié)構(gòu)圖形緩緩出現(xiàn)，上面雕刻著游戲主題“匠木”兩字。中國特色濃郁，鳥語花香，清新自然。主界面設(shè)計(jì)以倒映在宮墻上的竹影為背景，畫面中心有一個圓形的窗欞。用手滑動屏幕分別移出畫軸、黃銅鑰匙、雕刻工具、青銅鼎等圖形，同時代表著修行、館藏、切磋、成就等不同主題。以婉轉(zhuǎn)低沉的古箏琴音為背景音樂，優(yōu)美動聽使人思緒寧靜，回味綿長。圖形移出伴隨著動畫和音效，增加了界面的交互性，給玩家良好的操作體驗(yàn)。在悠揚(yáng)的琴聲中點(diǎn)擊畫面進(jìn)入主題，一幅畫軸“唰”的一聲在面前展開，滑動畫軸，不同的榫繆家具樣式呈現(xiàn)出來，需要玩家一步步地通關(guān)進(jìn)行內(nèi)容的解鎖。游戲設(shè)計(jì)也是以3D模型的形式，木材結(jié)構(gòu)可旋轉(zhuǎn)。通過對材料的切割和對接，完成不同階段的任務(wù)。這款游戲獲得了不少的獎項(xiàng)，受到了玩家的廣泛好評。

（三）民間藝術(shù)元素的開發(fā)

中國民間藝術(shù)的發(fā)展主要是由社會底層的普通勞動者創(chuàng)造出來的，是通過實(shí)際生活日積月累的民俗文化現(xiàn)象。以民俗文化和社會習(xí)俗的視覺形象為載體，內(nèi)容主要表現(xiàn)人民日常生活、節(jié)日風(fēng)俗、民間宗教信仰及巫術(shù)等內(nèi)容。民間藝術(shù)內(nèi)容豐富，風(fēng)格多樣，其中的故事情和表現(xiàn)方式也堪稱經(jīng)典。楊柳青年畫作為中國北方民間藝術(shù)的代表，具有獨(dú)特而鮮明的地域特征和文化特征。楊柳青年畫的主要內(nèi)容包括民間風(fēng)俗、歷史故事、戲曲人物、娃娃、仕女、花卉、山水等。

交互界面設(shè)計(jì)作品《年畫那些事兒》是本文作者于2016年創(chuàng)作的交互界面設(shè)計(jì)作品。主要介紹了楊柳青年畫的歷史起源、制作工藝、歷史沿革等內(nèi)容。對于擁有悠久歷史的楊柳青年畫藝術(shù)，短短十幾頁的篇幅是不能夠全方位展示的。只能在有限的空間內(nèi)對楊柳青年畫做一個簡單介紹，對流傳最廣泛最典型的畫作進(jìn)行展現(xiàn)。

五、結(jié)語

中國傳統(tǒng)文化元素承載著中華民族的精神內(nèi)涵。將中國五千年的歷史文化元素運(yùn)用到多媒體界面設(shè)計(jì)中，要很好地把握中國傳統(tǒng)文化的精神與內(nèi)涵，同時與國際流行設(shè)計(jì)方式思路很好的融合。創(chuàng)造出具有中國特色的多媒體界面設(shè)計(jì)風(fēng)格是我們中國設(shè)計(jì)師的歷史使命和任務(wù)。我們要將中華精神與多媒體界面設(shè)計(jì)更好地融合，創(chuàng)作出具有中國特色的多媒體界面設(shè)計(jì)作品，讓中國風(fēng)在世界流行起來！