基于“大廣賽”的H5課程教學研究

加曉軍（廣東海洋大學寸金學院，廣東 湛江 524000）

一、什么是H5？

隨著移動互聯網時代的到來，給傳統廣告行業帶來了巨大的沖擊。“H5”這個新詞最早出現于2014年，并迅速成為互聯網行業的“熱詞”。對于H5的認識，需要具備部分網頁設計的理論基礎，網頁設計中的HTML，即Hyper Text Markup Language，中譯為：超文本標記語言。它是由萬維網聯盟（World Wide Web）發明的一套網頁標記語言規范，作用是為了標記我們在網頁中可視的所有元素及其布局裝飾等。一個完整網頁，通常是由HTML、CSS、DIV、JavaScript共同編寫完成的，如果我們把網頁比喻成一個人的話，DIV就是人體的骨骼，HTML就是人體的血肉，CSS就是人身上穿著的衣服及裝飾，JavaScript就是人的各種動態動作。

隨著時代發展，HTML經歷了多次的新換代，至2014年10月，完成了第五代超文本標記語言的全新升級，即HTML5，它也成為了適用于幾乎所有電子設備的語言，這也奠定了它在移動互聯網時代堅實的地位。

但如果簡單的認為HTML5就是H5，并不是很嚴謹。嚴格來說，H5的確包含著HTML5的中的諸多內容，但H5所包含內容更廣泛，二者并非可以劃等號。H5只是一個本土詞匯，它廣泛融合了HTML5以及文本、圖片、聲音、動畫等諸多內容，簡言之，H5是可應用于包括PC、移動、平板、等端口的超媒體移動網頁。搞清了H5的定義，我們接下來應該了解的是國內高校對于H5教學的現狀，在大學教育滯后于社會發展的現狀之下，毫無疑問，H5的教學在全國高校范圍內還處于起步階段，在H5的教學方面需要大量的實踐探索。

二、全國大學生廣告藝術大賽作品類別分析

全國大學生廣告藝術大賽是由教育部高等教育司主辦的設計類學生能夠參與的重要賽事，也是重要的大學生教學實踐平臺之一。至今已成功舉辦11屆，參賽作品分為平面類、視頻類、動畫類、互動類、廣播類、策劃案類、文案類、營銷創客類、公益類九大類。大賽旨在提高大學生的創新精神和實踐能力，激發大學生的創意靈感，促進大學新聞傳播、廣告、設計、藝術教育的人才培養模式的改革，同時對于課程設置、教學內容和方法的出新起到了推動作用，極大地提高了大學生的動手能力、實踐能力、策劃能力和綜合能力。

2016年第八屆全國大學生廣告藝術大賽的作品類別相較于往屆有了細微調整，其中一個明顯變化就是增加了互動類廣告，這也體現了大廣賽“促進教改、啟迪智慧、強化能力、提高素質”的大賽宗旨。互動類廣告的主要作品形式就是我們所探究的H5，對于H5的認識，教師需要走在前面，并需具備過硬專業能力。

對于大廣賽的諸多命題單位來說，不論是視頻、平面、動畫、廣播、創意文案、策劃案等廣告形式還是互動類的H5，其目的都是針對產品的廣告表現，而H5這一廣告形式區別于其他廣告類型的一個重要的特點就在于它的交互性，因此，對于這一形式的廣告設計創作，需要在綜合其他必要因素的基礎上注重其互動性。除此之外，H5這一新的廣告形式具備很強的綜合性，一支完整的H5廣告包括：文字、圖形、插畫、聲音、動畫等內容，這就要求學生具備良好的圖形表達，手繪，文案創作、聲音處理、動畫制作、交互設計等諸多專業技能。這些都還是建立在學生對命題深入了解、對目標訴求準確把控的基礎上，因此，這對教師來說無疑是個巨大的挑戰！

三、基于“全國大學生廣告藝術大賽”的H5教學方法

1.教學目標

H5課程為視覺傳達設計專業開設的最新課程，對于該方面的教學實踐案例和方法可借鑒的較少，此外，其涉及內容較為綜合，實踐性較強。在具體課程教學實踐環節中，很難將冗雜的內容一一進行深入介紹，也難以讓學生深入進去。

對于這樣一門綜合性較強的課程來說，首先需要具備相對適當的課程時長，以此來保障課程各部分內容的有效進行，因此，建議學時為80。

2.教學思路

對于視覺傳達設計專業的學生來講，獨立完成這樣綜合型較強的作品存在一定困難，因此需以創意、文案、視覺、交互四個環節將學生進行精細分組，每組4人，學生需具備其中一項或多項專業能力，這樣就避免了在作品的創作過程中個人單獨作戰的困境，同時也鍛煉了學生的團隊協作能力。

其中，各個環節的課時分配分別為：理論課時10、創意課時10、文案課時10、視覺課時20、交互課時20，在對往屆大賽同類作品的分析中不難發現，優秀的作品在創意的高度、畫面的精細度、色彩的和諧度、文案的深度、互動的表現等任何一方面均精益求精，作品整體氣質也較為突出，欣賞作品的做成中既與觀者產生互動又引人深思。

