張澤宇

摘要：在移動互聯(lián)網(wǎng)飛速發(fā)展的今天，越來越多的設(shè)計師們開始通過H5（HTML5）交互設(shè)計技術(shù)進(jìn)行符合其宣傳需求的高效的設(shè)計，而廣西民族音樂博物館作為全區(qū)首個專題性音樂博物館，承載著弘揚廣西民族音樂文化等任務(wù)。通過利用H5（HTML5）交互設(shè)計應(yīng)用不僅可以借助PC和移動平臺強大的可塑性與傳播力，還可以結(jié)合民族元素插畫創(chuàng)意的動態(tài)互動表現(xiàn)方式，通過交互方式拉近大眾和廣西民族音樂博物館之間的距離，以達(dá)到多維度詮釋廣西民族音樂博物館的豐富民族理念與內(nèi)涵，使大眾融入其中達(dá)到身臨其境的感官體驗和互動，從而得到大眾對廣西民族音樂博物館核心價值的認(rèn)同。

關(guān)鍵詞：插畫;HTML5;設(shè)計;交互設(shè)計;民族元素;廣西民族音樂博物館

一、廣西民族音樂博物館H5（HTML5）設(shè)計的背景

隨著移動互聯(lián)網(wǎng)時代到來，用戶從PC向移動端的遷移，人和手機越來越形影不離，移動互聯(lián)網(wǎng)逐漸取代傳統(tǒng)的報紙和雜志，成為人們獲取信息的主要來源。而H5（HTML5）交互設(shè)計作為一種新型交互傳播載體，可以使大眾融入其中達(dá)到身臨其境的用戶感官體驗。二者相互結(jié)合，以達(dá)到多維度詮釋廣西民族音樂博物館的豐富民族理念與內(nèi)涵，通過作品展示廣西民族音樂的多樣性、獨特性、與包容性。使大眾融入其中得到身臨其境的用戶感官體驗，從而讓大眾認(rèn)同廣西民族音樂博物館的核心價值，思考和探索插畫的動態(tài)體現(xiàn)。同時樹立廣西民族音樂博物館的特色品牌，有助于民族文化得到傳承，并對提升民族文化自信具有一定的積極作用。

插畫藝術(shù)在如今受到時代的諸多因素的影響， 如因設(shè)計師主觀因素賦予其獨特的審美意識和角度，在近幾年由于科技發(fā)展插畫藝術(shù)也由此呈現(xiàn)出多元化的風(fēng)格面貌。在如今一味追捧模仿日韓風(fēng)格的現(xiàn)代設(shè)計潮流中，如何在借鑒外國先進(jìn)文化的同時繼承和發(fā)揚廣西少數(shù)傳統(tǒng)民族文化，大膽嘗試加入民族內(nèi)涵及其元素，找到屬于中國的民族插畫美學(xué)風(fēng)格并體現(xiàn)出來值得深入研究。

近年來如故宮博物院一樣運用插畫與移動交互平臺結(jié)合進(jìn)行推廣宣傳的只有極少數(shù)地方，而在國外大多藝術(shù)館，如日本的21-21 DESIGN SIGHT、東京國立美術(shù)館等等外國場館都早已通過其結(jié)合推廣，效果顯著。

所以現(xiàn)在各大高校相繼適應(yīng)社會潮流，近兩年都開設(shè)插畫專業(yè)。與插畫技法、插畫創(chuàng)意、插畫表現(xiàn)相關(guān)的研究和論述井噴式的增長，優(yōu)秀的插畫作品更是數(shù)不勝數(shù)。由于在學(xué)習(xí)插畫設(shè)計過程中側(cè)重于傳統(tǒng)平面插畫表現(xiàn)技法，如果再結(jié)合H5（HTML5）設(shè)計交互應(yīng)用，利用其多維化的推廣方式與移動交互平臺，以滿足對品牌多維形象的宣傳需要。

二、廣西民族音樂博物館H5（HTML5）設(shè)計的可行性

廣西民族音樂博物館在此之前與其相關(guān)的介紹設(shè)計、品牌推廣較少，宣傳力度較小?；谄渎涞赜跉v史悠久的八桂大地上，具有鮮明獨特的民族特色個性，并有著民族音樂作為背景，利用民族視覺元素體現(xiàn)民族音樂特色，并把廣西少數(shù)民族精神融入其中，同時結(jié)合當(dāng)代核心價值觀探索變革與發(fā)展，取其精華，去其糟粕，并尋求插畫創(chuàng)意與交互設(shè)計的各種可行性，從而得以讓中國少數(shù)民族音樂博物館融入現(xiàn)代插畫創(chuàng)意設(shè)計語言，以新的H5（HTML5）交互推廣方式為載體， 較之于其他推廣方式更加具有傳播力與感官體驗，也更能夠通過以插畫創(chuàng)意的方式加深大眾對廣西民族音樂博物館的品牌認(rèn)知，在潛移默化中了解廣西少數(shù)民族音樂，體會當(dāng)今廣西少數(shù)民族精神。因此在H5（HTML5）交互設(shè)計的插畫中將其民族特色提取加工，通過民族視覺元素結(jié)合音樂博物館的特點，將創(chuàng)作插畫與交互結(jié)合，最大限度地傳播廣西民族音樂博物館的豐富民族理念與內(nèi)涵。

