浅谈交互式电子绘本的设计思路及方法

戴鹏

摘  要：交互式电子绘本作为电子绘本的一种，在面向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.