導語：游戲互動式H5廣告設計探究一文來源于網友上傳，不代表本站觀點，若需要原創文章可咨詢客服老師，歡迎參考。

摘要：通過對現階段移動端游戲互動式h5廣告的發展現狀介紹、對具體案例進行深層次的分析思考，為移動端游戲互動式H5廣告提供有效的設計策略。通過用戶體驗的感官體驗、情感體驗、思維體驗、行為體驗、關聯體驗要素來分析具體游戲互動式廣告的案例進行研究。得出適合移動端游戲互動式H5廣告的具體設計策略。該方法從用戶的體驗角度出發，從而更好地突出品牌化設計理念和人性化用戶體驗。

關鍵詞：H5廣告;游戲互動式;體驗

H5廣告是依托于HTML5技術而實現的移動端網頁廣告。在國際上沒有出現此類名稱，而是國內比較流行的說法，是方便用戶記憶和理解的。HTML5廣告是從2014年興起，與傳統廣告不同的是，HTML5廣告融合了視覺、技術、文字、動畫效果、音效效果、視頻等多個維度豐富的設計表現形式，并通過微信、微博等社交公眾平臺信息和宣傳活動以及結合有趣的交互方式來帶動用戶參與到品牌宣傳的中。

一、H5廣告在國內的發展現狀

“圍住神經貓”的這款H5小游戲自2014年7月在微信朋友圈傳播開來，3天就突破了上億點擊量。HTML5廣告自此在移動端廣告界成為商業活動中最重要的營銷模式和營銷手段。經過4年的發展和變化，2018年2月，北京草莓音樂節互動式HTML5廣告再一次刷爆朋友圈，北京草莓音樂節完美利用了移動優先、產品社會化、交互趣味化的三大優勢在微信平臺引發病毒式的分享行為，成功地向廣大群眾宣傳了草莓音樂節的品牌文化，以及讓所有大眾都有一顆rock的心，每個人在草莓音樂節都可以很酷，成為了引人側目的行業熱點。

二、游戲互動式H5廣告

（一）互動式H5廣告的表現形式。微信互動型HTML5廣告大致分為四種表現形式：游戲互動式，符號動態頁面，交互式動畫和功能性交互式頁面，廣告方可以選擇不同的互動類型來適應自己的品牌需求。游戲互動式廣告在于游戲互動的趣味性設計，用游戲化的方式讓用戶沉浸其中，以使用戶忘記廣告信息。將廣告宣傳信息融入到游戲中去，讓超強趣味的游戲吸引用戶的眼球，可以讓用戶自動瀏覽廣告信息。符號動態頁面可以利用頁面中的文字、logo、圖形等頁面變化及刺激其他感官的效果來提高與用戶的體驗，符號動態頁面類似于PC端的幻燈片形式，因為其簡單的傳達方式被廣泛使用。交互式動畫廣告類似于動畫，但是還具有豐富的交互方式，能夠更加直接地通過交互手法表達廣告信息以及品牌文化元素，具有較高的商業價值。功能性交互頁面是將其變成傳達信息的一種傳播方式，在宣傳活動時可以兼顧后臺報名，整理數據等功能，能夠滿足大眾的基本需求，促使大眾二次使用此功能，達到持續不斷的傳播效果。（二）游戲互動式H5廣告優勢。游戲互動式H5廣告是移動端H5廣告的表現形式之一，本質是利用游戲化的思維來解決廣告信息的問題。對于增加用戶黏性游戲化的互動體驗擁有絕對優勢。以游戲化的方式作為根本，讓用戶在觀看或者體驗的過程中不自主地進入廣告主設的游戲中去，以此來增加用戶對廣告的友好度，并且避免了用戶對廣告的抵觸情緒。除了用游戲的方式來吸引用戶之類，很多廣告主還會在H5廣告中增加故事情節，以故事的形式帶動用戶增強代入感，讓用戶能夠參與廣告內容的個性化游戲方式，極大地增強了用戶的選擇性和游戲自主性。（三）游戲互動式H5廣告的體驗層次分析。1.感官體驗。在廣告中，多重的感官體驗可以引起用戶的情感，這對于品牌形象的建立，深化用戶的品牌記憶非常重要。移動端游戲互動式H5廣告的感官體驗主要是視覺、聽覺元素，通過圖形、色彩、版式、音效等元素營造良好的視聽感受，讓用戶興奮滿意、從而產生共鳴。《創造「我」的草莓音樂節》是以標題讓用戶產生自我意識從而引發用戶的好奇心。首屏是類似于“臉萌”的人物選擇頁面，靜態的圖文形式加載較快，可緩解用戶的等待耐心。用戶的注意力很容易受到移動場景的變換而分散，《創造「我」的草莓音樂節》如圖1所示，采用視聽結合的方式，產生臨近感，方便用戶用視聽兩種感官隨時切換并加深感官體驗層次。2.情感體驗。隨著社會的不斷發展，用戶除了注重產品的性能和特點，更看重產品或服務給自己帶來的附加值，也就是找到產品、服務、廣告與自己情感的一種共鳴，這會深深影響受眾對廣告、產品和服務的評價及選擇。圖2中《2018汪年全家福》中的亮點是H5人物制作，并且可以裝飾自己的家，人物制作的每個部分都有幾十種的選擇，可供用戶制作生成完全不同，各具風格的人物形象，讓用戶在體驗的過程中感受到自己是在為過年裝飾自己的家，增強用戶的存在感及代入感。3.思維體驗。很多H5廣告都是強行給用戶輸入品牌活動或者信息，都是單向性的傳播，很少有用戶會去轉發傳播，而寶馬的H5廣告如圖3所示，摒棄傳統的圖文展示方式，以場景模擬這種創意因其用戶的興趣分散，極大的廣告通過「我」這個標題極大地吸引了用戶關注，用戶被這種創意有趣帶來的新鮮感激起了用戶的興趣。集中用戶的注意力，使思維更具創意，在思考后對寶馬的全新產品有了更好的認識，這就是營造思維體驗的目標。4.行為體驗《紀念哈利.波特20周年》中如圖4所示，是通過動作交互和圖像交互來增強用戶與廣告之間的行為交換動作，用戶可通過點擊、上下滑動的手勢自然完成，并根據用戶的行為進行圖像交互，產生圖形圖像間的交互行為。用戶在滑動、點擊的同時，文字便會有破碎、移動等效果，這就使用戶親身參與到廣告之中，幫助用戶更好的理解廣告的內容信息。5.關聯體驗《創造「我」的草莓音樂節》選擇在微信朋友圈中做爆款H5廣告，首先，定位人群受眾在青年中，用戶將自己與自己所喜歡參加的音樂節聯系起來，既可喚起用戶的歸屬感，還可以讓用戶在社交圈分享轉發，吸引更多的年輕用戶，營造溝通互動的環境，形成共識。

