探索線性與非線性的數位敘事技藝：以互動性文本為例
A Study of Linear and Nonlinear Digital Storytelling Craftsmanship
─ An Interactive Context for Example
劉俐華* 蘇文清**
*東南科技大學 數位媒體設計系 專技助理教授 **國立臺灣師範大學 設計學系 教授摘 要
傳統的敘事透過口述語言、文字書寫及圖像傳達進行文本表述，當敘事進入數位的場域， 互動性和數位技術為敘事帶來語言、文字、圖像無法觸及的敘事表現。本論文藉由文獻探討 與互動文本案例分析，探討數位敘事的線性與非線性表現形態。遊戲理論與互動文本提供從 結構性概念，進行數位敘事分析的思考進路，本研究亦探討數位藝術的抽象空間理論，數位 圖像繪本的平面與空間敘事表現，並從上述研究推演出數位敘事的線性與非線性表現技藝。 研究發現，數位敘事打破了單一媒介的符碼限制，藉由數位敘事的技藝表現，可建立結合線 性、非線性、時間與空間感知的「拓樸敘事」，並藉由視覺、聽覺、觸覺及探索行為，達到 最貼近人類對於事物的自然認知，並改變接受者接受敘事或理解文本的方式，甚至脫離結構 性文本的意識形態灌輸。本論文最後提出線性與非線性數位敘事的類型，並分析創造數位敘 事的各種技藝表現形式，並以蘊含中華文化及在地特色的個人互動文本創作為例，提供後續 研究者或創作者在敘事研究或創作實踐上的參考。 關鍵字：數位敘事、數位文本、互動文本、數位技藝Abstract
When the narrative enters the digital field, interactivity and digital technologies make the narratives shift into new type of digital storytelling that could not be achieved by a narrative that uses language, text or graphics. Literature review of digital storytelling, examples of interactive context, game theory, linear and nonlinear narratives are discussed in this thesis. Digital storytelling is being developed into cross-media characteristics with digital craftsmanship that involve animation, sound effects and interactivity. The innovation of digital technology and media has also turned the narrative experience into overall sensation with visual communication, sound effects, and the simulation of human interactivities. They change the way we perceive narrative, provide the “topology narrative" perception, and help us disengage from the idea of structuralism. The thesis concludes with an analysis of varied techniques of digital storytelling that create linear and nonlinear type of narratives. In addition, researcher shows the interactive comic story “Inbetween” that contains Chinese culture and the local features of Taipei for reference.
壹、前 言
在軟體技術的進步和近年平板電腦與智慧型手機的普及，帶動行動閱讀的需求及數位內 容市場的快速成長，具有豐富的互動、影音及動態效果的繪本電子書亦在App商店內大量湧 現。數位內容載具技術的推陳出新，也帶來新的敘事及閱讀體驗，例如運用觸控進行閱讀， 或是藉由體感互動技術創作的體感漫畫故事。本研究為質性文獻分析研究，並針對互動文本 案例進行分析，研究者期望透過相關文獻理論與案例研究，探討數位敘事與數位技藝的表現， 並深入分析具有敘事意涵的互動性文本，藉此瞭解數位敘事的技藝表現，並提出互動性文本 的創作面向與市場應用可能性。貳、數位敘事理論
數位敘事（Digital Storytelling）指透過超連結、互動性、互動故事等數位媒介特性所創 作，帶有敘事意圖及互動性表現的文本（context），例如多媒體故事、遊戲敘事或是數位藝 術作品。學者張新軍（2008）、Chris Crawford（Crawford/葉思義譯，2005）及Ryan（2001） 等人分別從研究數位遊戲的角度，將遊戲中的敘事進行結構性的拆解與分類。張新軍（2008， 頁250）將故事的結構分為涉入性互動創作、限制性腳本故事及電腦即時生成的故事。Crawford 則將電玩遊戲的情節歸類成四種結構：（1）分枝樹結構、（2）收斂結構、（3）限制的故事、 （4）資料庫結構（Crawford/葉思義譯，2005）。此外，Ryan從循路設計觀點，分析出「樹枝 狀」、「流程圖」、「周圍分枝」、「隱藏的故事線」、「編辮子情節」、「迷宮」、「史詩般漫遊」、「網 絡連結」及「完全圖示」等九種具循路設計的互動敘事文本類型（Ryan, 2001, pp. 247-255）。 黃齡儀（2009，頁147）從時間敘事與空間敘事的觀點，將Ryan的九種互動循路設計，依單 向行進或多重迴路的敘事線設計，分成時間敘事與空間敘事兩種趨向。研究者將Ryan、 Crawford及張新軍等人所提出的敘事結構類型，補充至黃齡儀的數位敘事結構趨向圖，並改 編繪製如《圖 1》，並從數位敘事的線性與非線性結構概念，針對互動性文本進行案例蒐集 與研究（劉俐華，2014，頁72）。 圖 1 數位敘事結構趨向（劉俐華改編自學者黃齡儀繪製）一、趨向線性結構的數位敘事 具有線性因果敘事情節、呈單向行進、有獨立或多條敘事線的數位敘事，為偏向線性結構的 數位敘事，並具有單一或多個不同的敘事分支或結局，但皆為預先設定好的敘事路徑與情節，例 如《圖 2》限制性的故事架構，雖為單一行進的敘事軸走向，但在某些段落會安排謎題挑戰，或 是播放劇情動畫，待動畫播完或解謎完成後，敘事便能繼續往下推演。黃齡儀將Ryan的樹枝狀、 流程圖與周圍分枝等三種具單向性行進的敘事結構，同列為偏向線性時間的敘事結構，在樹枝狀 的結構中，節點的選擇能左右敘事結局，黃齡儀認為是最具時間敘事屬性的敘事結構，而流程圖 （圖 3）雖然有多重路線選擇，但是主軸敘事結構仍為單向行進，Crawford的收斂型敘事亦有類 似的行進結構，是具有些微空間敘事特質的線性敘事結構類型（黃齡儀，2009，頁147）。 圖 2：限制性的故事架構（Crawford/葉思義譯，2005，頁 130） 圖 3：流程圖敘事結構（Ryan, 2001, p. 252） 二、趨向非線性結構的數位敘事 具有涉入參與、即時生成、跳敘等非線性敘事意圖，或是呈現多重迴路敘事線的數位敘事， 為非線性結構型態。涉入性互動敘事例如角色扮演遊戲，而模擬城市、模擬人生或超文本敘事等， 是藉由電腦的互動技術、參與者的涉入互動所產生的即時生成故事，是一種後設敘事的型態（張
新軍，2008，頁250）。黃齡儀將Ryan的完全圖示、網路連結、史詩般漫遊及迷宮等四種敘事結 構歸納為非線性空間敘事，這四種敘事結構的共同特性為多重迴路的設計，並提供使用者自由選 擇敘事走向的權力。在這四種敘事類型中，完全圖示敘事結構（圖 4）擁有完全節點互通性，黃 齡儀認為是最趨向非線性空間的敘事（黃齡儀，2009，頁147）。 圖 4：完全圖示敘事結構（Ryan, 2001, p. 247） 三、具有線性與非線性結構特性的數位敘事 具有平行、隱性或重疊敘事設計的敘事結構，為線性時間與非線性空間敘事複合特質的數位 敘事。例如在《圖 5》隱藏的故事，使用者彷彿成為偵探，透過不同敘事路徑的探索與調查，憑 藉片段的敘事線索，自行拼湊或理解隱藏的故事（Ryan, 2001, p. 253）。黃齡儀認為隱藏的故事 及編辮子之情節，是結合時間與空間敘事特質的類型，其故事線的節點關係呈現多重迴路或多重 敘事線行進，借助讀者的探索理解，逐步建構單向行進的隱藏線性敘事（黃齡儀，2009，頁146）。 圖 5：隱藏的故事線（Ryan, 2001, p. 253）
參、線性與非線性結構的互動性文本
本章針對網路、數位內容及數位藝術中，具有互動、動態及影音效果的互動性文本，進行案 例的探討與分析，互動性文本如網路遊戲、多媒體故事繪本、互動漫畫電子書等，並以線性及非 線性敘事結構概念進行分類與案例分析如下。一、線性敘事互動文本案例探討
由 動 畫 團 隊 Moonbot Studios 與 William Joyce 共 同 創 作 的 互 動 繪 本 App 電 子 書 “The Fantastic Flying Books of Mr. Morris Lessmore”（圖 6），作品中運用了豐富的影音動畫特效， 並在部分頁面或動畫結束時，置入呼應故事內容的互動遊戲或場景，此案例的動畫與互動遊 戲並不影響故事的發展，雖然讀者可以前後翻頁，但故事的敘事軸仍維持單一行進，是屬於 偏向線性敘事結構的互動案例。
圖 6：” The Fantastic Flying Books of Mr. Morris Lessmore”線性敘事互動電子書案例
數位漫畫“Bottom of the Ninth”（圖 7）被選為2012年十本最具創新性的App數位漫畫作 品之一（Salkowitz，2013），作品頁面採用傳統紙本漫畫的分格形式表現，但在部分圖像與 視框內，巧妙置入了自動或被動播放的動態表現，並依情節需要加入音效及互動選項，例如 （圖 7）下方設計成四組互動按鈕，並可撥放四個不同的動畫，但不論讀者選擇了哪一個按 鈕，敘事仍然會繼續往下走，這些小動畫的內容並不影響敘事的主軸，這樣的互動設計接近 Ryan的流程圖或是Crawford的收斂型結構等線性敘事設計。
圖 7：”Bottom of the Ninth”收斂性結構的數位漫畫案例
二、非線性敘事互動文本案例探討
”Hotel”互動網站作品（圖 8），為非線性敘事結構類型，使用者可自由地在飯店內不同的場 合遊走，並自由選擇與場景內的任一角色互動，透過與不同的角色互動及對話，獲得該場域的敘
事訊息與空間認知，在此處使用者變成了敘事探索者，藉由自行蒐集取得的訊息，逐步理解並建 構出敘事文本的概念，開放的敘事行進設計，符合網絡連結或完全圖示類型敘事結構。
圖 8：空間認知敘事作品”Hotel” （http://www.hoteloscartangoecholima.com/splash.html，轉引自 Samanci, 2009, p. 68） 數位媒介技術的進步帶來新的敘事表現，例如運用體感技術及臉部辨識技術的互動作品。 美國學者Özge Samanci（2009）將人體投影在布幕上的動作，透過體感互動技術，擷取轉換 成連續性的簡化漫畫圖像（圖 9），創造出結合表演藝術與即興創作的新型態漫畫作品。《圖 10》為由曾靖越及魏君洲所創作，將人變成卡通角色的數位互動藝術作品，影射虛擬世界裡 的人際關係。創作者運用臉部辨識的互動裝置，將投射在螢幕中的觀眾臉部變成卡通造型人 物，卡通人物可隨著觀眾的移動而改變位置。數位媒介與數位技術的進步，讓使用者成了創 作者或是作品本身。 圖 9：體感互動漫畫作品（Samanci, 2009, p. 184） 圖 10：運用臉部辨識技術的數位互動藝術作品〈視以為是 II〉 （http://dal.ntua.edu.tw/insects2014）
三、具有線性與非線性特質的案例 “Dead on Arrival”（圖 11）是以懸疑偵探故事為題材的互動網頁作品，使用者可在幾處兇案 現場自由探索，並透過互動設計瀏覽場景中隱藏的訊息，藉此找出兇案發生的蛛絲馬跡，進而推 斷兇案發生的經過及兇手的真實身份，這樣的互動敘事設計，符應Ryan隱藏故事線的敘事概念， 藉由探索行動讓使用者涉入敘事，並自行建構出隱藏的敘事意圖，是具有線性與非線性敘事結構 特質的互動文本案例。 圖 11：”Dead on Arrival”偵探型敘事作品 （http://www.dead-on-arrival.co.uk/，轉引自 Samancı, 2009, p. 60）
美國學者Nathaniel Shaw（2011）基於漫畫理論家McCloud「無限畫布」（infinite canvas） （McCloud, 2000, p200-229）的觀點，運用互動式導覽軟體Prezi，創造出呈現雙重循環敘事型態 的數位漫畫作品（圖 12）。該作品有兩個各自獨立，亦也可串聯閱讀的循環故事，精心安排的故 事設計，不論讀者採用哪種方式閱讀，敘事的連貫性都不會中斷。在閱讀功能的設計上，讀者可 採取逐格閱讀，或是透過縮放互動的功能來檢視瀏覽。該作品獨特的地方，是在敘事結構上具有 線性及非線性的互動閱讀設計，其文本內容亦具有循環性及雙重性的敘事意圖。 圖 12：結合線性與非線性的雙重循環敘事 研究者的數位漫畫作品”Inbetween”（圖 13），為運用美國Madefire公司的Tool互動技術，製 作具動態表現、影音與互動效果的觸控式互動漫畫電子書（劉俐華，2014）。”Inbetween”的故事 內容設計成平行及隱藏故事的概念，在部分頁面同時呈現兩則敘事，並藉由兩者看似無關卻又相 互呼應的故事，引發讀者的好奇心，進而產生對於敘事的臆測。幾處重要的敘事場景，運用了圖
層視差（parallax）、環場觀看（panorama）及物件觸發等互動效果，讓讀者藉由互動探索進而對 敘事產生認知，形成敘事結構中的史詩漫遊空間。研究者借助超連結與互動數位技術，讓數位漫 畫作品產生結合線性及非線性的複合式數位敘事結構。 圖 13：結合線性時間與非線性時間的數位漫畫作品”Inbetween” （http://www.madefire.com/categories/INBETWEEN/）
肆、數位時代的敘事技藝
互動性文本受到創作脈絡、技術媒介、觀者互動和互動性層次的影響，產生媒介自身特有的 敘事技藝。互動的目的是為了讓使用者透過互動行為，產生涉入文本敘事的感受，而互動行為可 藉由媒介技術的互動特性、使用者對於文本的參與而產生。使用者參與的行為越頻繁，互動層次 越高，涉入文本的程度與認知也越強烈。研究者將在數位環境下，運用人與工具進行敘事行為的 技術能力與表現，通稱為「數位敘事技藝」，在分析線性與非線性的互動作品案例後，歸納出「視 覺」、「影像」、「聽覺」、「空間」及「媒介」等五種面向的數位敘事技藝表現，以下分項進行說明。 一、視覺的敘事技藝表現 對以視覺表現來傳達敘事的文本，例如繪本、漫畫或影像作品而言，圖像及影像是敘事表演 的要角，也是個人化的藝術表現。在平面媒介中，視覺敘事仰賴線條、圖像、文字及影像表現傳 達敘事，當視覺敘事進入了數位場域，敘事擁有了更豐富的圖像及影像表現技藝，並借助數位技 術，讓敘事作品從二度的平面空間擴展至三度立體空間敘事。除了像“The Fantastic Flying Books of Mr. Morris Lessmore”運用3D軟體進行全部圖像及場景的創作，營造立體空間之外，善用互動 技術也能讓平面圖像產生立體空間層次感。例如在“Bottom of the Ninth”這部數位漫畫作品中，其 視覺的表現沿用傳統漫畫的分格形式，但在部分視框內放入了動態影像及動畫，這樣的做法彷彿 在平面圖像中，創造出一個小型空間；在研究者的數位漫畫作品”Inbetween”頁面中，也運用圖 層視差及環場觀看等互動技術，讓讀者探索互動內的延伸畫面，產生空間延伸的認知感受，並在 部分場景運用了多圖層動態的模擬運鏡表現，讓平面的圖像產生了立體空間層次。二、影像的敘事技藝表現
動態表現與影像互動技術的置入，讓數位漫畫具備時間構面的影像敘事技藝，並產生豐富的 動態敘事表現，此外，動態製作軟體的門檻越來越低，也讓創作者更容易運用動態表現於敘事之 中，例如“Bottom of the Ninth”作品即運用大量的動態及3D動畫，讓作品產生細膩豐富的動態表 現。動態影像也能結合互動技術，強化互動的樂趣感，例如“The Fantastic Flying Books of Mr. Morris Lessmore”即運用互動觸發動態影像，例如手指滑動時，便出現讓風吹走書本的動畫。此 外，數位作品亦可充分運用電影及動畫的運鏡、剪接及拍攝表現，例如“Bottom of the Ninth”作品 的動態影片即使用了豐富的電影運鏡特效，研究者的”Inbetween”作品，亦運用了大量的電影運 鏡、剪接效果、蒙太奇及殘影等影像表現手法，並運用動態表現結合傳統漫畫符號，創造出動態 視框、動態對話框及動態速度線等新的數位漫畫表現形式。 三、聽覺的敘事技藝表現 人聲、配音、音效、背景音樂等聲音元素，能營造敘事的情境感、強化敘事張力，也具有空 間導向、時間導向、情境導向、動作輔助等敘事輔助功能，例如在”Inbetween”故事中，即運用 開場曲調示意歌仔戲開始表演，或用蟲鳴傳達夜晚情境、雷聲代表下雨、喧嘩人聲暗示賓客滿座、 藉由急促步伐聲強調角色的慌張情緒等。聲音也能營造敘事伏筆及故事推力，例如”Inbetween” 第二集結尾處，迴盪在山谷間的尖銳煞車聲，除了傳達角色發生車禍，營造敘事伏筆之外，也營 造讀者繼續閱讀下一集的故事推力。互動作品的音效播放設定，可大致分為主動播放、被動播放、 互動觸發三種，適時播放的音效，雖然有助於營造敘事氣氛，但也容易因過多的音效，干擾閱讀 並中斷敘事的進行。”Bottom of the Ninth”將音效設定成被動式點選播放，並在視框旁放置音效按 鈕，使用者按下按鈕後才會播放音效，此種作法也不失為一種兼顧閱讀自主與音效享受的作法。 互動觸發的音效設定，大致用在按鈕選項或遊戲用途，例如在《圖 7》“Bottom of the Ninth”按下 動畫按鈕選擇時，會觸發按鈕音效，並播放劇情小動畫。在“The Fantastic Flying Books of Mr. Morris Lessmore”中有個呼應劇情的彈鋼琴遊戲，此處的音效設計亦為互動觸發，並讓讀者能自 由地選擇琴鍵發出聲響，模擬彈鋼琴的感受。 四、空間的敘事技藝表現 數位技術的進步，讓數位敘事技藝能模擬人類對於事物自然認知的探索行為，將敘事的體驗 提升至視覺、聽覺、觸覺等泛感官的情境認知。”Inbetween”在天燈的場景，採用環場觀看的互 動技術，讀者在平板電腦或智慧型手機等觸控載具上，能用手指操控滑動天空的場景，藉此模擬 讀者仿如置身於敘事場景內，環顧四週天燈景象的感受。”Hotel”作品則是藉由讓讀者控制角色 在場景中行走及探索，產生彷彿身處該時空的移情認知。除了藉由互動讓讀者產生敘事情境的認 知，呼應故事的互動設計，亦可讓讀者在互動過程中，對敘事產生連結強度，進而提升敘事的涉 入感，例如“The Fantastic Flying Books of Mr. Morris Lessmore”就在場景中安排許多互動的物件， 讀者可以拉起地上的建築物，或是旋轉天空的雲朵，天空彩繪及彈鋼琴等的互動遊戲，則是呼應
敘事的內容。數位敘事藉由感官認知的互動性，讓讀者涉入情境並強化對敘事的連結性，並從中 獲得感官體驗與敘事認知的滿足感。 五、媒介的敘事技藝表現 不同的媒介具有不同的敘事特質與表現方式，數位媒介技術的發展，讓敘事擴展至三度及甚 至四度的敘事時空，並產生後設敘事技藝表現。體感漫畫運用體感互動技術的創作，讓真實世界 的人類轉化成虛擬世界的漫畫角色，也讓使用者變為創作者；數位互動藝術作品〈視以為是 II〉， 運用臉部辨識追蹤技術，將投射於畫面中的使用者，轉換成虛擬卡通角色，讓使用者成了敘事本 身，也讓敘事的詮釋權從作者身上被轉移，敘事的認知也產生不明確與不穩定性。此外，體感漫 畫和〈視以為是 II〉作品，不僅藉由媒介技術顛覆了創作形式，也產生零時差的即時創作型態。
伍、結論與建議
從遊戲理論的數位敘事結構概念取徑，研究者將互動文本以線性及非線性的概念進行分析， 並針對互動文本的數位敘事技藝表現進行深入探討。研究發現，線性互動文本運用視覺、影像、 聽覺、觸覺及模擬自然探索的敘事互動，產生敘事的聯想認知與強化敘事情境感受，營造出數位 敘事的沉浸感；非線性互動文本則藉由空間及媒介互動等抽象性的探索，產生敘事的拓樸認知及 泛感官體驗。本研究分析線性與非線性的互動文本案例後，歸納出「視覺」、「影像」、「聽覺」、「空 間」及「媒介」等五個面向的數位敘事技藝表現。3D技術、互動技術、多圖層動態等數位表現， 讓敘事產生了立體空間層次的視覺敘事感受；動畫、運鏡、剪接、互動等動態表現的置入，強化 了互動文本作品的影像敘事張力；運用聽覺的敘事技藝表現，能營造敘事情境、強化敘事張力、 輔助敘事內涵，也能營造敘事伏筆及故事推力；適切的音效能提升敘事情境感受，反之則干 擾敘事的進行；空間的敘事技藝能模擬人類的自然探索行為，將敘事擴展至泛感官的體驗層 次，並提升敘事認知的滿足感；藉由空間的互動探索設計，能讓讀者對敘事產生連結與涉入 感。新的媒介除了帶來前所未見的創作型態，也改變理解文本的方式，並帶來敘事的不明確性。 研究者的數位漫畫作品”Inbetween”以歌仔戲傳統文化為故事內涵，並於故事中置入歌仔 戲表演、傳統信仰及施放天燈等臺灣文化意象與說明訊息，並運用豐富的線性、非線性、動 態、影音及互動效果等數位敘事技藝，是研究者結合文化傳播及數位技藝的個人創作嘗試， 亦可提供後續研究者或創作者在數位敘事研究或數位敘事技藝表現的參考。研究者認為，數 位敘事帶來文本創作自由，創作者能運用數位敘事技藝強化敘事表現，也能藉由非線性敘事賦予 創作詮釋的自由。數位媒介技術的快速發展，提供了多元且豐富的數位敘事技藝表現，而結合數 位出版快速傳播的力量，數位敘事的發展與創作表現的可能性，令人引頸期待。陸、參考文獻
中文文獻Crawford, Chris（2005），《遊戲大師談數位互動劇本創作》，葉思義譯。台北：碁峯出版社。 （原書Chris Crawford. [2005]. Chris Crawford on Interactive Storytelling. New Riders.） 張新軍（2008）。〈故事與遊戲：走向數字敘事學〉。《武漢理工大學學報》，卷23，期2，248-252。 黃齡儀（2009）。〈數位時代之空間-時間敘事結構初探：以Façade網站為例〉。《資訊社會研究》， 期16，135-160。 劉俐華（2014）。《數位漫畫跨媒介敘事特質與表現形式創作研究—以觸控式互動漫畫「擇」 電子書為例》，博士論文。國立臺灣師範大學。 外文文獻
McCloud, S. (2000). Reinventing Comics. New York, NY: HarperCollins.
Ryan, M-L (2001). Narrative as virtual reality: immersion and interactivity in literature and electronic
media. Baltimore: Johns Hopkins University Press.
Samanci, Ö. (2009) . Embodying Comics: Reinventing Comics and Animation for a Digital
Performance, Unpublished doctoral dissertation, Atlanta: Georgia Institute of Technology.
Shaw, N. (2011). Digital Comics: Panel Structure in a Digital Environment. Unpublished master’s thesis, Pennsylvania: Drexel University.
網路文獻
”Dead on Arrival”。http://www.dead-on-arrival.co.uk/。
”Hotel”。http://www.hoteloscartangoecholima.com/splash.html。
〈視以為是 II〉。《林珮淳+數位藝術實驗室》。http://dal.ntua.edu.tw/insects2014。 Madefire 數位漫畫網站。http://www.madefire.com。
Salkowitz, R. (2013/1/5). The 10 Coolest Original Digital Comics of 2012.
http://www.fastcocreate.com/1682082/the-10-coolest-original-digital-comics-of-2012#1 劉俐華數位漫畫”Inbetween”。http://www.madefire.com/categories/INBETWEEN/。
