淺談交互式電子繪本的設計思路及方法

戴鵬

摘? 要：交互式電子繪本作為電子繪本的一種，在面向3～10歲兒童用戶的基礎上，以電子化為依托，實現了趣味性閱讀和注意廣度的拓寬。該文通過對電子繪本與傳統繪本的比較，以及幼兒對閱讀的心理上的需求描述，肯定了交互式電子繪本作為移動設備最符合幼兒需求的閱讀形式。該文從注重滿足適齡兒童閱讀趣味性和注意力的角度出發，基于對洪恩雙語繪本的實踐基礎上提出了交互式電子繪本的設計思路和方法。

關鍵詞：交互式? 電子繪本? 兒童閱讀? 圖畫書

中圖分類號：J524? ? ? ? ? ? ? ? ? ? ? ? ? ?文獻標識碼：A文章編號：1672-3791（2021）05（c）-0001-05

Discussion on the Design Idea and Method of Electronic Illustrated Book

—Based on the Case of Hong En Bilingual Picture Books

DAI Peng

（Beijing Hongen Perfect Future Education Technology Co.， Ltd.， Beijing， 100101? China）

Abstract：? As one type of electronic illustrated book， the interactive electronic illustrated book is aimed at children aged 3～10 years old， and based on digitalization， it achieves pleasure reading and breadth of attention. Through the comparison between electronic picture books and traditional picture books， as well as the description of children's psychological needs for reading， this paper affirms that electronic illustrated book， as a mobile device， is the most suitable reading form for children. From the perspective of satisfying the reading interest and attention of school-age children， this paper puts forward the design ideas and methods of interactive electronic picture books based on the practice of Hong En bilingual picture books.

Key Words： Interactive; Electronic illustrated books; Children reading; Illustrated books

1? 電子繪本的定義及優勢

一般認為，電子繪本是將傳統繪本的書頁內容電子化，可以在智能終端上顯示并具有實時播放功能的繪本。此外，電子繪本還可通過互聯網更新繪本內容，承載的數字化內容遠多于傳統繪本。此類繪本結合移動設備的可存儲性和交互性特點，是可二度創作的、包含數字動畫和數字語音音頻的可交互繪本，并且具有通過網絡傳輸可獲得以及可在智能設備中儲存的便利性。

相比較傳統繪本而言，電子繪本有如下優勢。

（1）電子繪本具有使用便捷、自帶語音朗讀和可翻頁交互等特性。此類教輔無需家長伴讀或另配點讀筆等設備，學生就可進行自主閱讀。

（2）電子繪本具有實效性，跨越了時間和空間的阻礙。電子繪本存儲于云端，使用者只需攜帶一臺移動設備（手機或Pad）即可獲得所有電子繪本書庫并進行跨越時間空間障礙的閱讀。

（3）電子繪本減少空間占量。電子繪本幾乎不存在實體繪本的收納問題。然而，如若電子繪本只是將紙質繪本的內容以電子化的形式，原封不動地展現在智能終端上，也很難調動孩子觀看繪本的積極性，造成觀看體驗較差，吸引不了孩子[1]。

（4）交互式電子繪本具有動態性。通過播放電子繪本的動畫，使用者能很大程度調動多感官進行閱讀;同時，動畫也在一定程度上增強了閱讀的趣味性和可讀性。

總體而言，交互式電子繪本具有便捷性、實效性等基于移動互聯網技術的便利性。相較紙質繪本而言，電子繪本具有更大的操作空間。

2? 兒童閱讀特點

兒童設計電子繪本的可讀性同時也與兒童的閱讀特征相關。首先，兒童的閱讀特點與閱讀設備和年齡分層有關。根據洪恩教育數據統計，2歲兒童逐漸接觸移動終端電子設備（如iPhone、iPad）。3歲兒童逐步使用電子繪本產品。但是在兒童升學至初等教育高年級之時，其對電子繪本的喜好便有顯著下降。故電子繪本的主要受眾兒童在3～10歲。

除閱讀設備外，兒童主觀因素也極大影響不同兒童年齡階層的閱讀特點。簡而言之，不同年齡段孩子的閱讀特點分化如下。

2.1 3～4歲時期閱讀特點

3～4歲階段的是兒童的語言敏感期。這時期語言學習者迫切需要大量語言文字交流。其語言交流迫切性表現在在閱讀時強烈的求知欲、生活中細致入微的體察性、在閱讀習慣上的重復性。但與之伴隨的是注意廣度的缺失。

2.2 5～6歲時期閱讀特點

