《Cookie Cutter》中2000多张精灵表与10000个2D光源的管理之道

一个小团队如何在多个平台上以优秀的效果展示手绘动画？Subcult Joint 工作室给出了答案。他们用六年时间开发出了游戏《Cookie Cutter》。游戏中使用了数千个使用传统动画技术制作的高分辨率资产，而且这些资产都在 Unity 中进行了优化。由于工作室需要在清晰的视觉效果和流畅的游戏玩法之间找到平衡，因此他们广泛使用了 2D 光照来增强图形的深度并凸显以探索为核心的游戏设计。

继续阅读，了解他们是如何实现这一愿景的；以及项目后期的意外变化如何让他们解锁了更快的资产管理能力，并将光照设置提升到了一个新的水平。

身兼艺术家、动画师、Unity Learn 讲师的 Subcult Joint 创始人 Stefano Guglielmana，从 2018 年就开始开发游戏《Cookie Cutter》。他的灵感来自之前一个 Unity 项目中被拒绝的角色：Cherry，一个说话强硬的机器人。他说：“我爱上了她的设计，所以我开始为她制作动画。”Stefano 对《Cookie Cutter》混合了清版动作游戏和类银河战士恶魔城（Metroidvania）的游戏玩法有着清晰的构想，但需要开发人员的支持来实现这一目标。在获得资金后，他聘请了程序员 Francesco Bizzini 和一批艺术家和设计师来合作开发这个项目。

他们取得了这些成果：

发售一个月就售出 6 万份，收入 120 万美元
轻松管理 2000 多张精灵图表和 50 多个精灵图集
使用超过 10000 个 2D 光源点亮游戏
在项目中期成功升级到 Unity 2022 LTS

内容的呈现方式

《Cookie Cutter》的手绘视觉效果是一个主要卖点。Stefano 知道它们的制作会很复杂，但额外的努力肯定是值得的。他说：“视觉享受是让我们爱上电子游戏的原因。在 Subcult Joint，我们十分钦佩吉卜力工作室和迪士尼的大师们。虽然我们还没有达到他们的水平，但在《Cookie Cutter》中，我们想要挑战自己的动画技能，努力制作出一款非常酷的游戏。”

对于一个小型团队来说，这个项目极具挑战性。大部分艺术资产（超过 1000 个背景、精灵、动画和粒子效果）在视觉上非常复杂，并且都是使用传统动画技术精心制作的。在《Cookie Cutter》中，无论是玩家角色（Cherry）还是 NPC（27 种标准敌人类型和五个巨型 Boss），每个角色都有 20 到 40 个动画。每个单独的动画可能需要 8 到 48 小时才能完成。不同的艺术家会使用不同的 DCC（数字内容创建工具），但 Stefano 大多数资产都是用 Adobe Photoshop 制作的。

当 Stefano 完成一幅插画后，他使用 PSD Importer 将其转换为 8K 纹理，然后在 Unity 编辑器中进行优化，以防止显存溢出问题。通过合理地使用纹理导入设置，他成功减少了每个平台的纹理大小，并且遵循二的幂次方尺寸规则等最佳实践进一步优化了纹理。

*在编辑器中查看 Cherry 的各种动画状态。Subcult Joint 花了很多时间处理动画过渡，以确保流畅的游戏体验。

Stefano 表示：“在完成 Photoshop 中的工作后，我通过将每个动画帧逐一排列到一个新图像上，手动创建了精灵表（Sprite sheets），每个图表的尺寸始终是 512 x 512 的倍数，遵循 Unity 中的二的幂次方尺寸规则。在此基础上，Unity 的 Sprite Sheet Editor 让我可以轻松地切割精灵表，或者通过移动支点（pivot）或每帧的像素来进行其他调整。”这些工作流程确保了《Cookie Cutter》的视觉效果在多个平台上得到了优化，并且减少了性能问题。

在项目结束时，Subcult Joint 工作室将 2000 多张精灵表打包成 50 多个精灵图集（Sprite Atlases），并按角色进行分类。“精灵图集让将游戏导出到不同的目标主机变得非常简单，同时保持了稳定的帧率。我们的目标基本上是确保 60 帧每秒（fps），以保持游戏玩法流畅、整体性能顺滑。这极大地优化了内存使用，并且使加载时间变得更快。”Stefano 说道。

自定义游戏玩法

Stefano 希望避免其他注重动画的游戏常犯的错误。他解释道：“有很多动画的游戏可能会显得笨重。有时候，动画师想展示自己的技艺，但最终会影响游戏的流畅性。”他补充道：“在《Cookie Cutter》中，我们同样注重游戏玩法的流畅性，因此，当你手持控制器时，游戏的操作体验和动画一样顺畅。”

