摘要：基于HTML5（以下簡稱“H5”）的交互漫畫表達(dá)方式仍以故事漫畫為主體，但它融合了游戲、交互設(shè)計(jì)、音效、漫畫等諸多元素，加深了用戶的沉浸感，創(chuàng)造出了新穎的互動體驗(yàn)?；贖5的交互漫畫具有H5交互頁面的諸多優(yōu)勢，它是目前移動端最流行的傳播形式，具備快速、即時(shí)的傳播屬性，在應(yīng)用領(lǐng)域，尤其是傳播和營銷方面具有極大的研究價(jià)值。文章闡述了交互漫畫的概念、類型、特點(diǎn)及應(yīng)用領(lǐng)域等，通過對H5交互漫畫實(shí)例分析，探索其發(fā)展現(xiàn)狀及存在的問題，并提出相應(yīng)對策。

關(guān)鍵詞：HTML5;交互漫畫;交互設(shè)計(jì);交互體驗(yàn)

隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展，手機(jī)、平板電腦等移動媒體的普及，漫畫逐漸從傳統(tǒng)的紙媒轉(zhuǎn)移到了電子媒介上，可以適配不同設(shè)備的數(shù)字漫畫如春后竹筍般迅速發(fā)展起來。那么什么是交互漫畫呢？交互漫畫的類型和特點(diǎn)有哪些？目前H5交互漫畫的發(fā)展現(xiàn)狀如何？存在哪些問題？解決問題的對策有哪些？

一、交互漫畫概念界定

交互漫畫集“閱讀、觀看、互動”于一身，可以說是“漫畫元素+電影元素+游戲元素”的集合體[1]。它不但保留了傳統(tǒng)漫畫元素如對白框、旁白文字、畫格、空間留白（即畫面中可省略的虛景）等，還添加了電影元素如動態(tài)特效、音樂音效、鏡頭效果等，更利用了與時(shí)俱進(jìn)的計(jì)算機(jī)技術(shù)增加了交互性的游戲元素，用戶通過點(diǎn)擊、長按、移動、拖拽等動作與故事里的角色進(jìn)行交互，在原有的漫畫故事情節(jié)上增加游戲獨(dú)有的支線劇情，大大豐富了故事性，使讀者“可賞可玩”，充分調(diào)動了閱讀的積極性和趣味性。

但是，很多人會把以視頻為載體的動態(tài)漫畫誤認(rèn)為交互漫畫。這種動態(tài)漫畫制作成本低廉，觀賞體驗(yàn)差，僅僅只是在原有的靜態(tài)漫畫基礎(chǔ)上添加影視特效，利用鏡頭運(yùn)動使畫面產(chǎn)生位移、縮放、景深等效果，再配上音樂、音效、配音等，很長一段時(shí)間深受動漫愛好者的厭棄。而交互漫畫以讀者為中心，突出的是讀者與漫畫故事之間的交互行為，由讀者掌握閱讀故事的節(jié)奏等，它提高了用戶的閱讀體驗(yàn)，給用戶帶來沉浸感。

二、H5交互漫畫類型及特點(diǎn)

隨著手機(jī)閱讀的流行和H5的快速發(fā)展，國內(nèi)H5交互漫畫領(lǐng)域呈現(xiàn)出了多種形式，主要可以分為以下三種：

1.觸發(fā)互動型