這一階段兒童自我意識逐漸完善、想象力循序發展、思維較活躍、好奇心強。與上一時期相似的是對事物的體察性和注意廣度的缺失。不同的是耐心的缺失。

2.3 7～10歲時期閱讀特點

這個年齡段孩童有更鮮明的個性及愛好。幼童的閱讀偏好逐步從單一化幼稚空想過渡到具備多元化冒險元素、富含起承轉合情節的故事。即這一時期兒童偏好具有一定復雜性、需要一定認知力理解的故事。

綜上，3～10歲孩子對閱讀有來自于心理成長發育的強需求。趣味性較強及留有想象空間的繪本故事對這一時期兒童具有強吸引力。在電子繪本閱讀的產品設計過程中，設計者更應當關注提升繪本閱讀的趣味性及保持兒童注意力。

3? 面向兒童的交互式電子繪本

3.1 交互式電子繪本的定義

筆者認為，交互式電子繪本指的是將繪本集成音頻朗讀文件和元素動畫。當閱讀者手動翻頁時，交互式電子繪本將實現音頻朗讀自動化。當閱讀者點擊繪本元素觸發到元素動畫時，電子繪本將實現繪本動畫播放自主化[2]。

交互式電子繪是本兒童電子繪本的最佳呈現方式。交互式電子繪本特征性的繪本動畫給予閱讀者自主播放的自由，很大程度上增加閱讀掌控力，滿足學前學齡時期兒童的自我滿足感，從而增進閱讀動力。另外，交互式電子繪本還可以借鑒游戲收集系統，在閱讀時引入收集概念，例如：可以設置收集秘寶任務，能有效地激發閱讀興趣，提升注意力廣度，實現更高效閱讀。

交互式電子繪本與傳統繪本相比大有不同。內容創作角度上交互式電子繪本新增動畫制作、配音及音效制作、秘寶UI制作和字幕配置。而技術角度上設計交互式繪本的主要涉及到：服務端側交互繪本的拆分、創建和處理;客戶端側交互式繪本的獲取、接受、更新和輸出。

3.2 服務端對電子繪本的拆分、創建、處理

3.2.1 拆分組件

服務端對電子繪本的處理第一步通常為拆分。拆分指將美術人員繪制的原畫根據需求進行拆分得到各個組件。被拆分的組件通常為故事背景、角色、物品等。例如：原畫信息中包含女孩在草叢中采花的場景，可將原畫信息拆分成為女孩、花、草叢、天空等幾個組件。

3.2.2 創建交互元素

（1）點擊播放交互元素。為將繪本播放頁中動態元素可視化，設計者需對拆分的組件創建帶動畫的播放元素。根據多模態教學法理論顯示，繪本可視化比靜態電子繪本閱讀效果更加有效調動閱讀者閱讀積極性，拓寬閱讀者的想象維度。

在為組件創建動畫播放元素時，具體可包括調整元素在播放頁面中的位置或尺寸等，以生成帶有動畫的播放元素。例如：在動態調整的過程中，記錄動態元素播放時每個時間點其對應移動的位置坐標，或形態變化（如拉伸、收縮、旋轉、放大或縮小等）展示的位置坐標等，然后將記錄的這些信息保存在繪本對應的配置文件中，以便客戶端在加載該配置文件獲取到的這些記錄信息，并根據這些記錄的位置坐標，按照播放時間點對應展示出具有動畫效果的播放元素。

（2）繪本道具收集任務交互元素。交互式電子繪本的交互元素還包括創建繪本對應預設內容道具的收集任務信息。

對于此交互元素的應用，可根據繪本對應的原畫內容信息，結合實際業務需求創建相應內容道具收集任務信息。如根據繪本原畫內容信息，設計者確定繪本主題為疫情防護知識和繪本對應包的疫情防護道具（如護目鏡、防護服、殺毒劑、口罩、手套等）播放元素。因此，為協助宣傳疫情防護措施，設計者可將一些必要的防護道具組合作用于繪本對應預設內容道具的收集任務信息。

根據設計者所創建的收集任務信息，再進行選擇播放元素并綁定對應的內容道具。這類應用具體表現為創建觸發事件的方式。設計者綁定播放元素對應的內容道具，根據播放元素在播放頁面中的坐標位置，綁定該坐標位置對應的觸發事件。在繪本播放的過程中，當用戶觸擊相應播放頁面的該坐標位置，可執行綁定的觸發事件，即判斷綁定的內容道具與當前未收集到的預設內容道具是否匹配;若匹配，則根據綁定的內容道具，將收集任務信息中相對應未收集到的預設內容道具變更為已收集狀態。

