"从13KB里长出的像素画：一位独立开发者的剪影美学实践"

从13KB里长出的像素画：一位独立开发者的剪影美学实践

文本概览：全文约 2,289 字，阅读约 6 分钟。

每年一度的 js13k 游戏大赛有个近乎变态的规则：你的整个游戏——代码、美术、音乐、字体——全部打包后不能超过 13KB。

2025 年的主题是“黑猫”，一个叫 Elliot Nelson 的独立开发者凭一款叫 Ashes of Ulthar 的作品拿到了第 10 名。

我一开始以为这种比赛比的是编程技巧，能把东西压进 13KB 才算本事。但读完他的开发复盘之后，我最大的收获不在代码，而在像素画：在极端限制下，他没有让画面变”糙”，而是让画面变”对”。

这篇我想聊聊他从限制里长出来的剪影美学，以及我在他身上看到的、可以直接搬到自己项目里的做法。

限制是隐形的设计导师

js13k 的 13KB 上限意味着什幺？

你塞不进高清素材，塞不进复杂音效，甚至连一张无压缩的 PNG 都可能吃掉大半预算。Elliot 的做法不是硬挤，而是反向操作——主动给自己再加一道限制：只用 5 个颜色。

他在 Lospec 上找到一个叫Slimy 05的配色板：几种深浅不一的绿、一个近黑色、一个高亮色。全部加起来，5 个颜色。

Slimy 05 配色板，仅用 5 种颜色

我一开始以为“5 色”会让画面很单调，但他的成品完全不是这样。

因为颜色少，反而逼着他去想：什幺东西应该用剪影、什幺东西应该用层次、什幺东西应该留给高亮。

这种”被迫的专注”反而让整体风格很统一，不像那种”每个素材单看都不错、放在一起却打架”的常见新手困境。

剪影不是偷懒，是减法美学

Elliot 在复盘里说，他早期就决定要做“silhouette”风格——前景所有东西都是剪影，背景用渐层色块铺开。

这个决定有一半是美学选择，另一半是极度现实的生产考量。

游戏实机画面，剪影风格的多层背景

他后来找到了一张 Reddit 上的像素画（作者画的是“死灵法师的领域”），那种多层背景叠加深邃绿色的氛围让他确定了方向。

你能从他的时间轴 GIF 里看到整个场景是怎幺从第一天到最后一天慢慢收敛成型的：教堂、猫、树这些核心元素在前两天就画好了，后面的时间几乎都在调整构图和层次。

开发时间轴，从第一天到最后一天的场景演变

这里有个很真实的卡点：到第三周时，他已经困在“大小限制的地狱”里了。

任何一笔改动都可能影响最终 ZIP 包的体积，所以他不得不放弃很多想加的细节——左侧的建筑、地面的纹理、天空的层次。

这挺让人沮丧的，但做独立游戏本来就是这回事：你永远在”想要”和”能要”之间做取舍。而剪影风格的好处是，缺了细节之后画面不会“秃”，反而更干净。

像素画与游戏设计的咬合

这部分让我印象最深。

Elliot 做了一个“村民系统”来驱动资源收集——你不需要写复杂的物理引擎或碰撞检测，而是让村民在场景里走来走去，看起来画面很热闹。

执行伐木工任务的村民

技术上，他只用了一张“高度图”：村民走到 X=120 的位置时，Y 座标就直接从高度图读取。所以动画只需要控制 X 轴移动，Y 轴会自动贴合地形。

这招太聪明了——像素画的场景本身就偏平面，用一张高度图来伪造“走在地面上”的感觉，既节省性能，又和画风天然契合。

更妙的是，他在每个村民的“工作”里加了随机偏移：伐木工到了目的地后会原地转圈，模拟“工作”的感觉。这些小动作让整个画面活了起来，而你仔细想会发现，背后没有任何复杂的 AI——只是一串“移动到 X=80 → 等待 0.5 秒 → 移动到 X=120”的简单脚本。

我以前总以为”让画面有生气”必须靠复杂的动画系统，但这个案例让我意识到：像素画的魅力恰恰在于”用最少的信息传递最大的氛围”。

一个 16x16 的剪影小人，加上一点随机的转圈动作，就比很多精致的 3D 角色更有温度。

一个血泪教训：不要等到最后才测试

Elliot 的复盘里最让我捏把汗的部分，是他承认自己犯了一个“最大的错误”：整个开发期间他只测试了“普通开发版本”，从来没有在早期测试过“最终 ZIP 打包版本”。

结果在比赛结束前几个小时，他发现打包后的游戏根本跑不起来。

修复这个 bug 之后，原本被错误掩盖的 1KB 额外体积暴露了出来——他必须在几小时内再挤出 1KB 的空间。最后他被迫把原本设计好的“帮助界面”整个砍掉， sanity 条也换成了一个更简陋的方框。

灵感来源的 Reddit 像素画，多层背景与深邃绿色调

这段经历对我来说特别有共鸣。

我做项目的时候也常常抱着“最后再一起测试”的心态，结果每次都在截止日前手忙脚乱。他的教训很简单：从第一天起就保持“可打包”的状态，每周至少测试一次最终输出。

这个道理放在像素画工作流里也一样——不要画了 50 张素材才第一次放进引擎看效果，每画完一张就塞进去看看，很多风格不统一的问题会在早期就被抓出来。

小练习

用 Aseprite（或 Piskel）画一个 320x180 的场景，规则如下：

• 只能使用 5 个颜色（推荐去 Lospec 搜 Slimy 05 或自选）
• 前景必须是剪影，背景可以有色块渐层
• 主题是“夜晚的小村庄”
• 限时 1 小时

画完之后，把图片缩小到原尺寸的 50% 再看一次。如果缩小后仍然能读懂场景的层次和主体，说明你的剪影和构图是成立的。

参考资料

js13k 2025 Postmortem: Ashes of Ulthar: https://7tonshark.com/posts/making-of-js13k-2025-ashes-of-ulthar/