王迪

摘要：在數(shù)字媒體技術(shù)潮流下，基于微信平臺(tái)H5設(shè)計(jì)的日漸成熟，已成為現(xiàn)今最流行的宣傳推廣媒介之一。H5設(shè)計(jì)以快捷和易于傳播的特性，在宣傳推廣中占有越來越重要的地位。而與傳統(tǒng)廣告形式相比較，H5 廣告受眾群體不只是被動(dòng)的接受產(chǎn)品信息，他們開始成為產(chǎn)品宣傳的媒介者。用戶通過微信平臺(tái)轉(zhuǎn)發(fā)形成了“多對(duì)多”的傳播方式，使受眾承擔(dān)為信息廣告的接受者及傳播者，這便是H5與傳統(tǒng)宣傳形式相比最大的優(yōu)勢。

關(guān)鍵詞：H5設(shè)計(jì)；創(chuàng)新；傳播

中圖分類號(hào)：TP311.56 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1672-9129（2019）04-0024-04

Abstract： Nowadays， under the trend of digital media technology， the H5 design based on WeChat platform is increasingly matured， which makes the platform become one of the most popular promotional media channels. H5 design occupies an important position in the promotion process because of its efficient and easy-to-spread features. Compared with traditional forms of advertising， the target audiences of H5 advertisements are not just accepting product information passively ， but becoming the media agents as well as product promoters. Users have created a “many-to-many” communication way spontaneously through the WeChat platform， which makes the users become the recipients and disseminators of information and advertisements， and the whole pattern turns out to be the biggest advantage of H5 design compared with the traditional propaganda form.

Keywords： H5 design；Innovation；Communication

引言

H5 技術(shù)是一種新興的網(wǎng)頁設(shè)計(jì)語言形式，作為網(wǎng)絡(luò)用戶在移動(dòng)端看到的一些宣傳活動(dòng)的動(dòng)態(tài)廣告、企業(yè)邀請(qǐng)函、產(chǎn)品互動(dòng)游戲、多為H5設(shè)計(jì)制作。H5主要性能是具有超強(qiáng)的兼容性、巨大的儲(chǔ)存功能以及賦予設(shè)計(jì)效果強(qiáng)大的互動(dòng)性、三維圖形的制作與效果應(yīng)用。 隨著移動(dòng)網(wǎng)絡(luò)社交媒體的不斷發(fā)展，尤其是隨著微信使用的普及，H5技術(shù)成為現(xiàn)如今最適于推廣的宣傳媒介，而新的宣傳形式也在蜂擁而至。H5的視覺傳播平臺(tái)多集中在微信朋友圈，形態(tài)各異的視覺效果沖擊著不同的觀者群體。

1 H5在當(dāng)代多媒體傳播中的發(fā)展現(xiàn)狀

自2015年年初開始，H5作為一項(xiàng)新的設(shè)計(jì)形式在信息媒體中傳播開來，便捷的制作和傳播廣度是其受歡迎的主要原因。隨后，品牌在各類傳播中也開始引入H5設(shè)計(jì)推廣形式，大家在品牌新品發(fā)布會(huì)、產(chǎn)品推廣平臺(tái)和社交媒體公眾號(hào)中，H5的宣傳隨處可見。H5之所以發(fā)展如此之快的原因在于它適用于手機(jī)等不同的社交工具，人們現(xiàn)如今也對(duì)這類社交工具變得越加依賴。在這些社交媒介中H5幾乎不需要考慮用戶的適用性和配置問題，并且不需要花費(fèi)太多的時(shí)間。適用于用戶的手機(jī)及各個(gè)媒介平臺(tái)，在手機(jī)界面及Web頁面中只需要進(jìn)行適配調(diào)制，用戶便可以直接在線瀏覽無需下載，從而節(jié)約儲(chǔ)存空間。更重要的是，核心功能的感官體驗(yàn)和互動(dòng)影響它所帶來的用戶體驗(yàn)比社交媒體更加適用于商業(yè)營銷。