（3）繪本配置文件交互元素。筆者認為，以方便客戶端使用為目的論，設計者需在服務端以繪本為單位，將每本繪本的播放元素組合，并創建繪本中各播放頁面的頁面信息;依據各播放頁面的頁面信息，生成該繪本的配置文件，進而使客戶端準確得到包含有動畫信息的、預設內容道具收集任務信息的繪本配置文件。例如：為了使繪本頁面動畫化，設計者需要根據故事劇情將每一頁原畫拆分成環境、人物、物品等組件，再將這些組件制作成帶有動畫的元素。最后，設計者應當按照故事的劇情將所有的元素組合成以頁為單位的畫面。與此同時，son數據結構可用來記錄書頁信息。

書頁信息主要包括繪本總頁數、頁面元素幾何、元素定位、每一頁里用戶點擊不同位置會觸發的相應事件等。而互動繪本整體內容結構參見圖1，主要名詞解釋如下。

①扉頁：作者信息、故事名稱/簡介、閱讀時長、封面圖;②故事頁：畫面使用的背景元素、畫面中所有的角色元素以及他們的坐標位置、該故事頁所需要的對白所對應的音頻文件、該故事頁所有的觸發事件安排等;③問題頁：包含問題的文案、圖標、可選答案、答案解析等;④尾頁：故事名稱、故事簡介、閱讀時長、封面圖;⑤書簽：記錄每頁的縮略圖和頁碼等;⑥成就手記：即本書秘寶，展示用戶已收集或未收集到的秘寶信息。

3.3 客戶端側處理電子繪本

客戶端側對電子繪本的處理共分為4個模塊。首先，獲取模塊用于獲取繪本對應的預設內容道具的收集任務信息;其次，接收模塊用于接收所述繪本播放頁面中第一元素的點擊指令;再次，更新模塊，用于若判定當前未收集到的預設內容道具與所述第一元素對應綁定的內容道具匹配，則對所述收集任務信息進行更新;最后，輸出模塊，用于輸出所述收集任務信息的更新消息。

3.3.1 加載繪本的配置文件

繪本的配置文件的獲取方式主要有兩種：一是從本地存儲中獲得;二是從服務端下載得到。

3.3.2 繪本播放頁的信息獲取

當用戶打開繪本時，可獲取繪本中各播放頁面的頁面信息及對應的收集任務信息。繪本播放頁信息包含內容道具。筆者在此處將內容道具定義為可與繪本內容相關聯的元素。而收集任務信息則被定義為繪本中的相關聯元素。

收集任務信息中可包含已收集的預設內容道具、待收集的預設內容道具等。該預設內容道具可與繪本內容相關，以起到學習引導的作用;或者與一些業務相關等，以起到信息推薦的作用等[3]。例如：名為《疫情防護知識》的繪本中介紹了防疫的相關知識。因此設計者可選取該繪本中包含的護目鏡、防護服、殺毒劑、手套、口罩等元素內容創建該繪本收集任務對應待收集的內容道具。

3.3.3 繪本播放隨機觸發

交互式繪本的處理第三步為在用戶隨機觸屏操作的基礎上給予用戶相應點擊應獲取信息并播放繪本動畫。設計者可根據頁面信息中包含的播放元素，以及播放元素所處播放頁面坐標位置，在繪本播放頁面相應位置處展示對應播放元素。例如：根據房屋坐標位置，在繪本播放頁相應位置處展示該房屋的播放元素;根據女孩的坐標位置，在繪本播放頁面的相應位置處展示該女孩的播放元素等。

前面提及的播放元素可為動態元素或者靜態元素。若繪本播放頁存有動畫第二元素，即交互元素，則該實施例方法還可包括：在展示繪本播放頁面時，播放第二元素的動畫信息。例如：在播放繪本內容時，當前場景為自然風吹的場景，并且帶有動畫的花草等元素。設計者可通過改變花草在播放頁面中展示位置以及展示形態等，以便表現出隨風搖擺的樣式。

3.3.4 接收繪本中第一元素的點擊指令

接收繪本播放頁面中第一元素的點擊指令是交互元素。該元素內容具體可為環境（如房屋、云彩、河流、風車、病房等背景）、物品（如蘋果、眼鏡、手套、鏟子、斧頭、手槍、防護服等物品）、人物（如男孩、女孩、老人、青年等）或其他動植物（如貓、狗、花等）等元素內容。元素還可分為動態元素和靜態元素等。

動態元素也可分為多種形式，如伴隨繪本播放的動態變化元素 （如改變位置、改變形態、改變顏色、樣式放大或縮小等）;或者在繪本播放時處于靜止狀態，但當用戶點擊后便可在一定時長內產生動態變化（相當于該元素預先綁定有對應的觸發事件）的元素。