3.教學內容

理論課程：本課程的理論講述環節至關重要，如何聯系實際將H5的概念描述，發展進程，重要性，應用范圍，制作方法，制作流程，制作規范等內容有效的傳遞給學生是該環節的重中之重，學生對于該部分內容的深入理解和掌握也直接影響著后續教學的效果。

創意課程：對于H5來說，它的實質就是一種廣告形式，我們可以理解為互動廣告，它的互動性也正是它區別于其他廣告形式的重要屬性。因此，本環節的關鍵點在于為學生系統的補充廣告的創意構思方法以及產品作為廣告核心的重要思路。并需對大廣賽歷屆互動類等級作品進行廣泛分析的基礎上，將傳統廣告創意法與H5廣告的交互特征進行聯系，總結創意如下：①使用產品前后對比/與同類產品進行類比并得出結果；②產品本身是圖案；③講故事；④設置選項；⑤讓產品基本信息變得有趣；⑥將產品進行擬人化處理。

文案課程：對于一支廣告來說，文案的重要性不言而喻，精彩的文案具有“一語勝千言”的神奇魔力。因此本部分內容對廣告文案的基本構成，寫作原則，寫作方法等內容進行詳細闡述，并對學生進行有效的信息傳遞。廣告文案是由標題、廣告正文、廣告口號和隨文組成的。它是廣告內容地文字化表現。在廣告設計中，文案與圖案圖形同等重要，圖形具有前期地沖擊力，廣告文案具有較深地影響力。同時，廣告文案還具備準確規范 點明主題、簡明精煉 言簡意賅、生動形象 表明創意、動聽流暢 上口易記等特點。

視覺課程：對于視覺傳達設計專業的學生來講，在前期的專業學習中早已具備扎實的視覺設計能力，主要以文字、圖形、色彩、立體造型為基本要素，針對大廣賽品牌策略要求，構思滿足廣告訴求，符合廣告傳播目的個效力的視覺設計內容，因此本部分內容的完成需要具備扎實的視覺傳達藝術設計和應用表現能力，及符合H5設計規范的視覺設計要求進行講述。如：H5頁面常規尺寸根據人群分布來看，在安卓端的主流分辨率是1280x720像素，在IOS端的主流分辨率為1136x640，此外，針對大廣賽，H5廣告也有著特殊的尺寸規范和要求。

交互課程：全國大學生廣告藝術大賽對于互動廣告的具體要求是移動端（手機）H5互動廣告，因此，需要選擇符合社會需求的H5互動軟件來對學生進行強化訓練，引導學生了解H5設計制作的主流工具，本課程所介紹的工具為iH5（互動大師），它可以很好的支持全景、一鏡到底、動畫、游戲等各類功能型，展示型作品的制作，并可支持各種移動端設備和主流瀏覽器且操作便捷易上手。該部分內容需詳細介紹H5的設計流程、設計方法等內容，秩序和規范是進行系統化工作的保障，不管是門類眾多的產品設計，還是形式多樣的廣告設計，他們都有著不同的設計規范和設計流程，H5廣告業同樣如此。

課程中，我們應該系統性的講解H5設計究竟要經歷幾個具體環節？究竟要側重幾個設計要點？究竟要用到那些主要工具和輔助工具？究竟需要學習哪些專業知識？H5的設計因為包含了太多門類，所以在設計方法的總結上有著較大的難度，對于一個全新的媒體形式來說，再全面的方法技巧也不能應用于所有作品案例中。為了能讓學生真正學到有效的設計方法，我們可將H5的設計要點總結為：原型圖繪制，內容信息表達，版式設計編排，文字設計，動效設計，音效設計等關鍵步驟，H5廣告設計并非單純的視覺設計，它整合了視覺，聽覺，觸覺（交互）三大板塊，它是“數字媒體設計”的基礎，也是超媒體在移動互聯網時代的社會化呈現。對于傳統平面設計者來說，轉變這個觀念并非易事，它需要跳出以往固有的觀念，這對教學工作者來說是個巨大考驗。

結語

對于本門課程的學習需要緊密聯系市場，在2015-2016這兩年間，移動互聯網行業中出現了大量以H5為主要表現方式的移動端網站。可以說，它們用全新的體驗方式改變了我們對網頁和內容傳播的認識。好方法總結需要建立在廣泛的優質作品分析基礎之上，我們需對行業內及大賽中所產生的，具有代表性的H5案例進行深入解讀和分析，剖析案例中精彩之處，反復學習和推敲，認真總結其設計手法。

全國大學生廣告藝術大賽為視覺傳達設計專業的H5課程教學提供了一個非常有意義的平臺，讓課程教學更加多樣化，同時也具有較強的針對性。以企業真實營銷項目作為命題，引導學生了解受眾，調研分析，提出策略，不僅可以充分的啟發學生思維，培養學生的創新表達能力，更使學生在此過程中對專業理論及技能的綜合應用能力的得以提升，同時也可時時檢驗我們的教學方案與教學方法是否合理有效，使教學更具創新性，這樣的實踐教學嘗試也為視覺傳達設計專業的發展與改革提供了良好的思路。