在商業(yè)品牌的宣傳實(shí)踐中，國外廣告推廣方式在環(huán)境形式中不斷創(chuàng)新，在多媒體交互廣告中也涌現(xiàn)出很多成功的案例。例如肯德基、麥當(dāng)勞、蘋果手機(jī)、耐克等許多知名品牌，都推出了形式各異的多媒體宣傳互動(dòng)廣告，這些互動(dòng)廣告都具有很強(qiáng)的趣味體驗(yàn)性，造成強(qiáng)烈的推廣傳播效應(yīng)，使其在同類產(chǎn)品中脫穎而出。

2 當(dāng)代社會(huì)環(huán)境下微信H5視覺設(shè)計(jì)的趨勢

第十九次全國代表大會(huì)于2017年10月18日在北京召開，各大媒體在十九大期間的新聞報(bào)道形式也精彩紛呈、創(chuàng)意無限。在會(huì)期間為了更好地報(bào)道和解讀十九大報(bào)告中的精彩內(nèi)容，媒體們紛紛亮出高招。以H5、音頻、圖解、虛擬現(xiàn)實(shí)技術(shù)等融合十九大會(huì)議的精彩內(nèi)容，出現(xiàn)了很多優(yōu)秀的新聞報(bào)道。在媒體推廣中H5極具互動(dòng)性，因此傳播效果顯著。

在十九大的會(huì)議報(bào)道中，騰訊新聞出品的《為習(xí)近平鼓掌》刷爆朋友圈，吸引無數(shù)網(wǎng)友的轉(zhuǎn)發(fā)點(diǎn)贊?！稙榱?xí)近平鼓掌》是以互動(dòng)性為主，這款H5通過視頻和交互相結(jié)合，在前半部分以習(xí)總書記的講話引出會(huì)議主要內(nèi)容后面結(jié)合有趣的互動(dòng)式體驗(yàn)游戲使整個(gè)H5充滿趣味性，加強(qiáng)了觀看者對(duì)十九大內(nèi)容的理解與思考。長城新媒體制作的的《“小十九”的2050，大家快來打call》講述了一個(gè)在十九大召開當(dāng)天出生孩子的成長故事，以大會(huì)與大眾成長歷程相結(jié)合的形式，具有創(chuàng)意性同時(shí)，也使得這種極富意義的事件更易于觀者產(chǎn)生共鳴。

在互聯(lián)網(wǎng)新媒體的形勢下，傳統(tǒng)媒體逐漸被新媒體所取代，新媒體產(chǎn)生更多新型的傳播形式，預(yù)示著會(huì)有更多的視覺設(shè)計(jì)效果出現(xiàn)。H5多種媒體視覺形式，其中包括：視頻、圖片、文字、動(dòng)畫等，這些形式能夠?yàn)橛^者傳達(dá)新穎的視覺交互體驗(yàn)，豐富的視覺形式打破了傳統(tǒng)媒體的單一傳播方式，從而使得信息的流通更加多元化。

3 微信H5在視覺設(shè)計(jì)中的創(chuàng)新形式

3.1 頁面切換形式

以頁面切換的形式進(jìn)行設(shè)計(jì)的H5是采用簡潔的翻頁、精美的圖片和音頻組成，同時(shí)通過滑動(dòng)頁面進(jìn)行切換。例如新產(chǎn)品的發(fā)布和產(chǎn)品推廣等都屬于此類形式的H5。此類頁面形式營銷的目標(biāo)是為了在簡潔的頁面切換過程中使體驗(yàn)者更直觀的接收到信息的傳遞?；脽羝シ蓬愋偷腍5設(shè)計(jì)一般是為品牌營銷推廣而設(shè)計(jì)，此類廣告一般具有強(qiáng)時(shí)效性，因此廣告中創(chuàng)意巧妙的文案是引起傳播的關(guān)鍵因素。

為推廣岡本產(chǎn)品的H5設(shè)計(jì)廣告以“與時(shí)光相愛”為創(chuàng)意主題。用視頻形式講述幾組普通人的相愛故事，暗戀、相識(shí)、相知、相愛、異地、同居等不同瞬間的展示讓用戶產(chǎn)生“愛”的共鳴，過程中軟性露出岡本品牌。最后通過“定制我的紀(jì)念日”讓用戶參與其中，幾段貼心的文案可以選擇，也可以自己記錄一段對(duì)生活和愛的感悟。設(shè)計(jì)上，淡色的背景、卡通的人物形象和溫馨的文案相搭配，整體感覺即明快又暖心。這個(gè)H5并沒用強(qiáng)硬的廣告植入，反而通過生活中的普通人、細(xì)節(jié)場景來引起用戶的共鳴，吸引用戶觀看、轉(zhuǎn)發(fā)、并引發(fā)人的思考，可以更好的去愛生活。