考虑到这一点，他需要一种能在编辑器中快速调整游戏玩法，同时又不担心破坏项目的方法。这就是 Francesco 所说的编程方面的最大技术难题之一：在 Unity 中创建一个能有效运行且不依赖过多代码干预的系统。

他表示：“我的目标是为设计师提供一种方式，让他们能够直接从编辑器中自定义游戏的任何方面。”借助 Unity 的内置扩展性，Francesco 能够添加自己的自定义功能，弥合他与团队中技术较弱的艺术家之间的知识差距。

为了实现快速的游戏玩法和激烈的连击动作，Francesco 在 Unity 中实现了第三方可视化工具 ActionGraph，以模块化的方式构建和设计有限状态机（Finite State Machines）。当动画的精灵图（Sprites）被加载时，ActionGraph 使得每一帧都可以加入游戏逻辑，从而让艺术家能够即时调整设置，例如碰撞体（colliders）或伤害数值（damage numbers）。举个例子，Stefano 可以使用 ActionGraph 在攻击中添加一个命中框（hitbox），并设置它在特定帧激活，启用和禁用跳跃计数器，触发战斗资源的生成和消耗等等，这些都无需程序员的参与。

Francesco 还编写了许多自定义的编辑器功能，以便 Subcult Joint 中以艺术家为中心的团队能够更多地参与项目。基于 xNode 可视化系统，UpWire 让艺术家能够轻松地管理人类和 AI 输入、编辑碰撞体、为特定动画节点添加视觉效果等。

*《Cookie Cutter》的图形连击系统（Graph Combo System）使 Subcult Joint 可以自定义攻击的命中框和参数，以创建连续的攻击、添加像摄像机震动这样的视觉效果，以及调整敌人对攻击的反应方式。

Francesco 解释道：“我把它打造成为了一个真正的战斗系统编辑器。它能够处理所有游戏变量，因此只有当玩家解锁了某个技能、武器或升级后，并且处于正确的位置时，才能执行特定的动作，例如空中攻击或地面攻击。”UpWire 还能处理物理中的力、位置转换和身体旋转等设置，这样艺术家就能更轻松地试验战斗机制。

*在对战 Boss 的图形连击系统（Graph Combo）中，Subcult Joint 可以调整攻击命中框的力、方向和反弹值，或自定义 Boss 如何对 Cherry 使用不同武器类型的攻击作出反应。

Timeline EZ Events 是 Francesco 的另一个自定义工具，它让设计师能够直接在编辑器中发送消息并调用函数（包括对场景对象进行操作），并为 GameObject 添加多种功能。例如，团队可以创建一个控制杆，当它被拉动时，不仅可以解锁一扇门，还能同时隐藏地图和小地图上的“上锁的门”标记。

Subcult Joint 使用 Timeline EZ Events 创建了《Cookie Cutter》的过场动画。这个工具让他们可以将角色动画、摄像机移动、音频和视觉效果按顺序排列，制作电影式的场景。

为了帮助设计师处理《Cookie Cutter》的小地图（在任何以探索为重点的游戏中，这一部分非常关键），Francesco 创建了 EzMiniMapPro。Francesco 说：“这个工具用于创建游戏区域的地图，并为图像生成提供了一些有用的自定义和优化。在运行时，它支持基于摄像机视野的动画叠加标记和自动探索遮罩。这个遮罩可以通过 SaveGame 进行存储和恢复。”

创建和实现这些自定义功能虽然需要付出不少工作，但它为整个团队带来了创作自由，让 Subcult Joint 的每个人都能参与到《Cookie Cutter》的设计、机制和游戏玩法平衡中。

使用 EzMiniMapPro，Subcult Joint 能够捕捉他们在编辑器中构建的整个地图，并将其导出到 Photoshop。然后，Stefano 可以在生成的地图上进行绘制，使其与游戏的视觉风格匹配，之后再将其导回到 Unity。

设计游戏世界

《Cookie Cutter》中的巨大世界（即 Megastructure）包含九个可供探索的区域。一旦某个区域的概念原型定稿，Subcult Joint 的关卡设计师 Gabriel Raymond Roy 就会为该区域制作灰盒（grey-box）模型，创造一个玩家需要探索的迷宫。

Stefano 说：“一个好的关卡设计师知道如何创建既有趣又值得反复探索的主要和次要路径。每个死胡同都应该为玩家提供某种奖励，每个开放区域都应该遭遇敌人，让玩家可以收集材料。”