這類交互漫畫以敘事為目的，根據(jù)用戶操作觸發(fā)畫面的一些特定動態(tài)效果，如點(diǎn)擊、拖拽、上下或左右滑屏等，從而實(shí)現(xiàn)畫格間的巧妙切換，推動故事的發(fā)展。常見的觸發(fā)互動型交互漫畫多以動態(tài)長圖的形式呈現(xiàn)，主要特點(diǎn)是基于H5制作動畫、交互效果，輔以音樂、音效或配音，制作景深效果或模擬鏡頭運(yùn)動（推、拉、搖、移）吸引讀者的注意力，給讀者帶來沉浸感。其敘事過程的核心是交互，讀者在手機(jī)上完成每一個(gè)交互，便可進(jìn)入故事的下一個(gè)情節(jié)或場景。典型案例包括由網(wǎng)易知道和網(wǎng)易沸點(diǎn)工作室聯(lián)合出品的《失蹤青年章瑩穎》、東南大學(xué)招生辦公室出品的《東南大學(xué)2019級英雄帖<此間的江湖>》、CGTN出品的《五四精神永存》等。

2.視頻互動型

視頻互動型交互漫畫顧名思義，表現(xiàn)形式主要為漫畫風(fēng)格的視頻或動畫，區(qū)別在于有的是自動播放，有的是點(diǎn)擊相應(yīng)按鈕后開始播放視頻。這類漫畫要求視頻或動畫基于漫畫故事的情節(jié)巧妙與合理的交互元素相結(jié)合，畫風(fēng)及動態(tài)效果表現(xiàn)力強(qiáng)，讀者根據(jù)故事內(nèi)容選擇不同的選項(xiàng)，從而切換場景或推動故事情節(jié)的發(fā)展，因此又被稱為“視頻+選項(xiàng)答題類”H5。典型案例包括由貨拉拉出品的《未來人類面對的最大危機(jī)竟是……》、百度出品的《你不是一個(gè)人在對抗這復(fù)雜的世界》等。

3.游戲?qū)蛐?/p>

游戲?qū)蛐徒换ヂ媽⒂螒虻拈_放性和漫畫的敘事性巧妙地結(jié)合在一起，既給讀者呈現(xiàn)了漫畫的故事情節(jié)，又給讀者提供了互動類游戲操作部分，通過引人入勝的劇情推動玩家繼續(xù)玩下去。它的游戲特性非常突出，使讀者可以在不同身份之間進(jìn)行切換。當(dāng)玩家閱讀故事背景時(shí)，是以讀者的身份接受信息;當(dāng)玩家結(jié)合環(huán)環(huán)相扣的劇情進(jìn)行探索解謎、角色扮演、測試答題時(shí)，是以故事里的角色參與到游戲中，有時(shí)甚至可以決定故事的走向。這類交互漫畫的典型案例包括由奇跡暖暖出品的《穿越千年的奇跡》、億眾互動出品的《情人節(jié)謀殺案》等。

三、交互漫畫發(fā)展現(xiàn)狀、問題及對策

近幾年，我國動畫電影發(fā)展迅猛，動漫市場也越來越廣闊，隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展和閱讀媒介的改變，越來越多交互漫畫層出不窮，但從技術(shù)實(shí)現(xiàn)和用戶體驗(yàn)角度來說，讓人過目不忘的作品卻鳳毛麟角。但是，基于H5的短篇交互漫畫在國內(nèi)卻越來越流行，因?yàn)镠5頁面是目前移動端最流行的傳播形式，具備快速、即時(shí)的傳播屬性，這種極強(qiáng)的傳播能力使它在移動端的營銷特性非常突出，能夠帶來巨大的社會效益和經(jīng)濟(jì)效益。因此H5交互漫畫被廣泛應(yīng)用于影視宣傳、廣告宣傳、在線營銷、品牌推廣等，可以說是“漫畫類型宣傳H5”。 通過H5交互漫畫實(shí)例分析，目前存在如下問題：

1.交互設(shè)計(jì)與故事情節(jié)脫節(jié)

