数字交互叙事创作工具

作者

yangjh

发布日期

October 10, 2023

数字交互叙事创作工具

  1. WebGAL是一款国产网页端视觉小说引擎,目前还处在开发阶段,具有易上手多平台的优点。
  2. Renpy
  3. Twine
  4. 橙光
  5. Cocos Creator

WebGAL的使用

WebGAL安装

除了下载安装可视化编辑器,还可通过npm安装工程版。

创建游戏并进行简单设置

创建游戏后,可以参照官方文档进行简单的设置和修改。

资源结构

  • WebGal将声音、背景、立绘、音乐等游戏资源,按照类别分别放置在对应的目录。
  • 可从文档中查看不同资源支持的格式。

场景

  • 场景包括背景图片、音乐等
  • 人物立绘目前支持在左中右分别放置,可独立操作,也可设定其大小、透明度等信息
  • 场景支持顺序、分支以及循环方式切换
  • 场景要有退出机制

创建场景

程序会从初始脚本start.txt开始运行。因此,创作者不能删除该文件,但可以修改这个脚本中的内容。

建议将不同的场景设置为独立的.txt场景文件。然后在场景中加入背景、人物、音乐等内容。

背景图片应该被放在 background 文件夹内,而立绘图片则应该放在 figure 文件夹中。不同位置(左、中、右)的立绘是相互独立的。

Plain Text changeBg:testBG03.jpg;//改变背景 changeFigure:testFigure02.png;//改变人物立绘

场景切换

场景切换可以按顺序,例如:

Plain Text changeScene:Chapter-2.txt;

也可以通过用户选择进行。

Plain Text choose:叫住她:Chapter-2.txt|回家:Chapter-3.txt;

变量

目前支持简单的变量运算,需要注意表达式中不能用空格进行美化或分割。

使用-next执行多个操作

同一时间内执行多步操作,使用-next,例如:

Plain Text changeBg:testBG03.jpg -next;

使用none关键字关闭资源

在设置立绘、bgm、背景等资源时,通过设置为 none 关键字,可以关闭这个对象。

清除立绘时,不同位置的立绘必须分别独立清除。

定制CSS

WebGAL提供了定制CSS的机制,通过项目文件夹中的userStyleSheet.css可以实现CSS的扩展。这个样式表中的内容,在项目初始化时,会被读取并合并到项目最终的CSS中。

  loadStyle('./game/userStyleSheet.css');

在这个文件中,创作人员可以按照实际生成的HTML内容进行样式定制。但这种方式只能在发布作品后才能看到,因此,不建议在开发阶段使用。

还有一种思路,就是在WebGAL导出的页面作品中,加入自定义的外部样式表。例如:

  <link rel="stylesheet" href="./assets/index.e47dd064.css">
  <link rel="stylesheet" href="/assets/mystyle.css">

然后再mystyle.css文件中,写入自定义样式即可。

如果要修改游戏启动画面、背景音乐及内容,可以在WebGAL自带编辑器中的游戏信息中对游戏启动封面等信息进行定制。

还可在游戏导出后,修改游戏启动文件index.html中有关启动画面中的内容:

发布游戏

游戏可以发布为不同平台的格式,目前支持网页、Windows平台以及安卓平台

回到顶部