动画序列设计-小爱丽丝办公
===概述===
示例图
小爱丽丝办公的动画序列设计如下图。
（通过事件交互，可以去示例中 动画序列管理层 看看）
基础要求
| 先尝试回答下面的问题：什么是GIF动画序列？什么是状态元和状态节点？状态元和状态节点相互如何组合嵌套？是否已完成 ”配置GIF文件并在游戏中播放” 流程？什么是站桩/二方向/四方向的动画序列？是否已试过事件注释切换动画序列的方法？ |  需要先了解基础知识哦！ |
如果你对上述问题有疑问，那么说明你还不了解 动画序列、行走图动画序列。
此文档要求的基础知识非常非常多，确认你已了解下列的文档，才能继续。“小工具>入门篇”教你如何用小工具配置GIF，并转入到游戏中并播放。“小工具>高级篇”介绍更复杂的GIF配置，并在游戏中执行复杂播放。“7.行走图 > 关于行走图GIF动画序列.docx”介绍将动画序列配置到行走图中。“7.行走图 > 关于行走图与图块.docx”介绍行走图与图块的设计关系。 |
灵感来源
2024年10月4日，作者我在群聊的时候，突然想开坑。
开坑灵感结合了 帕鲁、时间换金钱的养成、公司雇佣 等奇奇怪怪的想法。
（反正不一定实现，先想想又如何呢……）
但现在真的开坑了，虽然目前开的是大坑中的一个小土堆。
===小爱丽丝办公 - 实现===
前期实现
该设计前期从灵感到实现，并非一帆风顺，简单了解一下过程即可。（此处与文档“7.行走图 > 动画序列设计-打开电脑.docx”的前期实现一模一样） |
1）初次约稿雏形
当时找了一个画师群友约了稿，约定就画小爱丽丝单马尾一种情况，然后再3x2图块范围内，画桌子、电脑、办公椅的GIF。
后来，群友给出了GIF成品，如下图。
2）大小适配问题
等我实装的时候，很快发现了不合理的地方。
画师按照小爱丽丝的身体大小，设计了相符合的办公桌，可这个办公桌太小了。
如果就按原样来，我还要准备一个空办公桌的图块。
如果专门去适配，办公桌可以使用图块桌子，方便扩展。但我需要重画。
考虑到后期长期维护的问题，我最后还是决定了我自己重画。
3）图块过于规整问题
决定自己重画后，很快发现了另一个问题，图块过于规整。
如下图，按照3x2大小来设计，电脑会贴着桌子的顶，不好看。（左图）
我应该让电脑突出出来，挡住处于电脑后方的量子妹才行。（右图）
因为事件的中心锚点在正下方，所以我们不一定要遵守图块高度的规则。
于是，最终决定，办公桌的高度为104像素。
比2个图块的高度高8像素。
这样，电脑靠墙时，看起来也像是摆在桌子上，而不是平躺放在桌子上。
4）自己重画
重画过程中，作者我去掉了办公桌，并且把所有部件都拆开了。
分为：键盘、打印机、电脑屏幕、电脑屏幕光、咖啡杯、文件纸堆、小爱丽丝、办公椅。
后续如果遇到新的意外情况，能及时修改。
按照前前后后的调整与修改，作者我一共画了45帧。
最后使用小工具 GIF动画序列编辑器 导入，得到下面的切片。
| 另外，如果可以自己画，最好自己画哦。画的过程会遇到很多细节适配问题，改起来效率高。ㄟ(ʅ⊙ω⊙) |
基础插件
如果要从零开始设计，需要下图的插件：
该文档只详细说明 整体设计思路 与 画画调整。
基础配置
具体注意示例下面的地方：
1）图块设计
电脑需要摆在桌子上，所以需要添加桌子图块。
除了桌子，还要考虑墙壁、地板等符合放置电脑的室内环境。
2）动画序列素材
示例中提供了动画序列的序列大图，
你如果还没来得及画自定义素材，可以先用我这里画好的素材。
3）动画序列配置
动画序列使用小工具配置，对应了动画序列25/26/27，分布配置了电脑的动画序列。
4）地图事件
留意地图中，下面的几个地图事件。
另外，注意添加 行走图马甲事件，用于播放小爱丽丝归队动画。
多物体的动画帧设计
1）配置说明
接下来就是基于画好的序列大图来配置到游戏。
作者我在示例中提供了序列大图素材，
你们可以自己尝试配置一下实现。
素材+插件+小工具，即可实现 小爱丽丝办公的全流程。
2）站桩与四方向
注意，此处设计的电脑，是没有朝向的装饰物。
所以事件注释中，应该考虑“创建动画序列(站桩)”。
| 装饰物一般不画四方向，因为它不像玩家那样需要灵活移动、转向。 |
3）谁来播放动画序列
小爱丽丝办公过程中，出现了两个对象：办公桌事件、玩家。
因为前面提及的 站桩与四方向 ，
办公桌事件为固定朝向，而玩家为四方向，且二者交互是长时间持续交互，
所以应该隐藏玩家（或角色离队），事件播放 办公桌+小爱丽丝 的合并动画。
4）动画序列素材准备
决定按照 事件+玩家 的合并动画来做之后。
那么就需要准备 办公桌+量子妹、办公桌+长发小爱丽丝、办公桌+单马尾小爱丽丝 三套动画。
具体要看游戏剧情是否需要，作者我考虑到未来三者都需要。
所以直接 自己重画 了。
办公的状态元和动作元
按照办公的流程理解，可以分为下面几个流程：
电脑黑屏状态、开始办公动作、持续办公状态、结束办公动作
这几个流程正好也对应到状态元和动作元：
状态元：电脑黑屏状态、持续办公状态
动作元：开始办公动作、结束办公动作
所以，将GIF切片，得到下面的设置：
》办公_持续过程（状态元）：7帧动画，量子妹操作+里面的程序闪烁。
办公_打印纸（状态元）：21帧动画，量子妹打印纸，拿出纸看看，然后收好的过程。
这两个状态元可以合并，可见 打字流程和打印流程 。
》办公_无人状态（状态元）：就1帧，黑屏的状态。
》动作_开始办公（动作元）：包含16帧，如下图。
》动作_结束办公（动作元）：帧数与关闭电脑一模一样，但是勾选了倒放，如下图。
通过上述设计，量子妹的动画序列配置就完成了。
（小爱丽丝长发、单马尾也按一模一样的方式配置即可）
事件指令设计
办公有两种状态，持续办公状态和电脑黑屏状态。你可以使用 事件页设计思维 来思考如何设计事件的指令。具体了解下文档“8.物体 > 独立开关与事件页.docx”。 |
1）事件页设计
按照电脑的流程理解，可以分为下面几个流程：
电脑黑屏状态、开始办公动作、持续办公状态、结束办公动作
4个流程，应该直接对应4个事件页。
所以事件页的切换图为：
根据事件页情况，设计如下。
》事件页1，电脑黑屏状态
》事件页2，开始办公动作（并行处理）
另外，注意打开动作需要的等待时间，与动作元的播放时间有关。
为：16*8 = 128帧。
》事件页3，持续办公状态
前面事件页就控制播放状态节点”办公_持续的完整流程”，所以这一页不用变。
（状态节点是两个状态元合并的结构，可见后面章节：打字流程和打印流程）
》事件页4，结束办公动作
注意，事件页1使用了默认行走图图像。
而事件页2、3、4都使用的动画序列[28]。
（动画序列不跨事件页，每个事件页都要加注释）
2）办公过程与队伍变动
前面的设计，只包含播放动画+切换事件页的功能。
而游戏中，量子妹、珍妮、伦琴，开始办公后，还需要从玩家队伍中出队。
结束办公时，还需要安排角色归队动画。
归队动画需要额外的一个事件马甲，控制播放行走图移动动画。
| 由于有三个工位，如果所有人都去办公，那么就会出现：空白队伍的情况 。 |
3）空白队伍的情况
前面的 2）办公过程与队伍变动 中，通过角色离队的方式，实现角色在工位上工作。
但这会造成一个问题：量子妹和小爱丽丝如果全部都离队了。
那么队伍中没有任何人，这时候如何控制？
（队伍中允许没有任何角色，可以了解下文档：“10.互动 > 关于玩家队员管理.docx”）
这时候，就需要设计：
》队伍没有角色时就不允许移动
》玩家按确定键，提示玩家是否继续。
首先，需要通过分支条件区分“常规情况”和“空白队伍情况”。
然后，进入空白队伍情况时，不允许移动，并监听按键，如下图。
用到了下面插件：
Drill_OperateKeyboradConditionBranch 键盘 - 键盘的分支条件
Drill_OperatePadConditionBranch 键盘 - 手柄的分支条件
Drill_MouseConditionBranch 鼠标 - 鼠标的分支条件
玩家在不允许移动的情况下，只能按确定键。
若监听到了确定键按下，那么就弹出对话框，询问是否结束工作。
通过这种方式，就实现了空白队伍情况的办公情况。
| 之所以要考虑空白队伍情况，是因为玩家只有一个人但想要执行办公。为什么玩家要一个人办公？因为后期设计只要进入办公状态就会每秒+1金币。这样就有必须一个人办公的理由了，为了加速获得金币。 |
4）事件设计流程小结
开始办公的全过程如下图所示。
===小爱丽丝办公 - 注意事项===
打字流程和打印流程
前面 办公的状态元和动作元 中，
设计了“办公_持续过程（状态元）”和 “办公_打印纸（状态元）”两个状态元。
而这两个状态元，都属于 事件页“持续办公状态”。
所以需要使用状态节点合并一下，
在动画序列配置中，如下图。
其中，“办公_持续过程”被播放的情况要多一点，所以在随机播放中，复制了三份。
鼠标寻路优化
由于事件触发的实际位置在脚下，
使用鼠标点击电脑时，玩家会将目的地设置在桌子上，不能触发事件。
这里可以使用下面插件改进：
Drill_PlayerAllowTouchByEventFrame 互动 - 允许鼠标点击行走图寻路
开启像素判定，鼠标点击到行走图时，偏转寻路到这个事件的脚下位置。
（寻路优化具体内容，可以去看看文档“10.互动 > 关于允许操作移动.docx”）
为什么要同时播放动作元和状态元
前面章节 事件指令设计 ，你可能会注意到动画序列播放时，有下面的写法：
因为动画序列中，动作元会插播状态元。
动作元播放完毕后，就会继续播放当前状态元。
使用这种写法，能实现打开电脑后，电脑持续运行的过程。
动作元的播放等待时间
动作元播放的时间，与动画帧的帧数有关。
如下图，16*8 = 128帧。
（每个动画帧还能单独修改帧数）
如果要等动作元播放完之后再执行其它动作，
那么写下面的等待128帧的指令即可。
| 等待时间、动作元播放时间，可以自己调整，没有长短限制。你可以自己设立一个标准，比如规定 某类动作 必须在120帧内播放完毕，然后按照这个标准去设计所有 动画序列、等待时间机制。 |
===小爱丽丝办公 - 常见问题（FAQ）===
动作元播放没有效果
| 问题名称 | 动作元播放没有效果 |
| 问题图示 |  |
| 问题描述 |
|
| 原理解析 | 作者我自己也有时候没注意到这个问题，配置状态元和动作元时，有个“优先级”的设置。状态元优先级默认为0，作者我无意间改成了10，导致后来出现了这个问题。 因为改成10，会导致优先级为0的动作元，被过滤掉了，所以播放没有效果。 |
| 解决方案 | 把动作元的优先级也改成10或20即可。 |