文章目录[隐藏]
十分钟学会在图书馆创作互动小说：从资深到大师
上次修订日期 2021-08-17 上次重大版本更新日期 2021-08-09 *图书馆推荐阁下在重大版本更新之后再次阅读本指南
1.前言
本教程涉及的全部内容仅需高中学业水平均可理解，希望阁下能够坚持下去。加油！！！
本教程假定阁下对 INK 或 Web 技术的经验知识为零，缺乏技术的作者能从这拥有入门所需的一切。
下面是本教程大致的主体。
- 上手 INK ：下载工具并编写一个简单的故事。
- 中阶 INK – 如何为阁下的故事增光填彩。
自定义页面的外观，包括 CSS 知识的说明。- 导出为web，并发布到图书馆站点
*第3点由于难度过高，不在本次新手教程中赘述，该内容缺失对完成互动小说无任何影响
在本教程中，所有的示例代码均使用绿色颜色的字体表示，并附有一键复制按钮。由于绿色颜色的字体在黑色背景下的显示效果不理想，阁下可以点击页面右下角的工具箱，关闭黑夜模式。
本教程中，所有非必学的内容的标题后会标有 * ，不过我们还是推荐阁下研究一下，难度并不高，而且对创作很有用。
可能有些作者因为时间、精力等等原因无法独立完成制作，也可与其他作者一同创作，分别完成脚本、编写等步骤。图书馆站方也可协助完成代码编写部分，欢迎联系若雨。
应用场景提示：
- 房间调查：设定多个调查点，进行某个调查之后才可解锁某个剧情/对话的某个选项（可以设定调查的次数小于选项数）
- gal剧情：通过各种选择、经历不同事件，达成不同结局
- 在线调教：可选穿戴不同玩具，在不同剧情有不同选项
- 随机事件：可选是否发生随机事件，可以影响全局
- 道具play：可以限定数值大小，要求在数值不超过设定值的情况下完成目标
- 大地图移动：可以设定各个方位点，在不同方位点之间进行移动并探索
- 好感度：可以通过设置变量，使选项会影响角色好感度，从而浏览不同剧情
- 回合制战斗：可以制作回合制rpg打怪升级游戏
- 单人跑团：通过设定好的kp和选项，随机数骰子达成类似单人团的体验
- 通过随机数系统，可以用来打昆特牌/抽塔罗牌
- 更多使用方法就需要阁下自己思索啦
*以上多种场景组合使用效果更优哦
点击这里下载INK示例：
https://alhs.xyz/wp-content/uploads/2021/08/1628507091ink-shi-li.zip
将该文件解压后用ink打开，配合本指南食用更佳哦
2.INK 入门
这有一个 官方文档（英文），告诉阁下于 INK 所有需要知道的，从基础知识到复杂强大的结构。
但本指南将略过这些，指出其中最容易理解的功能，以便阁下能上手编写一个简单的故事。当然，如果阁下想尝试更高级的内容，请随时进入官方文档。
①下载INK
我们将用 Inky 编写——用于创作 INK 脚本的官方编辑器。
点击这里前往它的下载发布页https://github.com/inkle/inky/releases
支持Windows、Mac、Linux（如果阁下习惯 VS code *，也有用于支持编辑 INK 的插件）。
点击这里直接下载v0.12.0 windows版本（因github原因，下载速度可能不尽人意。以下分别是32位版本和64位版本）
https://github.com/inkle/inky/releases/download/0.12.0/Inky_windows_32.zip
https://github.com/inkle/inky/releases/download/0.12.0/Inky_windows_64.zip
点击这里直接下载v0.12.0 mac版本
https://github.com/inkle/inky/releases/download/0.12.0/Inky_mac.dmg
启动它时，阁下将看到一个双栏窗口。左侧编写故事，右侧可预览故事的运行。
首先要了解 INK，从本质上讲，它只是纯文本，并带有特殊的注释（“标记”）使其具有交互性。所以请继续，在左侧试着写一个句子，阁下会看到它出现在右边的预览区。也可以试着写多个段落看看。
重要*，写作时记得经常保存项目（Save Project），以防发生意外造成不必要的损失。
将写好的 Inky 文件保存在单独的文件夹里（如，不要直接放在桌面上和其他文件混在一起），可提高 Inky 的稳定性
②举个例子
现在，让我们看门见山，来看一个简单的故事示例。
若阁下以前从未接触过编程（很多符号！），下方截屏中的蓝色标记最初可能让人望而生畏。但我们会逐步介绍它们，以便阁下了解它们的组合方式。
请将下方内容复制到 Inky 的左栏中，然后在右栏中预览。右上角的单箭头是后退，双箭头是重置预览的故事。
伦敦，1872年
Phileas Fogg 先生的住所。
-> london
=== london === //这是节点
Phileas Fogg 先生早早从改革俱乐部回到了家，并乘坐了新型的蒸汽运输机！
“领航,” 他喊到。 "我们去环游世界！"
+ “环游世界，先生？”
我大吃一惊。
-> astonished
+ [点头。] -> nod
=== astonished ===
“你在开玩笑！” 我认真地对他说。“你一定是在和我开玩笑，先生。”
“我很认真。”
+ “好吧。”
-> ending
=== nod ===
我点了点头，但不相信一个字。
-> ending
=== ending //这也是节点
# CLASS: end
“我们将在八十天内环游地球。” 他很平静地提出了这个近乎疯狂地计划“我们8:25去巴黎。一小时后。”
-> END
③换行
INK 官方并没有提供制造一整个空行的代码，也就是说，如果你想让两个段落离得远一些，那么只能用HTML的换行代码
<br>
直接把这四个字符放在一行就可以了
④学会注释
好记性不如烂笔头。阁下可以在任何地方，用//......，或
/* ...... */帮阁下插入注释，记住阁下想记住的东西，避免一觉醒来就忘记“这是什么东西”。注释内容不会在故事运行时显示给玩家，也不会影响周围的其他内容。(这里的……是注释内容，阁下可以随意替换)
“你怎么看？” 她问。 // 一行注释 “我无法评论，”我答。 /* ……或者一段注释 */
在这个简单的故事中，阁下只需要简单的了解三个部分：结点、跳转和选项。
3.初级INK制作
①结点 knots
故事是由多个相互链接的部分构成的，在 INK 中我们称其为结点（knots）。结点名称的左侧至少需要两个等号==进行标记，右侧的则是可选的（例如 === london ===）。Inky 中会用蓝色突出显示已识别的标记，提示书写正确，并与其他内容区分。结点标记下面的内容都属于这个结点。
=== london === //这是节点 Phileas Fogg 先生早早从改革俱乐部回到了家，并乘坐了新型的蒸汽运输机！ “领航,” 他喊到。 “我们去环游世界！”
结点的名称（不能有空格、中文）不会在运行故事时显示。
而当我们想要把不同部分链接的在一起时，会用到它们。
②跳转 divert
现在谈谈链接，我们称之为跳转（divert）。
-> london
使用跳转箭头（输入”减”与”右尖括号”），告诉故事去另一个结点。运行故事时，跳转是自动的且不会显示给玩家。
因此，在故事的开头，显示了介绍性段落之后，就有 -> london 的跳转，可将玩家直接跳入该名称的结点中。
伦敦，1872年 Phileas Fogg 先生的住所。 -> london //这是跳转 === london === //这是节点 Phileas Fogg 先生早早从改革俱乐部回到了家，并乘坐了新型的蒸汽运输机！ “领航，” 他喊到。 “我们去环游世界！”
如果阁下刚写好一个选项的跳转，编辑器用红色的X提醒你
Empty diverts (->) are only valid on choices
不要惊慌，这是因为你还没有创建相同名称的节点，ink不知道应该跳转到哪里，只需要创建对应的节点，这个报错就会消失
如果在跳转之后，阁下正在编写这个节点的内容，编辑器用黄色三角感叹号提醒你
Apparent loose end exists where the flow runs out Do you need a '> DONE" statement, choice or divert?
或是用红色X提醒你
Apparent loose end exists where the flow runs out Do you need a '> DONE" statement, choice or divert?ran out of content. Do you need a '> DONE" or '> END'?
不要惊慌，这个原因是，你的这个节点缺失继续跳转的内容，解决办法就是加上跳转，可以在节点编写选项然后加上跳转，这样这个报错就消失了。
如果现在已经是结局了，那么在最后加上 ->END 即可，我们马上就会说这个事情
③特殊：END
注意，这个END是全大写英文
这个故事的结尾，还有一种特殊的跳转。如果阁下跳转到“ END”，会告诉 INK 我们完成了，这里是结局。
=== ending //这也是节点 开始 “我们将在八十天内环游地球。” 他很平静地提出了这个近乎疯狂地计划“我们8:25去巴黎。一小时后。” -> END //特殊的跳转 结局
试着删除例子中该有的 -> END ，Inky 将在边缘显示错误。若将鼠标悬停在警告上，会提示阁下“loose end”。
④*胶水：glue
如必须让内容在同一行显示，还可以使用胶水（glue）<> 将其强制黏在同一行。
我们回家<> -> to_savile_row === to_savile_row === 去萨维尔街<> -> as_fast_as_we_could === as_fast_as_we_could === 尽可能的快
阁下会在预览看到 我们回家去萨维尔街尽可能的快 ，而非分三行显示。
⑤选项 choices
谈到分歧，为了使互动小说更有趣，我们需要的最后一个关键功能当然是选项（choices）：
+ “环游世界，先生？”
选项看起来是 INK 中最重要的元素。通常它们会与跳转直接结合在一起，以便能创造一个直接跳转到故事其他地方的选项。
+ [点头。] -> nod
通常，阁下输入的选项内容既会成为可点击的选项，也会成为阁下点击后出现的文本的一部分。但是，如果阁下想要一个“无声的”（如动作）选项，则可以将选项放在[方括号中]
用人话说，就是阁下选的选项也会出现在文本中，如果阁下不想让它出现在文本中，那就把选项放到方括号里面。
是不是还是有点难懂？那就忽略方括号，加不加方括号对互动的影响微乎其微。
⑥*一次性选项
如想要选项只能被被玩家点一次，最简单的方式就是把选项的+改成*。
* “环游世界，先生？”
举个例子，阁下体验时会发现一次性选项“2 Hello back!”不见了。
->hello == hello Hello world! + 1 Hello back! //普通选项 Nice to hear from you! ->hello * 2 Hello back!//一次性选项 Nice to hear from you! ->hello + 3 Hello back! Nice to hear from you! ->hello
⑦*结构说明
关于 INK 整体结构最后的说明：INK 始终从文件的顶部开始，然后一直向下运行。但如果阁下将所有内容拆分为结点，则务必确保在文件顶部至少有一个初始跳转（如-> top_knot），以告诉它以哪个结点开始（修改初始跳转，可更方便的进行测试）。
-> top_knot //初始跳转 === top_knot === Hello world! -> END
现在，为什么不尝试续写个故事呢？尝试插入更多的结点，更多的跳转，更多的选项，更多的结局，看看会发生什么！作为练习的开始，也许先试着把介绍性段落变成阁下的结点？
⑧*收束 gathers
*本节内容为高阶inky残卷中内容，但是因其在文章制作中帮助巨大，且难度不高故复制至此
收束（gathers） - 将小分支收回到一起。让我们看这个例子：
“怎么了？”我的主人问。 * “我有些累。”[]我重复道。 “确实，” 他答道。 “这太糟了。” * “没事，先生！”[] 我回应道。 * 我说，这次旅行真可怕。”[] 我不想再继续了。” “啊，” 他有些动容。 "你看起来很沮丧。明天，情况会好些的。"
在真正的游戏中，这三个选项都可能导致相同的结果，Fogg 先生离开了房间。我们可用收束来执行此操作，而无需创建任何新结点或新跳转。
“怎么了？”我的主人问。
* “我有些累。”[]我重复道。
“确实，” 他答道。 “这太糟了。”
* “没事，先生！”[] 我回应道。
* 我说，这次旅行真可怕。”[] 我不想再继续了。”
“啊，” 他有些动容。 "你看起来很沮丧。明天，情况会好些的。"
- Fogg 先生离开了房间。
我们可将这些“收束和分支”串在一起，让故事始终向前运行。
=== escape === 我跑出森林，狗跟在我后面。 * 我检查了下珠宝[]，都还在我的钱包里，这感觉就像步入了春天。 <> * 我没停下来喘口气[]，继续向前跑。<> * 我欢呼了出来。 <> - 路没多远了！Mackie 会发动引擎，然后我就安全了。//收束 * 我来到路边四处张望[]。 你能相信吗？ * 我不该总是说，Mackie一直很可靠[]。他从未让我失望过。更确切地说，从来没有，直到那晚前。 - 路旁边是空的。 Mackie 不见了。//再次收束
*注意 - 的使用哦，使用 - （收束）可以将数个选项都导向同一个结果，这在当懒狗时十分好用。
*示例代码中的 [] 有什么用?INK里自己运行一下就知道啦。
⑨*清空屏幕
Inky 的 Web 模板另一个特有功能是 clear 标签：# CLEAR
这将清空当前显示的所有文本，从页面顶部重新开始。建议仅在选项后直接插入！如果插入到文本中间，则部分内容将在看到之前就被清除。
4.中级INK制作
通过以上的学习，阁下应该可以制作基本的互动小说啦！通过点击不同的选项，触发不同的剧情，最终达成某个结局。
但如果我们想根据玩家之前的经历不同，显示不同的文本和选项呢？
①判断
INK 会记录运行中玩家经历的每个内容，以便阁下今后查询。例如，要确定玩家是否经过了称为（地下墓穴）的特定结点 catacombs：
{ catacombs: //条件：经过地下墓穴
这里比巴黎的地下墓穴还要暗。
}
在这个{大括号中} ，阁下可以包含多行内容，甚至是跳转和选项（只有玩家经过了“catacombs”这个结点，大括号里的内容才会被显示）。
但是，一个更简洁的编写条件选项的方法如下，仅当玩家经过某个结点后才显示特定选项的方法：
+ {catacombs} [告诉她你的发现] -> tell_her
如果阁下想反转这个条件，换句话说，如果阁下想确认玩家没有经过地下墓穴，阁下只需在前面简单地加上：not
+ {not catacombs} [前往地下墓穴] -> catacombs
最后，阁下可用 and 和 or 形成更复杂的判定条件，并且用小括号来阐明逻辑的细节。几个例子：
{ catacombs and not pick_up_ring: //条件：经过地下墓穴且没经过捡起戒指
“所以你之后没找到它？”她质问到。
+ [抱歉] -> apologise
}
或是
{ (catacombs or cross_river or sing_in_rain) and not buy_new_shoes:
//条件：（经过地下墓穴或穿过河或在雨中唱歌）且没经过买新鞋
那天我的鞋子早就烂了。
}
再看个例子*，阁下能发现选“白色的”虽然和灰色的后面走的是一样的结点，但显示的内容变多了。
你想买什么颜色的狼？
+ 白色的…… -> white
+ 灰色的…… -> gray
== white
让我找找看。
-> gray
== gray
{ white:白色的狼卖没了。 }要买灰色的狼吗?
+ {white}我一定要白色的狼->wolf
+ 好的，买灰色的狼->wolf
== wolf
……略
-> END
②重启故事
Inky 的 Web 模板还具有一个内置功能，如果插入 # RESTART 标签，它将立即重置故事的进度（包括玩家选择的所有经历和变量），并从头开始。由于它会立刻生效，建议阁下放在一个选项后，例如：
你死啦！
+ 从头来过。
# RESTART
-> END
这里代码中添加 -> END 跳转有什么用呢？虽然玩家并未结束，但它可以防止 INK 报错“loose end”。
5.高阶INK制作
①跨文章传输变量
*考虑到读者群体在存档保存方面的不稳定性，图书馆不建议制作流程上强依赖本功能的大型跨文章的内容
*有关变量的知识请参阅 校史馆：高阶INK残卷
图书馆目前支持不同文章间交换变量数据
导出数据：
# EXPORT: var
意思是将当前状态下的var变量的值导出（供其它文章使用），如果多次导出会覆盖之前导出的值
导入数据：
# IMPORT: var @ post @ var2
意思是将post文章中的var2这一变量导入，存储到var这一变量当中。
*这里的post为图书馆文章名。请在设置前提前规划文章的名字。
** 注意，由于ink的设计问题，我们忽略了紧跟着IMPORT语句的那段文本，具体含义请参考示例。
例子
文章1 测试导出
VAR test = "测试用文本" # EXPORT: test -> END
文章2 测试导入
VAR imp = "会被覆盖的内容" # IMPORT: imp @ 测试导出 @ test imp的值为{imp} imp的值为{imp} -> END
后一篇文章在前一篇文章执行后会输出
注意，由于ink的设计问题，第一行因为是紧跟着IMPORT语句，因此imp变量还没有更新。
我们忽略了紧跟着IMPORT语句的那段文本，即： imp的值为会被覆盖的内容 这句话不会在图书馆显示，这需要阁下创建一行无用文本来保证需要的文本能正确显示。
用人话来说，就是：B文章要读取A文章的变量，因为ink的原因，紧跟着IMPORT语句的的imp变量不会更新，从第二句开始才会更新。所以图书馆干脆就不显示这个不会更新的第一句，阁下需要准备一个无用文本放在第一句来当“替死鬼”，以保证想要显示的文本能正常显示。
注意，本功能依赖图书馆DE渲染技术，在本地无法测试！请自行确保代码准确无误。
我们只介绍了 INK 中强大功能的一小部分。如阁下想阅读更多或只是深入了解已经看到的东西，看看官方文件：
- 与任何编程语言一样，阁下可以创建自定义变量并执行数学计算。
- 我们一直在使用
+作为选项符号，但通常我们建议使用*。区别在于，*选项只能选择一次，非常适合需要重复浏览，但阁下不希望重复选择的选项。
- 一个有点难学但易于编写的系统，称为“编织（weave）”，用于编写复杂分支，不需要阁下自己命名每个部分。我们的大多数游戏像80天，都是用这种系统编写的。
- 在结点中，阁下还可以包含称为“针脚（stitches）”的子结点。
- 写不同的内容和分支的中间内容是可能的，也是直截了当的（？）。
- 阁下可将 INK 文件拆分为多个连在一起的较小文件。
- 插入图片
- ……
到这里为止，阁下已经掌握了 Inky 书写故事最最基础的语法。现在试着考验下自己：
写一段游戏中常见的“询问NPC”剧情。基础要求至少有三个可以问NPC的选项，且可以问完所有问题。
进一步要求，玩家至少问一个问题后才能继续剧情，玩家问完所有问题后会直接继续剧情……
是不是觉得有些难（或麻烦）呢？这也是为什么会有高阶 INK 的原因。强烈建议阁下读一下“编织”，这个问题的答案就在编织那块的底部。阁下会发现，INK 应对这种内容其实游刃有余，或者说 INK 就是为写这种故事而生的，简单而流畅。事实也是如此，大部分 INK 的故事都是用编织写主要部分的，而非最基础的语法。
图书馆存有翻译了官方文档的部分内容，便于阁下选择性了解，点我跳转至：校史馆：高阶INK残卷 。
*这里提到的 变量、编织、阵脚在高阶INK残卷中均有叙述。阁下可以制作
- 周期，一次性，随机的可变文本
- 嵌套的事件，收束的事件
- 变量，条件，逻辑
- ……
6.导出作品
①附加信息
Ⅰ.当作品创作完成后，阁下还需要添加相关信息。阁下提交文章至图书馆后，会由图书馆官方“互动小说姬”发布，因此阁下需要在互动小说添加自己的版权信息（555能不能给图书馆/若雨留个位置）
示例：
《文章标题》
作者：xxxxx
编辑（如果有）：xxxxx
测试（如果有）：xxxxx
鸣谢：xxxxx
版本：x.x
Ⅱ.因为互动小说的性质原因，第一次没有通关，导致第二次打开时被迫重新开始游玩的体验无疑是糟糕的。因此需要阁下在互动小说开始前添加游玩时间信息
示例：
本小说（单线）通关游玩时间约为：xx分钟
为防止给阁下带来不好的使用体验请提前规划时间。
Ⅲ.以防有人不会操作互动小说，阁下可能还需要添加一个使用教程
示例：
因为cookies等多种原因页面重新加载后上次的存档将变得不可靠。因此推荐阁下一次性通关当前线路。
互动小说为图书馆测试产品，如有bug请点击页面下方的 反馈/举报 链接。
Ⅳ.阁下有什么想说的（作者的话）也可以一并写下哦
②发布
怎么保存？
点击左上角的File，你会看到Save Project
这样保存是后缀为ink的文件，这是你的工程源文件，任何人拿到这个文件都可以编辑/导出这个小说的内容
如果阁下是打算多人合作一本小说，则分享的时候请传送这个ink文件，但千万不要泄露哦
经过了头秃的文本创作、代码编写、反复测试以后。阁下的作品终于可以发布啦。
下一步是将我们的故事保存到一组文件中，这些文件可以作为网页上传到网上。要在 Inky 中执行此操作，请选择“File”，然后选择“Export for web…”，然后选下故事的名称。阁下选择的名称将同时用于网页上的标题（因此，请适当的用空格和大写字母），以及保存到的文件夹的名称。
当阁下对故事进行更改后，阁下应该选择“Export story.js only…”，将其保存到相同的位置并覆盖“ 故事名字.js”。这是更新 INK 内容后唯一需要更新的文件，其余的文件都只是 Web 模板的一部分。因此，若阁下更改了模板的外观，这样就不会意外覆盖。
好的，现在阁下应该拿到了一份含有后缀名为html、js、css的几个文件。如果阁下打算自行在本地观看，则需双击.html文件即可
如果阁下需要发布到图书馆，请点击Save Project，填写文件名，把这个后缀为ink的文件，通过邮箱或是什么方式发送给若雨就可以了,发送时还请一并将文章标题，摘要，标签等作品信息告知若雨。
若雨邮箱是[email protected]
有没有很激动！快去试一试吧！！！！！！！
写到这里若雨都无比激动了，快去试试！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！
本指南适用于在图书馆发布的作者 本指南由https://www.yuque.com/inky/pcke0w/gix3ga改编 修改翻译自https://www.inklestudios.com/ink/web-tutorial
加油！一定要坚持哦！
有问题也可以评论区讨论哦~
真的反人类，建议简化创作流程
互动小说本来就有一定的创作门槛，ink已经是公认的，可以进行高度自定义的编辑器，而且本篇教程已经写的非常详细。
指望这玩意能友好是不可能的，图形化的界面可以去看Scratch，但是在这个工具上要求图形化是不合理的，也是不现实的。也可以去学怎么搭建网页，那个实现的效果极其强大，HTML+CSS+JavaScript
我觉得很好，通俗易懂，这对我很有帮助
还好我是学计算机的