交互漫畫里的交互設(shè)計(jì)本質(zhì)是為了加強(qiáng)故事效果，當(dāng)動畫特效生硬，交互形式及特效加成與故事情節(jié)無關(guān)時(shí)，讀者就會感受不到漫畫故事的內(nèi)涵，這種與故事情節(jié)脫節(jié)的交互設(shè)計(jì)也就難以完整、清晰地表達(dá)故事主題。那么怎樣的交互設(shè)計(jì)才算是融入故事情節(jié)呢？舉例來說，根據(jù)劇情的需要，當(dāng)故事里的主角需要借助“外力”進(jìn)行下一步行動時(shí)，或者需要一些語言刺激改變思想或行動時(shí)，讀者通過扮演這個(gè)“外力”，幫助或鼓勵主角做一些小小的行動，既推動了故事情節(jié)的發(fā)展，又體驗(yàn)了主角的情感，還加深了讀者的沉浸感。

此外，根據(jù)漫畫故事主題的不同，融入故事情節(jié)的交互設(shè)計(jì)方法也會不同。以偵探懸疑類漫畫為例，依托漫畫場景的全景模式設(shè)計(jì)，讓讀者化身為故事里的偵探，基于故事劇情的發(fā)展自主尋找線索、搜集資料、詢問證人、訊問嫌疑人等，從而查出真相，指認(rèn)犯人。這與傳統(tǒng)漫畫最大的區(qū)別是改變了其敘事結(jié)構(gòu)及手法。一般來說，傳統(tǒng)的靜態(tài)漫畫主要采用線性敘事手法，一般有頭有尾有序，也許會采用倒敘和插敘等來服務(wù)故事主線。而這種偵探懸疑類交互漫畫采用的是非線性敘事，充滿了隨機(jī)的趣味性和神秘感，它由用戶來決定尋找線索搜集資料、詢問證人等的先后順序。這要求故事的敘事結(jié)構(gòu)本身是多線的，即使時(shí)間的連續(xù)性被模糊了，也不會影響故事的主線，讀者仍然能夠理解和接受。

2.交互設(shè)計(jì)大同小異，缺乏原創(chuàng)性

基于不同的漫畫故事情節(jié)，每一種交互設(shè)計(jì)應(yīng)該都是獨(dú)一無二的。但是，有不少H5交互漫畫隨意套用模板，給讀者帶來乏味、老套的交互體驗(yàn)。隨著H5交互應(yīng)用的普及，毫無創(chuàng)意的交互設(shè)計(jì)越來越難以滿足用戶的需求，更加新穎、復(fù)雜的玩法和更有深度的交互體驗(yàn)是未來H5交互漫畫面臨的挑戰(zhàn)。

目前，H5常見的交互方式包括點(diǎn)擊交互、連擊交互、長按交互、長圖視差交互、拖拽交互、雙屏交互、懸浮、搖一搖等。以觸發(fā)互動型漫畫為例，可以根據(jù)漫畫故事劇情合理設(shè)計(jì)交互方式的組合形式，比如在長圖視差交互中，讀者通過滑動屏幕觸發(fā)劇情里的某個(gè)人、某個(gè)動物，甚至某個(gè)物品，配合恰當(dāng)?shù)囊粜В瑢?shí)現(xiàn)獨(dú)一無二的轉(zhuǎn)場效果，渲染與之匹配的情感氛圍。如果主角需要聚集某種情感或某種能量等，可以通過長按交互實(shí)現(xiàn)這一劇情，從而增加用戶的參與感。

如果想要更進(jìn)一步加強(qiáng)交互設(shè)計(jì)的創(chuàng)新感，給讀者創(chuàng)造新穎的互動體驗(yàn)，就需要嘗試和探索如何將快閃、一鏡到底、VR 全景、模擬界面、重力感應(yīng)等高級動效融入漫畫故事的劇情中，這類交互設(shè)計(jì)技術(shù)實(shí)現(xiàn)難度大，仍在不斷發(fā)展中。此外，H5案例目前主要集中在觸控交互，也許未來隨著技術(shù)的發(fā)展，手勢交互和語音交互也會被廣泛應(yīng)用其中。

3.交互設(shè)計(jì)不合理，降低用戶體驗(yàn)