3.2 創(chuàng)意視頻頁面形式

創(chuàng)意視頻的H5設(shè)計(jì)是由精美的動(dòng)畫設(shè)計(jì)、精彩的音頻效果、打動(dòng)人心故事和趣味性互動(dòng)構(gòu)成，同時(shí)采用了滑動(dòng)或自動(dòng)播放的形式來進(jìn)行多頁面切換。如常見的品牌產(chǎn)品推廣、游戲宣傳、APP應(yīng)用宣傳等都屬于此類形式的H5。在整個(gè)設(shè)計(jì)流程中，在視頻中穿插具有趣味性的交互體驗(yàn)也是此類H5的常用制作方式。此類的H5傳播目標(biāo)是為了引發(fā)用戶的好奇，傳達(dá)趣味性，從而達(dá)到宣傳推廣的效果。

人民日?qǐng)?bào)設(shè)計(jì)出品的《史上最牛創(chuàng)業(yè)經(jīng)》被稱為國內(nèi)首部閃卡H5視覺動(dòng)畫，作為政府的傳媒宣傳機(jī)構(gòu)，最重要的是要清晰的傳達(dá)會(huì)議信息和精神。人民日?qǐng)?bào)通過簡潔的文字切換和高頻率的畫面轉(zhuǎn)換對(duì)中國共產(chǎn)黨的歷史發(fā)展、戰(zhàn)略決策和偉大精神進(jìn)行傳達(dá)和表述。同時(shí)作為官方媒體宣傳平臺(tái)，簡單精煉的視覺和內(nèi)容也尤為重要，畫面隨著音樂有頻次的進(jìn)行切換，而顏色上也采用了紅色和黃色的正統(tǒng)顏色。整個(gè)H5基調(diào)準(zhǔn)確切富有節(jié)奏感，從而達(dá)到了有效的傳播效果。

3.3 虛擬場景頁面形式

虛擬場景型H5設(shè)計(jì)的主要目的是發(fā)掘用戶的潛在心理。H5設(shè)計(jì)通過交互技術(shù)營造真實(shí)的體驗(yàn)空間，在整個(gè)過程中消費(fèi)者通過在虛擬空間中了解產(chǎn)品信息，體驗(yàn)產(chǎn)品功能。打破了傳統(tǒng)的宣傳推廣方式，由消費(fèi)者被動(dòng)的接受信息轉(zhuǎn)變?yōu)橹鲃?dòng)直觀的了解和感受產(chǎn)品，從而通過真實(shí)的女體驗(yàn)來主動(dòng)傳播信息。此類型的H5可以通過場景的預(yù)設(shè)和設(shè)計(jì)讓觀者更加了解品牌信息和品牌文化，從而推動(dòng)品牌的 推廣和影響力。

QQ閱讀為宣傳推廣而設(shè)計(jì)的H5—《歡迎來到自由圖書館》。圍繞《自由圖書館》進(jìn)行內(nèi)容敘述，一個(gè)孩子來圖書館想要找的自己想看的圖書，卻通過各種方法都沒有找到，此時(shí)圖書館長出現(xiàn)，在館長的幫助下終于尋到了自己的想要的書籍。在設(shè)計(jì)上，采用漫畫和動(dòng)畫相結(jié)合的風(fēng)格，以木質(zhì)書架的深棕色作為主色調(diào)，里面的元素大多小而精致。圖書館采用3D的效果，使觀者能夠最真實(shí)的體驗(yàn)到圖書館的整體內(nèi)容和信息的傳輸。

3.4 游戲互動(dòng)頁面形式

游戲互動(dòng)類型的H5設(shè)計(jì)獲得消費(fèi)者認(rèn)可的關(guān)鍵在于參與者體驗(yàn)中所賦予的趣味性。設(shè)計(jì)巧妙的游戲過程能夠吸引消費(fèi)者自發(fā)參與其中。游戲的主要內(nèi)容多是品牌的相關(guān)信息和產(chǎn)品性能植入，在體驗(yàn)過程中可以使品牌信息潛意識(shí)的內(nèi)化參與者的心理，使他們更加容易接受產(chǎn)品廣告。游戲類的H5 打破了傳統(tǒng)廣告單一的宣傳模式，它通過整個(gè)體驗(yàn)過程，逐漸的打通參與者的內(nèi)心提高他們對(duì)產(chǎn)品的接受度。