当某个区域的灰盒模型设计完成后，Stefano 和设计师们就开始为场景添加环境细节，将手绘的精灵图（Sprites）沿 Z 轴的四个点分层排列。《Cookie Cutter》使用的是一个透视相机视角，并没有编写视差效果（parallax）。因此，当玩家移动时，他们会看到某些元素在透视中显得“错位”。Cherry 站在“默认”位置旁边，与敌人、物品和平台等可交互的游戏对象一起，而非交互的前景、背景和“远距离”元素则为场景视图增添了模拟深度。

照亮游戏世界 Megastructure

Stefano 开玩笑地说：“我们试图为每个区域赋予独特的个性，但由于游戏背景是赛博朋克风格，加上团队对机库和金属工厂的偏爱，我不确定是否真的成功为每个区域增加了独特性。”

为了赋予每个区域独特的视觉风格，Subcult Joint 大量使用了 URP 中的 Spot 和 Freeform 2D 光源。《Cookie Cutter》的世界里有超过 10000 个这样的光源。Stefano 说：“游戏中的每个光源都会实时照亮我们的精灵，创造出角色、动画和环境之间的紧密而自然的协调感。在黑暗的地方，角色会被阴影覆盖，在外部区域暴露在饱和、受污染的天窗光下时，则会沐浴在光线中。我非常喜欢这些细节！”

Subcult Joint 在游戏中直接使用了 Unity 的 2D 光照，将它们应用到与环境精灵图相同的Z轴层上，没有进行额外的调整。Stefano 解释道：“默认的 2D 光照非常棒，可以照亮游戏区域，而且可以决定它们影响哪些层。我们希望默认层始终对玩家清晰可见，这样他们就能明白哪里可以走，哪里不能走。然后我们还在背景、前景和远距离层上添加了光照。”

《Cookie Cutter》这款游戏的引人注目的 2D 光照在整体游戏设计中发挥了重要作用。作为一款类银河战士恶魔城类型的游戏，它侧重于探索。光照被用来为玩家提供环境线索。Stefano 解释道：“光照讲述了一个故事，它告诉玩家应该去哪儿，引导他们走上主路径，或者隐藏一些次要的可选路径。”

闪烁的灯光可用于吸引玩家的注意力。Stefano 分享了他们是如何制作这种效果的：“2D 光照的优势在于，你可以对它们进行动画处理。制作闪烁的灯光非常简单：选择光源，进入动画窗口，创建一个新的动画，调整光源的强度（0, 9, 0, 9）。如果你想在其他地方创建相同的效果，还可以将这个动画复制到其他光源上。”

在开发的最后阶段升级Unity版本

在开发的最后阶段，《Cookie Cutter》的 PlayStation 5 版本遇到了显存溢出的问题，阻碍了游戏的发布。Subcult Joint 通过升级 Unity 版本来解决这个问题。

在如此接近游戏发布的时间点进行版本升级并不是最理想的选择，但如果不解决这个问题，游戏就无法登陆 PlayStation 庞大的玩家市场。因此，Subcult Joint 团队决定全力以赴，将项目迁移到当时最新的 Unity 2022 LTS 版本。这次升级让他们能够使用新的性能分析和调试工具，比如更新后的 Memory Profiler（内存分析器）。

Francesco 表示：“Memory Profiler（内存分析器）中新的快照对比功能帮助我们识别并解决了长期存在的显存溢出问题。2022 LTS 版本在导入纹理时速度也更快了，而且这次升级最终让我们的游戏变得更加稳定。”

升级后，团队能够对《Cookie Cutter》的视觉效果进行最后的打磨，而这些优化在之前是无法实现的，因为他们现在可以使用正式版的 2D 光照系统。但这也意味着他们需要根据新的参数，逐一检查和修复游戏中之前使用的数千个实验性 2D 光源。幸运的是，得益于2022 LTS 版本中的一些功能，这一过程变得更加高效。

通过 Unity 2022 LTS 版本中更新的精灵图集功能，Subcult Joint 团队能够更加轻松、高效地将数百个手绘动画推送到不同的目标平台。同时，URP 正式版的 2D 光照系统也帮助团队为游戏环境增添了更强的深度和氛围感。

Stefano 解释道：“我们使用了新的 2D Light Explorer 来选择每个光源并手动调整。我们主要使用了 Spot 光源和 Freeform 光源，而 2022 LTS 实际上更新了 Freeform 光源的衰减特性，看起来比旧版好得多。虽然工作量很大，但我们成功修复了需要特别处理的技术问题，并进一步提升了游戏的质量。”