當(dāng)讀者閱讀漫畫時(shí)，不論是紙媒漫畫還是交互漫畫，讀者更傾向于自己掌控閱讀的速度和思考的節(jié)奏，或停留思考、或翻頁前進(jìn)、或后退品味，這是漫畫作品賦予讀者掌控故事發(fā)展節(jié)奏的特權(quán)，是讀者的一種閱讀習(xí)慣及享受。當(dāng)交互設(shè)計(jì)忽略這一優(yōu)勢時(shí)，就是在降低用戶體驗(yàn)。

4.加載時(shí)間長，交互過程卡頓

目前，市面上關(guān)于H5的制作軟件層出不窮，選擇合適的制作工具是H5交互漫畫制作的保障。越來越多的H5交互漫畫都是基于零代碼、可視化界面操作的H5制作軟件進(jìn)行制作，但是，如果素材處理不到位，選用的H5制作軟件不恰當(dāng)，完成的H5交互漫畫效果就會不好，比如加載時(shí)間過長，交互卡頓，交互體驗(yàn)單一無趣等。國內(nèi)現(xiàn)有的H5制作軟件主要分為兩大類，一類是傻瓜型H5制作軟件，主要包括人人秀、易企秀、MAKA、兔展、iebook、Mugeda、微頁等，操作簡單，只需簡單地拖拽素材進(jìn)行組合，即可完成H5制作，但其功能不完善，制作效果不好，無法實(shí)現(xiàn)復(fù)雜的交互設(shè)計(jì)制作。另一類是專業(yè)級H5制作軟件，雖然操作難度較大，但功能全面，用戶可以編寫代碼，能滿足個(gè)性化交互設(shè)計(jì)需求，主要包括意派Epub360、iH5、iVX。

結(jié)語

基于H5的交互漫畫通過交互的新穎性和刺激感吸引了讀者，雖然其表達(dá)方式仍以故事漫畫為主體，但它融合了游戲、交互設(shè)計(jì)、漫畫等諸多元素，加深了用戶的沉浸感，提高了用戶的閱讀體驗(yàn)。同時(shí)，它的傳播范圍廣、傳播速度極快，在沒有任何商業(yè)推廣的情況下，僅靠自傳播，日點(diǎn)擊量輕松破萬。因此，藝術(shù)多樣性的H5交互漫畫具有持續(xù)性消費(fèi)價(jià)值，在應(yīng)用場景、營銷推廣、商業(yè)模式的拓展上，尤其是在傳播和營銷方面具有極大的研究價(jià)值。但是，探其形式本身，交互設(shè)計(jì)是其核心。因此，如何創(chuàng)作出與故事情節(jié)、主題和表現(xiàn)形式相符的新穎的交互設(shè)計(jì)，突出漫畫人物風(fēng)格，快速有效地吸引讀者，為用戶帶來美好的視覺效果和極佳的交互體驗(yàn)，是未來交互漫畫面臨的挑戰(zhàn)。

參考文獻(xiàn)：

[1]徐智，李四達(dá).交互漫畫的發(fā)展及趨勢研究[J].藝術(shù)與設(shè)計(jì)（理論），2018（3）：72-73.

[2]莫葵鳳，鄭小軍，楊上影.游戲型微課設(shè)計(jì)：現(xiàn)狀、問題及對策——以H5平臺交互設(shè)計(jì)為例[J].中國教育信息化，2019（7）：11-15.

[3]國天依，孫立軍.交互漫畫，突破傳統(tǒng)表現(xiàn)維度[N].中國美術(shù)報(bào)，2020（5）.

[4]陳雷.從動態(tài)漫畫的興起看信息時(shí)代下動漫形式的發(fā)展趨勢[J].裝飾，2014（12）：19-21.

作者簡介：

周萍（1989年-），女，漢，湖南邵東人，工程師，碩士，研究方向：多媒體交互設(shè)計(jì)。