三、游戲互動式HTML5廣告的設計原則

（一）互動多樣原則。移動端廣告相比于傳統廣告最大的區別是交互方式，不同的交互方式和方法會促使用戶轉被動為主動，讓用戶從“接收者”中跳出來，轉而變為“創造者”。如上文中介紹的《紀念哈利.波特20周年》中采用了文字隨屏幕傾斜，滑動屏幕文字破碎，自行畫符咒等互動手段，帶領用戶進入真正的魔法世界，該H5以全新的互動形式在朋友圈中刷屏式的出現，形成極大的傳播量。（二）感官平衡原則。游戲互動式H5廣告依靠HTML5技術來模擬交互游戲的場景，體驗經濟的到來促使我們也不僅僅只是通過眼睛來單方面的觀看廣告，而是通過多感官（視覺、聽覺、觸覺等）來實現游戲環境中的交互行為，讓用戶自然地融入到廣告中去。所以基于多感官的設計因素，設計廣告不能單單重視視覺畫面，還要兼顧聽覺，運動覺，神經覺等感官知覺，全新BMWM2預售的H5如圖3所示，在點擊車這個圖案時有發動機的有震動反應，并且伴隨著聲音提示來代表已完成操作，因為其他感官的感知在游戲互動式H5廣告中其也同等重要，通常品質感、體驗感較好的游戲互動式H5廣告中都少不了全方位的感知效果。（三）簡化層級原則。移動端科技的發展讓廣告信息發生了巨大的變化，不同的數字傳播方式有著不同的特性，同樣也就意味著有著不同廣告分級方式。現階段H5廣告微信朋友圈中傳播的，而朋友圈內頁面分級是呈直線分級的，對于廣告信息的閱讀及交互方式只能通過少量的按鍵進行線性選擇。應該在設計之前抓住用戶的認知心理特征，邏輯嚴謹的構建整個廣告的框架和層級，明確視覺導向流程，為了方便引導用戶體驗，可增加些動效形式來凸顯信息的重要性。在2018汪年全家福的H5廣告中利用簡潔一段式選擇界面，選擇性別，選擇衣服，生成自己的海報這種在同一頁面內線性的方式很容易操作，更容易使用戶適應。（四）品牌融入原則。商業廣告的創新重點即是將廣告主的品牌文化嵌入到廣告中去，品牌文化的不同，可以促使更多不同新奇的創意設計，讓廣告融入到設計中去，使二者完美融合。首先，從宏觀因素來說，廣告中的主題及色彩應該融入品牌的代表性元素，如2018草莓音樂節中以其代表性草莓作為等待頁面，讓品牌元素融入H5廣告中，這是廣告創新的關鍵；第二，依據品牌的視覺識別系統，廣告中的視覺效果應與之相符合，這樣更容易加深用戶對品牌的認識，草莓音樂節在2018年的對外輸出形象依舊是草莓，所以在每個頁面中，都有體現strawbeery的logo，并且主題背景選擇的也是今年的主題色明黃色；第三，區別于其他競品的關鍵要素就是視覺的差異化，所以要做大量的競品分析，總結競品的品牌定位，以及對外的視覺產出，分析用戶對于該品牌的視覺印象。規避相似的視覺形象，得出最貼近自己品牌且區別于其他競品的視覺風格。迷笛音樂節和草莓音樂節是競品，但迷笛音樂節給大眾的印象是黑綠色為主的品牌形象，草莓音樂節則是草莓星球的各種衍生品，它把握住了具有強烈代表性的草莓符號元素，基于草莓元素衍生出一系列草莓音樂節產品，這種設計再次加深了用戶對品牌的印象。

