李娟

摘 要 隨著數(shù)字媒體和移動互聯(lián)網(wǎng)技術(shù)的發(fā)展，越來越多的H5廣告出現(xiàn)在日常生活中。優(yōu)秀的H5廣告不僅在內(nèi)容和形式上要新穎，而且在版式設(shè)計方面也要符合大眾審美的需求。文章以形式美為切入點，在介紹H5廣告的版式設(shè)計重要性的基礎(chǔ)上，重點分析了版式設(shè)計與形式美相結(jié)合的特點和原則。

關(guān)鍵詞 H5廣告;形式美;版式設(shè)計

中圖分類號 G2 文獻(xiàn)標(biāo)識碼 A 文章編號 2096-0360（2018）23-0052-02

數(shù)字媒體和移動互聯(lián)網(wǎng)的發(fā)展改善了人們的生活，智能手機(jī)已成為人們最密切的媒介，廣告業(yè)逐漸從傳統(tǒng)領(lǐng)域向移動營銷領(lǐng)域變遷[1]。2014年，HTML5技術(shù)的出現(xiàn)，使廣告行業(yè)發(fā)生了巨大的變革。HTML5技術(shù)能兼容音頻、視頻、圖片等元素，能同時支持二維和三維效果，并十分適用于移動互聯(lián)網(wǎng)的媒介。利用微信等網(wǎng)絡(luò)平臺，用戶在手機(jī)端就可以感受到H5廣告的魅力。由于H5廣告具有良好互動性、能充分與受眾溝通等優(yōu)勢，使得許多創(chuàng)意十足、設(shè)計精良、個性鮮明的廣告作品在社交平臺上迅速傳播。H5廣告獨具一格的表現(xiàn)形式，充分展現(xiàn)了新媒體時代廣告產(chǎn)品的品牌傳播特點。

H5廣告的快速崛起，在繁榮廣告行業(yè)的同時也暴露出一些問題，比如開發(fā)泛濫、作品設(shè)計雷同、趨于低端化等現(xiàn)象。在版式設(shè)計方面，很多H5廣告投入很少，存在頁面設(shè)計創(chuàng)意不足、版面內(nèi)容過于擁擠、主題不明確等問題。針對H5廣告板設(shè)計的相關(guān)問題，本文以形式美作為切入點，對H5廣告的版式設(shè)計進(jìn)行剖析，力求提供更多更為豐富的表現(xiàn)形式。

1 版式設(shè)計中的形式美因素

形式美是客觀事物外觀形式的美，包括線、形、色、光、聲、質(zhì)等外形因素和將這些因素按一定規(guī)律組合起來，以表現(xiàn)內(nèi)容的結(jié)構(gòu)等[2]。設(shè)計過程的形式美因素決定了一項設(shè)計作品美的程度，是否會對受眾產(chǎn)生強(qiáng)烈的視覺沖擊力。版式設(shè)計是依據(jù)所要傳達(dá)的信息和審美規(guī)律，結(jié)合平面設(shè)計的特點，將圖形、文字、色彩等元素進(jìn)行編排組合的一種視覺傳達(dá)的設(shè)計形式[3]。與其他藝術(shù)形式相同，廣告設(shè)計需要遵循美的表達(dá)規(guī)律。形式美的法則有很多種，不同法則的特點和作用不同，但它們之間相互作用、相互關(guān)聯(lián)。深入理解版面設(shè)計的形式美法則及其內(nèi)涵，有助于版式設(shè)計師更好地將形式美因素融入到設(shè)計中，以傳達(dá)作品的美感。

1.1 秩序與變異

秩序和變異是形式美的兩種規(guī)律。其中，秩序美是起主導(dǎo)表現(xiàn)的作用，而變異則是打破常規(guī)的美，與秩序美相反。變異雖然不是主要的，但卻具有很好的新意，它是對舊秩序的一種革新。在版式設(shè)計中，秩序和變異是兩種截然不同的風(fēng)格形式。秩序美是版面設(shè)計的靈魂，它是采用相同或相近的基本形狀進(jìn)行排列組合，一樣的形狀、大小和方向可以產(chǎn)生整齊、穩(wěn)定的美感。另一方面，如果過多采用秩序美，也會使版式變得單調(diào)，缺少靈活性。相比之下，適當(dāng)采用變異，比如夸張、變形等會引發(fā)人們視覺上的緊張感和興奮感。因此，秩序和變異需要合理搭配，適當(dāng)?shù)淖儺悤尠婷嬖诜€(wěn)定美的基礎(chǔ)上增添動感和情趣。

1.2 對比與調(diào)和

將兩個完全不相同的東西并列在一起進(jìn)行比較，稱為對比。通過鮮明的對照，兩個對象相互襯托，相互依賴，在使圖案在不失完整的前提下，能夠突出重點，主次分開，同時整體又顯得生動和活潑。調(diào)和是針對對比的因素所進(jìn)行的協(xié)調(diào)處理，在對比因素之間搭建起過渡的橋梁，讓它們慢慢接近，力求是版面達(dá)到柔和、協(xié)調(diào)的舒適感。對比與調(diào)和相輔相成，沒有對比就不存在調(diào)和，調(diào)和是為了更好地進(jìn)行對比。

