为 Larva Labs 制作动态自复制程序

本文介绍了一个为 Larva Labs 的生成艺术项目 "Quine" 制作动画的过程。该项目通过将可执行代码嵌入像素艺术中，实现了艺术品的自我复制和循环。为了直观地展示这个复杂概念，作者使用 Canvas 技术来高效渲染包含数万个元素的图形，并构思了“打印”与“扫描”的视觉隐喻。这个动画生动地演绎了 Quine 的生成过程，最终成功应用于 Art Blocks 的拍卖宣传和迈阿密 Art Basel 的展览中。

什么是 Quine 项目？

Quine 是一个生成艺术项目，其核心特点是代码与艺术的融合。作者的朋友，Larva Labs（CryptoPunks 和 Autoglyphs 的创造者）邀请他为这个新项目制作动画。

Quine 是一个生成艺术项目，它模糊了其代码与所产生的艺术之间的界限。

每个 Quine 看起来是程序生成的像素艺术，但仔细观察会发现其中嵌入了真实代码。当你提取并运行这段代码时，它会生成该 Quine 序列的下一个变体。

该项目的核心概念是其“quinity”（循环性），它决定了一个 Quine 序列循环回起点的代数。

  • 3-Quine: 经过三代生成后会循环回初始状态。
  • 5-Quine: 经过五代生成后会循环。
  • Perfect-Quine: 极为罕见，执行其代码只会重新创建自身。
  • Pseudo-Quine: 同样罕见，它会生成一个几乎无限的、从不循环的序列。

这个巧妙的机制让作者从最初的感兴趣，到完全被吸引。动画的任务就是通过视觉方式，将这个复杂的生成过程解释清楚。

解决性能挑战

Quine 的实现方式带来了巨大的技术挑战。每个 Quine 的代码在执行时会生成一个 SVG 文件，但这些文件极其庞大。

  • 尺寸: 1440x2560 像素。
  • 图形元素: 单个 Quine 可能包含多达 14,400 个 <rect> 元素。
  • 文本元素: 还可能包含 3,500 到 4,500 个 <tspan> 元素用于显示代码。

对于任何熟悉 SVG 性能的人来说，要流畅地为这么多元素制作动画几乎是不可能的。因此，作者立即放弃了使用 SVG 的想法，转而采用 <canvas> 元素。Canvas 具备硬件加速能力，可以轻松处理数千个形状的动画而不会出现性能问题。

用“打印”来演绎生成

有了可靠的技术方案后，作者开始构思动画的核心隐喻。他将 Quine 的生成过程想象成一次“打印”。

他结合了两种打印方式的灵感：喷墨打印机（逐行打印）和丝网印刷（分层套色）。在多次尝试后，他选择了最能营造期待感的机械式慢速线性打印方式，让 Quine 的每一层都缓缓浮现。

最初，代码和色块是同时“打印”的，但这削弱了代码的重要性。为了突出 “代码是艺术品存在的原因”，作者调整了顺序：

  1. 先打印代码: 单独展示代码层，让观众注意到它的存在。
  2. 再打印色块: 在代码之上打印色块层。
  3. 反转代码颜色: 当色块打印上来时，代码的颜色会反转，以此强调代码被“嵌入”在艺术品内部。

用“扫描”来解读代码

为了传达“Quine 内部的代码是真实且可读的”这一信息，作者设计了一个“扫描”动画。

这个动画模仿了人们在代码编辑器 (IDE) 中与代码交互的体验。一个虚拟的“扫描器”划过 Quine 图像，同时，图像中的代码以打字机效果出现在一个模拟的编辑器窗口中。这个简单的效果清晰地表明，这些像素化的字符并非随机装饰，而是 真实、可识别的代码。

组合与升华

最终，作者将“打印”和“扫描”两个独立的动画无缝地结合起来，形成一个完整的叙事循环：

  1. 打印出第一代 Quine。
  2. 扫描第一代 Quine。
  3. 扫描过程同时打印出第二代 Quine。

这个流程自然流畅，完美诠释了 Quine 自我生成的概念。

项目最初的交付成果是一个用于 Larva Labs 宣传视频的动画片段。之后，项目方再次邀请作者为迈阿密 Art Basel 的展览创作一个更长的循环视频。这个版本需要在一个 4K 电视上展示 10 个不同 Quine 的完整生成序列，总时长达到 8分28秒。得益于动画代码本身就是“生成器的生成器”（它提取 Quine 的代码来生成下一个动画），这个扩展任务也得以顺利完成。