四、游戲互動式廣告的設計策略

（一）運用多交互手段提高用戶粘性。交互形式不僅局限于視覺、聽覺上，還應通過多感官體驗來實現游戲環境中的交互行為，比如重力感應、體感控制、拍攝功能等多種互動形式的整合，多感官并行的體驗模式既可以增加廣告的趣味性，又可以提高用戶對此廣告的黏性。然而用戶黏度正是品牌忠誠度的重要支撐依據，用戶參與度和留存度是用來評價用戶黏度的評判標準，同時與用戶的轉換成本成正比，交互元素的多少對用戶黏性產生至關重要的影響。一個有趣的交互方式或者互動形式，會讓用戶有情感和行為上的交流，讓用戶有身當其境的感受，這就增加了用戶黏度。H5廣告的互動體驗形式可以為品牌在產品之外增加樂趣，讓用戶對品牌的忠誠度再次增加。（二）增加故事情節，提升用戶代入感。游戲互動式H5廣告需提高廣告的故事情節設計，讓用戶與H5廣告產生互動性的參與性設計。超強的代入感需要多感官體驗的融合，另外，還需結合該品牌產品的特殊性來設置互動的方式，提高用戶體驗效果。如圖5所示，2018草莓音樂節年度主題「我」用戶可通過生成自己的形象，形成自己獨具一格的入場券，使用戶身臨其境。類似于曾經的變裝小游戲中選擇自己喜歡的服飾配飾，根據自身的形象選擇自己的搭配，讓用戶感到這就是我的形象，提高游戲的代入感。（三）提升HTML5技術以實現更好的用戶體驗。H5廣告不僅有基本的圖文功能，還有更高的技術來實現更好的用戶體驗，如搖一搖、重力感應、場景模式等多種互動方式。以此來營造更加豐富的互動形式來增強用戶體驗。但是并不能過度重視互動形式，忽視最該關注的戰略層及范圍層，這是一種本末倒置的行為。H5廣告應該在戰略層范圍層結構層都合理的范圍內，合理地運用交互手段，以此為用戶提供有邏輯有內容有趣味的H5廣告在。探索更多的HTML5技術，從而實現更多不同的交互形式及手段，如圖6所示，可以用過屏幕畫符號讓屏幕的圖形動起來，可以突破屏幕瀏覽的界面，實現重力感應等方式。（四）定準目標人群，提高投放精準度。H5廣告之所以能瞬間成為爆款，或者說能被用戶所熟知，絕大部分是源于精準的投放力度，將目標用戶群體的用戶畫像以邏輯思維導圖的方式整理出來，比如，目標用戶群里的年齡段、經常使用的聊天軟件、所搭乘的交通工具、活動范圍等。根據不同的目標人群，設計不同風格的游戲互動型H5廣告。2018年草莓音樂節的主要目標人群是18-30歲，熱愛音樂，個性十足的年輕人，所以H5廣告會選擇游戲互動型的形式，且完全滿足了個性十足的用戶來自己搭配自己所獨具一格的穿搭方式。

在這個移動時代，數字媒體已是主流，游戲互動式HTML5廣告為了更好地提升網絡廣告的質量，幫助企業和品牌的宣傳，完善用戶體驗。但是僅從游戲機制的創新是無法從根本上實現創新發展。要合理利用用戶的情感以及其心理規律，從而打造出契合品牌本身的表現形式來打動用戶，最終實現藝術價值和商業價值的統一，更有利地推廣和服務于品牌。

作者:張耿 項洋 單位:大連理工大學建筑與藝術學院