對比突出強(qiáng)調(diào)差異性，兩種視覺相反的因素排列在一起，讓人感到強(qiáng)烈反差的同時，仍舊覺得這是一個整體的現(xiàn)象。對比是版面設(shè)計必不可少的元素，缺少對比就沒有活力。調(diào)和強(qiáng)調(diào)近似性或相似性，目的是讓不同的元素具有共同點，調(diào)和也是版式設(shè)計重要的一環(huán)，只有對比沒有調(diào)和，版面就會缺少穩(wěn)定和秩序的美感。

1.3 對稱與平衡

對稱與平衡是不同類型的穩(wěn)定形式，它們是形式美感物體的兩個重要特征。不管是靜止的，還是出于運(yùn)動狀態(tài)，美的事物通常都具有相對穩(wěn)定的形態(tài)，在物體外觀上達(dá)到視覺上的穩(wěn)定。對稱和平衡時不同的，但二者也存在聯(lián)系。對稱是平衡的一種，而平衡卻不屬于對稱的范疇，版式設(shè)計通常以非對稱來表現(xiàn)美感上的平衡。深入理解對稱和平衡的內(nèi)涵，有助于設(shè)計師將形式美融入設(shè)計中，提升版式的美感。

平衡是指視覺上的穩(wěn)定狀態(tài)，其是通過視覺元素的色彩、大小和位置等之間的關(guān)系來展現(xiàn)。在版面編排中，對稱本身具有平衡感，是最直觀的一種平衡。平衡一般指視覺上的平衡，并非絕對的對稱。對稱與平衡會使人們產(chǎn)生視覺上的和諧感和心理上的安寧感。

2 H5廣告的版式特點

H5廣告一般以手機(jī)或平板等移動端作為傳播載體，載體屏幕比較小，這影響了受眾對信息的獲取效果，因此需要在版式設(shè)計上下功夫。優(yōu)秀的版式設(shè)計，不僅能在視覺上正確引導(dǎo)用戶，同時又能突出主題，明確主次關(guān)系，從而使信息達(dá)到最好的傳播。依據(jù)視覺習(xí)慣，將不同的圖文信息進(jìn)行合理組織，能起到視覺上的引導(dǎo)，通過利用形式美法則以及色彩、亮度等元素明確信息的主次關(guān)系，突出視覺主題元素。另外，交互性是H5廣告的重要特征之一，必須在設(shè)計時加以重點考慮。優(yōu)秀的版面設(shè)計可以增強(qiáng)引導(dǎo)性、突出主題，同時在視覺上輔助交互，增加點擊感。目前常見的H5廣告版面類型包括直線型、斜線型、三角形類型、圓形類型等。

2.1 直線型

最為常見的直線型版面，簡單的直線進(jìn)行界面的劃分，表現(xiàn)出沉穩(wěn)的頁面基調(diào)。用直線切分的界面，每塊的大小依據(jù)內(nèi)容需要而調(diào)整。直線型版面形式簡單，讓人感覺到條理性和嚴(yán)肅性。直線型可以對明確劃分內(nèi)容，引導(dǎo)用戶進(jìn)行相應(yīng)的交互活動。另一方面，直線型版面也往往顯得生硬和呆板，缺少活潑性。

2.2 斜線型

相對于直線的生硬，斜線型就顯得活潑，視覺上的沖擊力更強(qiáng)。斜線型也具有較好的引導(dǎo)性，而且增加了整體版面的動感性。如果加上動效，會給用戶帶來更大的視覺沖擊感，越多傾斜效果越好。斜線可以讓人感覺平面在延續(xù)，適用于多頁面和長頁面的情況，特別是頁面的連續(xù)切換，用斜線版式可以增強(qiáng)引導(dǎo)性。

2.3 三角形類型

三角形的優(yōu)點是具有良好的穩(wěn)定性，用在版面上可以起到良好的視覺引導(dǎo)效果。同時三角形也是尖銳的，適用于傳達(dá)刺激、快速、時尚的感覺。在視覺上，三角形往往會突出指向性，在多屏幕間滑動切換時，可用來引導(dǎo)用戶進(jìn)行交互。

2.4 圓形類型

在手機(jī)屏幕上使用圓形的版式，聚焦效果好，適用于主標(biāo)題、重要圖文信息的表達(dá)。在視覺上，圓形顯得更為光滑和飽滿，給人一種親近感。相比較其他版面類型，圓形巧妙地分割了畫面內(nèi)容，視覺上具備更多的親和力，而且特別流暢。

3 形式美視角下的版式設(shè)計