3.3.5 判斷點擊指令是否有預置收集任務信息

用戶在觀看繪本時可觸擊繪本播放頁面中的播放元素。設計者在裝置側可先給予用戶獲取繪本播放頁面中的點擊位置信息的體驗，判斷該點擊位置信息是否有對應預置的觸發事件（指觸發程序內部某段功能代碼的因子，它的產生有多種途徑，如用戶交互等），若存在與點擊位置信息對應預置的觸發事件，則說明該播放元素是可被用于交互的元素。用戶確定接收到該播放元素的點擊指令，并可執行相應的觸發事件。其中，觸發事件可與播放元素相關，或者與其他業務相關[4]。

通過執行觸發事件，用戶將第一元素對應綁定的內容道具與收集任務信息中的當前未收集到的預設內容道具進行比較，若判定當前未收集到的預設內容道具與第一元素對應綁定的內容道具不匹配，說明收集到的內容道具并非是任務需要收集的內容道具，對此內容道具收集不會對收集任務信息進行更新。若匹配，則進行到下一步驟中。

3.3.6 收集任務信息更新和輸出

若用戶判定當前未收集到的預設內容道具與第一元素對應綁定的內容道具匹配，則系統對收集任務信息進行更新，并輸出收集任務信息的更新消息。其中，更新消息的表現形式可為文字、圖片、音頻、視頻、燈光、振動等。例如：在判定當前未收集到的預設內容道具與第一元素對應綁定的內容道具匹配時，可將收集任務信息中當前未收集到的對應預設內容道具變更為已收集狀態，并輸出文字和音頻的多模態更新消息，以便提示用戶已經成功收集到該內容道具[5]。

比如：從中找到未收集到的預設內容道具，系統則會對收集任務信息進行及時更新。收集信息任務的更新和輸出是通過對繪本創建收集任務信息來提升注意廣度以達到閱讀收益最大化。

4? 交互式電子繪本體驗地圖

交互式電子繪本體驗地圖在繪本設計思路中也值得一提。交互式電子繪本體驗地圖為繪本本身增添操作趣味性、提升注意力設計和賦予用戶自主使用的便捷性。用戶可通過手指滑動選擇喜愛故事。在用戶發起點擊播放動作后繪本會展示故事頁內容以及問題頁、尾頁等;在這期間用戶可自主翻閱對白、頁面回翻、點擊菜單UI中的書簽以跳轉至指定頁面[6]。此外，在故事內容頁點擊播放繪本動畫時，還可點擊科普介紹（此處指設計人員在特定故事頁穿插的科普，為用戶介紹物品的由來及作用等）以展示科普界面、點擊秘寶（可指設計人員安排并隱藏在每一頁故事頁里面的特定的道具）完成收集任務。任務完成后用戶可以查看秘寶并獲得對應講解說明。通過此流程，自主閱讀實現了兒童獲激發想象力、極具有趣性的故事理解和百科生活常識科普。在秘寶收集系統的輔助下，兒童能極大地提升繪本閱讀體驗。

5? 結語

筆者認為交互式電子繪本初衷是完全服務于3～10歲兒童閱讀需求。該文分析了移動設備可獲取的交互式電子繪本滿足幼兒在所在不同年齡段不同閱讀需求的可行性，在不基于交互式電子繪本的實現角度，依托于電子繪本實現載體，描述了從服務端對于電子繪本的拆分、創建及處理，以及到用戶層面客戶端對于電子繪本的獲取、接受、更新和輸出。筆者還運用游戲中的收集體系，為用戶描述出電子繪本閱讀的第二牽引力系統圖景：收集系統和問答系統。最終，筆者以用戶體驗地圖全流程的形式，分享了交互式電子繪本的體驗路徑，致力為讀者帶來全方位立體閱讀感知體驗。

參考文獻

[1] 張培培.兒童交互式電子繪本與傳統繪本的對比研究[J].長江叢刊，2019（23）：22，24.

[2] 張婷.交互式電子白板在幼兒園繪本教學活動中的有效應用[J].中國現代教育裝備，2020（12）：57-59.

[3] 潘騫.電子繪本在生活數學教學中的有效運用[J].現代特殊教育，2019（21）：67-69.

[4] 陳袆晗.交互視野下的電子成人繪本設計研究[D].景德鎮陶瓷大學，2019.

[5] 郝靈慧.基于移動端電子繪本的創作研究[D].深圳大學，2019.

[6] 嚴悅函.兒童電子繪本的互動性設計研究[D].北京郵電大學，2020.