动画序列设计-打开电脑
===概述===
示例图
打开电脑的动画序列设计如下图。
（通过事件交互，可以去示例中 动画序列管理层 看看）
基础要求
| 先尝试回答下面的问题：什么是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）动画序列配置
动画序列使用小工具配置，在动画序列28和29，分布配置了电脑的动画序列。
4）地图事件
留意地图中，下面的几个地图事件。
电脑的动画帧
1）配置说明
接下来就是基于画好的序列大图来配置到游戏。
作者我在示例中提供了序列大图素材，
你们可以自己尝试配置一下实现。
素材+插件+小工具，即可实现 打开电脑的全流程。
2）站桩与四方向
注意，此处设计的电脑，是没有朝向的装饰物。
所以事件注释中，应该考虑“创建动画序列(站桩)”。
| 装饰物一般不画四方向，因为它不像玩家那样需要灵活移动、转向。 |
3）单电脑的动画帧
打开小工具，新建一个动画序列，
导入序列大图，如下图。
导入后，将全部素材放在1号状态元，命名为：完整流程GIF，
并勾选预加载。
（电脑的所有内容都在完整流程GIF中，只是切片不一样，所以这样设置）
4）电脑x3的动画帧
按照刚才同样的流程，
新建另一个动画序列，并导入电脑x3的大图。
电脑的状态元和动作元
按照电脑的流程理解，可以分为下面几个流程：
电脑黑屏状态、打开电脑、电脑持续运行、关闭电脑
这几个流程正好也对应到状态元和动作元：
状态元：电脑黑屏状态、电脑持续运行
动作元：打开电脑、关闭电脑
所以，将GIF切片，得到下面的设置：
》电脑_持续过程（状态元）：就3帧，里面的程序在不停的闪烁。
》电脑_关闭状态（状态元）：就1帧，黑屏的状态。
》电脑_打开电脑（动作元）：包含8帧，如下图。
》电脑_关闭电脑（动作元）：帧数与关闭电脑一模一样，但是勾选了倒放，如下图。
通过上述设计，电脑的动画序列配置就完成了。
（电脑x3也按一模一样的方式配置即可）
事件指令设计
电脑有两种状态，开启状态和关闭状态。你可以使用 事件页设计思维 来思考如何设计事件的指令。具体了解下文档“8.物体 > 独立开关与事件页.docx”。 |
1）单电脑的指令
按照电脑的流程理解，可以分为下面几个流程：
电脑黑屏状态、打开电脑、电脑持续运行、关闭电脑
4个流程，应该直接对应4个事件页。
所以事件页的切换图为：
根据事件页情况，设计如下。
》事件页1，电脑黑屏状态
》事件页2，电脑打开动作（并行处理）
另外，注意打开动作需要的等待时间，与动作元的播放时间有关。
为：8*8 = 64帧。
可以去看看后面章节：动作元的播放等待时间 。
》事件页3，电脑持续运行状态
》事件页4，电脑关闭动作
注意，事件页1使用了默认行走图图像。
而事件页2、3、4都使用的动画序列[28]。
（动画序列不跨事件页，每个事件页都要加注释）
2）电脑x3的指令
电脑x3的指令与刚才的设计一样。
只不过图像换成了电脑x3，动画序列换成了[29]。
另外，注意电脑x3的 打开动作、关闭动作 的播放时间。
为：9*8 = 72帧
（计算方式见后面章节：动作元的播放等待时间 ）
开关触发设计
说到事件页，说到电脑开关状态。
我们肯定可以联想到 重力开关、计数开关 这些机关类型的道具。
需要额外添加下面的插件：
Drill_EventMutiSwitch 物体 - 计数开关
就能实现开关触发设计了。
电脑一样可以当成一个开关来用。
于是作者我设计了一个简单开关：
三个电脑全都开启时，点亮下图的灯。
详细开关触发的设计可以去了解下：“8.物体 > 触发的本质.docx”。 |
===打开电脑 - 注意事项===
电脑没有主机
如下图，电脑只有一个显示屏和一个键盘。
没有主机，没有鼠标，连电源插座线什么的全都没有……
作者我知道这些都没有，需要新画。
但后来又发现，电脑摆上去之后，即使没有主机，好像也没什么问题。
我作为玩家好像只关心电脑能不能开，而不会关心电脑合不合理……
而且，作者我会不自觉脑补主机和电源应该可能在桌子下面，玩家应该也会自动脑补，所以作者我就没画了。
鼠标寻路优化
由于事件触发的实际位置在脚下，
使用鼠标点击电脑时，玩家会将目的地设置在桌子上，不能触发事件。
这里可以使用下面插件改进：
Drill_PlayerAllowTouchByEventFrame 互动 - 允许鼠标点击行走图寻路
开启像素判定，鼠标点击到行走图时，偏转寻路到这个事件的脚下位置。
（寻路优化具体内容，可以去看看文档“10.互动 > 关于允许操作移动.docx”）
为什么要同时播放动作元和状态元
前面章节 事件指令设计 ，你可能会注意到动画序列播放时，有下面的写法：
因为动画序列中，动作元会插播状态元。
动作元播放完毕后，就会继续播放当前状态元。
使用这种写法，能实现打开电脑后，电脑持续运行的过程。
动作元的播放等待时间
动作元播放的时间，与动画帧的帧数有关。
如下图，8*8 = 64帧。
（每个动画帧还能单独修改帧数）
如果要等动作元播放完之后再执行其它动作，
那么写下面的等待64帧的指令即可。
| 等待时间、动作元播放时间，可以自己调整，没有长短限制。你可以自己设立一个标准，比如规定 某类动作 必须在120帧内播放完毕，然后按照这个标准去设计所有 动画序列、等待时间机制。 |