在利用H5（HTML5）進(jìn)行推廣時，推廣成本方面有著不可小覷的優(yōu)勢，由于近年來流媒體以及社交軟件的發(fā)展，用戶基數(shù)也隨之增加， 在社交平臺上的轉(zhuǎn)發(fā)亦或是流媒體的投放，都會迅速增加對其H5（HTML5）關(guān)注點擊量，以相對較低之成本，獲得較大的受眾關(guān)注。

三、插畫場景主題的提煉

首先應(yīng)要明確的是H5（HTML5）交互設(shè)計的作用是在于其快速廣泛的傳播途徑以及加深傳播過程中對宣傳目標(biāo)潛移默化的信息傳導(dǎo)，受眾可以獲得相對完整的沉浸式體驗。因此從對于廣西民族音樂博物館H5（HTML5）插畫場景主題深入探究時，需要明確廣西民族音樂博物館H5（HTML5）宣傳主旨，是以傳播廣西傳統(tǒng)音樂文化，輻射東南亞音樂文化圈為目的，觀察其收集提取素材，結(jié)合主旨對其探析后可發(fā)現(xiàn)在對于提取民族元素素材后進(jìn)行的插畫創(chuàng)作具有一定的連貫性，在一定程度上合理連接了廣西民族音樂博物館H5（HTML5）各個單元的邏輯性與故事性，利用提取廣西民族音樂元素創(chuàng)作的場景主題插畫與H5（HTML5）交互設(shè)計結(jié)合，在傳播過程中可使受眾對民族傳統(tǒng)元素情懷升溫。在一定程度上明確了H5（HTML5）交互設(shè)計中的人和物質(zhì)、文化、歷史、音樂之間的對話邏輯。由此可見廣西民族音樂博物館H5（HTML5）作者在進(jìn)行初期演示時，不僅做好了用戶場景模擬預(yù)測，而且進(jìn)行分析了其是否準(zhǔn)確表達(dá)廣西民族音樂博物館內(nèi)在含義與其呈現(xiàn)效果之間的關(guān)系，最終確立了行之有效的方案 。

從整體出發(fā)，進(jìn)行全面深入探析后，得知其廣西民族音樂博物館H5（HTML5）分為三個單元：古器之聲、八桂音韻、東南亞音樂文化。在第一單元古器之聲之中強調(diào)“和集百越，同其風(fēng)俗”駱越文化下蒼勁渾厚鼓聲與青銅文化底蘊，如會鼓、煙墩大鼓（由牛皮、鎖扣等等制作而成）、大型青銅樂器羊角鈕鐘、銅鼓。 而在第二單元，八桂音韻中強調(diào)了從駱越文化至今的璀璨的少數(shù)民族民歌如壯族民歌、毛南族民歌、仫佬族民歌、以及戲曲演出中的弦鳴樂器（角胡）、擦弦樂器（七弦琴）、氣鳴樂器（蘆笙）、休鳴樂器（棒棒）膜鳴樂器（皮鼓）、各類面具、形態(tài)各異的提線人偶等等。最后第三單元強調(diào)東南亞音樂文化，例如印尼西亞爪哇“得貢甘美蘭”樂器的構(gòu)成等等。

可見創(chuàng)作者在各個單元中著重提取各個單元中具有鮮明特色的民族元素進(jìn)行廣西民族音樂博物館H5（HTML5）插畫場景主題創(chuàng)作，例如第一單元中羊角鈕鐘、銅鼓、第二單元中提線人偶、鳴樂器（角胡）、以及第三單元之中的具有東南亞特色的“得貢甘美蘭”樂器群 的元素提取。不僅在設(shè)計語言上言簡意賅，更是科學(xué)合理的照應(yīng)廣西民族音樂博物館場館具體布置。

四、動態(tài)交互場景腳本的設(shè)計