網(wǎng)易設(shè)計(jì)的H5—《春晚笑聲錄，聽聲猜小品》，首頁展示了春晚笑聲錄的主題，之后進(jìn)入測試環(huán)節(jié)。每個(gè)問題會(huì)有對(duì)應(yīng)的小品節(jié)選，聽完之后選出正確答案，在最后會(huì)出現(xiàn)成績單分享。設(shè)計(jì)以米白色為背景，用小品與之相關(guān)的圖形元素進(jìn)行點(diǎn)綴，代入感極強(qiáng)。在體驗(yàn)上，能夠引起用戶的共鳴，勾起美好的回憶。

4 微信H5在視覺設(shè)計(jì)中的創(chuàng)新性思考

H5設(shè)計(jì)中的交互性要求交互形式與交互手段的結(jié)合具有超強(qiáng)的代入感，能夠讓用戶在自身的體驗(yàn)中深入感知互動(dòng)性所帶給自己的愉悅感和實(shí)用性。傳統(tǒng)視覺設(shè)計(jì)在一定程度上由于工藝和技術(shù)的限制，在表現(xiàn)形式上具有一定的局限性。所以傳統(tǒng)視覺設(shè)計(jì)更多追求的是真實(shí)感和色彩的感染力。因此在傳播上受眾接收信息時(shí)會(huì)更加被動(dòng)。

H5的產(chǎn)生在很大程度上增強(qiáng)的是受眾代入感的營造，通過視覺、聽覺、觸覺等一系列感官系統(tǒng)的統(tǒng)一配合，從而增加了受眾體驗(yàn)互動(dòng)的趣味性。另外，營造強(qiáng)烈的代入感需要結(jié)合產(chǎn)品特性設(shè)置符合品牌格調(diào)的視覺形式。例如可以利用H5技術(shù)中強(qiáng)大的繪畫及視頻制作功能營造出一種身臨其境的視覺體驗(yàn)，結(jié)合其中的互動(dòng)功能從而增強(qiáng)了傳播中的真實(shí)感，以便提高用戶體驗(yàn)效果。

5 總結(jié)

隨著H5技術(shù)的提高以及微信平臺(tái)的開放，在完善的技術(shù)和自由的平臺(tái)基礎(chǔ)之下，這種傳播優(yōu)勢進(jìn)一步凸顯了出來。而H5想要吸引受眾，首先要具備幾個(gè)關(guān)鍵因素：強(qiáng)大的視聽創(chuàng)意、故事有趣且打動(dòng)觀眾、易互動(dòng)。設(shè)計(jì)師需要結(jié)合產(chǎn)品的營銷及定位對(duì)用戶群體進(jìn)行分析，使設(shè)計(jì)的H5能夠被受眾接受，樂于參與。H5 廣告隨著技術(shù)的發(fā)展在形式上還會(huì)不斷的增加，但是它的目標(biāo)只有一個(gè)，就是要不斷擴(kuò)大產(chǎn)品聲量，從而用最適合、最有效的方式來實(shí)現(xiàn)產(chǎn)品和品牌的最廣度傳播。

參考文獻(xiàn)：

[1] 高涵，淺談基于新媒體平臺(tái)的HTML5頁面藝術(shù)設(shè)計(jì)——以H5邀請(qǐng)函頁面設(shè)計(jì)為例進(jìn)行分析[J].天津工業(yè)大學(xué)，2017

[2] 孫園園，網(wǎng)絡(luò)“微媒體”交互設(shè)計(jì)研究[D].石家莊： 河北師范大學(xué)，2014.

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

[4] 熊巍， 王舒盼， 潘瓊. 微信移動(dòng)社交用戶心流體驗(yàn)對(duì)用戶粘性的影響研究[J]. 新聞界，2015（7）： 13.

[5] 譚坤， 呂悅寧. 基于微信平臺(tái)的H5廣告設(shè)計(jì)策略分析[J]. 包裝工程， 2016（20）：198-202.