H5廣告作品的版式設(shè)計要想具備更多的形式美感，就需要依據(jù)形式美法則，選用與傳播主題相匹配的圖形，選擇正確的字體，調(diào)和圖片的顏色，使作品具備強(qiáng)烈的視覺沖擊力，吸引受眾的注意。版式設(shè)計同時強(qiáng)調(diào)藝術(shù)性和實用性，是基于作品功能的前提下，以有效傳播為目的的視覺傳達(dá)藝術(shù)。設(shè)計過程中在遵循形式美法則的前提下，將設(shè)計內(nèi)容與設(shè)計形式有機(jī)的結(jié)合，期望作品在達(dá)到傳播目的的同時，又能夠給用戶以美的視覺感受。

3.1 強(qiáng)調(diào)主題

功能實用性是版式設(shè)計的出發(fā)點，其首要任務(wù)是根據(jù)品牌內(nèi)容和審美的需求，合理運(yùn)用形式美法則，將文字、圖形、色彩等加以編排，更好的引導(dǎo)用戶，從而使廣告信息達(dá)到有效的傳播。H5廣告在追求形式完美的同時，最核心的是要強(qiáng)調(diào)主題思想，其本質(zhì)就是為了更好地傳播主題信息。為了突出主題，應(yīng)該在有限的屏幕中設(shè)置核心元素，核心元素不要太多，關(guān)鍵是能突出重點。從應(yīng)用功能上來講，為達(dá)到設(shè)計的效果，必須明確把握主要矛盾。因此，版式設(shè)計的原則之一是突出重點、主次分明。

3.2 重視整體

圖形和文字是版式設(shè)計的最基本要素，二者的完美結(jié)合，使版面變得和諧統(tǒng)一，既可以讓受眾感受到視覺上的美感，又能使作品的閱讀性和觀賞性變得更佳。廣告的版式設(shè)計除了強(qiáng)調(diào)主題外，也要十分重視整體效果，即在編排版面時要整體考慮結(jié)構(gòu)、圖形、文字、色彩等要素。重視整體性原則，是為了增加版面要素的協(xié)調(diào)性和關(guān)聯(lián)性，特別是結(jié)構(gòu)和色彩方面的協(xié)調(diào)性。因此，設(shè)計師要合理運(yùn)用多種協(xié)調(diào)手段，對版面進(jìn)行整體的綜合考慮，使作品版面表現(xiàn)出條理美和秩序美，同時又能提升整體的視覺效果。

3.3 注重互動

互動性是H5廣告作品的重要特征之一。H5廣告在網(wǎng)絡(luò)平臺上傳播時，期望受眾能由旁觀者變成參與者，積極參與到廣告的交互體驗中，讓受眾在互動過程中感知樂趣，在享受中接受產(chǎn)品。與傳統(tǒng)的平面版式相比，互動性的版式具有主動性、相互性的特征，可以調(diào)動用戶的情緒。因此，在設(shè)計時要加入合理的、足夠的互動元素，把版式設(shè)計中互動的創(chuàng)新和用戶體驗的感受作為重點，加強(qiáng)互動性的引導(dǎo)。利用互動版面設(shè)計的優(yōu)勢，讓用戶和品牌之間產(chǎn)生互動，摩擦出更多的火花，進(jìn)而使廣告作品得到更大范圍的傳播。對互動版式的設(shè)計探索，是H5廣告可持續(xù)發(fā)展的需要，也是發(fā)展的趨勢方向。

4 結(jié)束語

新媒體時代H5廣告蓬勃發(fā)展的同時，競爭也越發(fā)激烈。如何通過設(shè)計有效提升H5廣告的視覺效果，更好地吸引用戶，是版式設(shè)計師要考慮的重點問題。版面中有良好的視覺引導(dǎo)就會具有更好的邏輯性，更加突出主題信息。合理的版式設(shè)計能引導(dǎo)用戶在最短的時間內(nèi)接收到有效信息，并增強(qiáng)用戶的互動性。本文在闡述形式美的基礎(chǔ)上，討論了版式設(shè)計的重要性及特點，并概括分析了形式美視角下版式設(shè)計的原則性問題。

參考文獻(xiàn)

[1]毓鑫，黃弘.基于移動互聯(lián)網(wǎng)環(huán)境下的H5設(shè)計形式探究[J].設(shè)計，2016（23）：134-135.

[2]朱光潛.朱光潛談美[M].上海：華東師范大學(xué)出版社，2012.

[3]武禹男.數(shù)字媒體環(huán)境下行動體驗廣告交互設(shè)計初探[J].新媒體研究，2015（13）：44-46.

[4]杜蔚苗.移動終端H5廣告互動頁面設(shè)計研究[D].武漢：湖北工業(yè)大學(xué)，2017.

[5]鄭舒逸.從H5廣告設(shè)計看數(shù)字媒體時代虛擬美學(xué)[J].數(shù)碼設(shè)計，2017（6）：161-162.

基金項目：福建省教育廳2017年中青年教師教育科研項目“H5廣告的目標(biāo)消費(fèi)群心里與表現(xiàn)形式研究”（項目編號：JAS170359）。

作者簡介：李 娟，閩江學(xué)院新聞傳播學(xué)院教師，研究方向為品牌形象設(shè)計與傳播。