首先應(yīng)要明確的是H5（HTML5）交互設(shè)計的作用是在于其快速廣泛的傳播途徑以及加深傳播過程中對宣傳目標(biāo)潛移默化的信息傳導(dǎo)，受眾可以獲得相對完整的沉浸式體驗。因此從對于廣西民族音樂博物館H5（HTML5）插畫場景主題深入探究時，需要明確廣西民族音樂博物館H5（HTML5）宣傳主旨，是以傳播廣西傳統(tǒng)音樂文化，輻射東南亞音樂文化圈為目的，觀察其收集提取素材，結(jié)合主旨對其探析后可發(fā)現(xiàn)在對于提取民族元素素材后進(jìn)行的插畫創(chuàng)作具有一定的連貫性，在一定程度上合理連接了廣西民族音樂博物館H5（HTML5）各個單元的邏輯性與故事性，利用提取廣西民族音樂元素創(chuàng)作的場景主題插畫與H5（HTML5）交互設(shè)計結(jié)合，在傳播過程中可使受眾對民族傳統(tǒng)元素情懷升溫。在一定程度上明確了H5（HTML5）交互設(shè)計中的人和物質(zhì)、文化、歷史、音樂之間的對話邏輯。由此可見廣西民族音樂博物館H5（HTML5）作者在進(jìn)行初期演示時，不僅做好了用戶場景模擬預(yù)測，而且進(jìn)行分析了其是否準(zhǔn)確表達(dá)廣西民族音樂博物館內(nèi)在含義與其呈現(xiàn)效果之間的關(guān)系，最終確立了行之有效的方案 。

從整體出發(fā)，進(jìn)行全面深入探析后，得知其廣西民族音樂博物館H5（HTML5）分為三個單元：古器之聲、八桂音韻、東南亞音樂文化。在第一單元古器之聲之中強調(diào)“和集百越，同其風(fēng)俗”駱越文化下蒼勁渾厚鼓聲與青銅文化底蘊，如會鼓、煙墩大鼓（由牛皮、鎖扣等等制作而成）、大型青銅樂器羊角鈕鐘、銅鼓。 而在第二單元，八桂音韻中強調(diào)了從駱越文化至今的璀璨的少數(shù)民族民歌如壯族民歌、毛南族民歌、仫佬族民歌、以及戲曲演出中的弦鳴樂器（角胡）、擦弦樂器（七弦琴）、氣鳴樂器（蘆笙）、休鳴樂器（棒棒）膜鳴樂器（皮鼓）、各類面具、形態(tài)各異的提線人偶等等。最后第三單元強調(diào)東南亞音樂文化，例如印尼西亞爪哇“得貢甘美蘭”樂器的構(gòu)成等等。

可見創(chuàng)作者在各個單元中著重提取各個單元中具有鮮明特色的民族元素進(jìn)行廣西民族音樂博物館H5（HTML5）插畫場景主題創(chuàng)作，例如第一單元中羊角鈕鐘、銅鼓、第二單元中提線人偶、鳴樂器（角胡）、以及第三單元之中的具有東南亞特色的“得貢甘美蘭”樂器群 的元素提取。不僅在設(shè)計語言上言簡意賅，更是科學(xué)合理的照應(yīng)廣西民族音樂博物館場館具體布置。

結(jié)束語

至此，在通過對廣西民族音樂博物館H5（HTML5）探析中的不難看出在提取民族元素，利用插畫的表現(xiàn)形式，并在交互設(shè)計中利用H5（HTML5）平臺，不僅可以快速流暢的在線上體驗廣西民族音樂博物館中屬于廣西本土乃至東南亞的民族音樂知識，還可以的使大眾在此H5（HTML5）潛移默化當(dāng)中加深對民族音樂的了解，實現(xiàn)了在大眾傳播當(dāng)中的雅俗共賞。

參考文獻(xiàn)

[1]基于用戶情感體驗的交互動畫界面設(shè)計[J]. 楊靜.?濱州學(xué)院學(xué)報. 2017（06）

[2] 胡曉林，馬振龍.基于H5技術(shù)的微信交互式廣告在交互設(shè)計方面的“優(yōu)勢整合”創(chuàng)新思考[J].包裝工程，2016，37（24）

[3] H5廣告的傳播價值及效果有限性的反思[J]. 張玲.?青年記者. 2017（32）

[4] 郭暉，王歡.新媒體時代下的H5廣告創(chuàng)意與營銷分析——以“淘寶造物節(jié)”為例[J].納稅，2017，（34）

基金項目：2019年度國家級大學(xué)生創(chuàng)新創(chuàng)業(yè)訓(xùn)練計劃《民族元素插畫創(chuàng)意在交互設(shè)計中的表現(xiàn)與應(yīng)用-以廣西民族音樂博物館H5交互設(shè)計為例》;項目編號：201910607010。