神之手 - 动画制作与精灵表创建器 - 自定义NPC工具

GODLY HAND 动画构建器 — 抢先预览版
[BETA]
“在开发过程中进行了大量测试，但真实NPC项目中的边缘情况我无法独自重现。如果出现问题，请在评论中附上你的设置，我会修复。”
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

📌 主要用途
这是 Godly Hand 的两个组件的抢先预览——一个即将在Nexus发布的全能NPC创建工具。此版本包含动画构建器和精灵图制作器——这些工具取代了构建自定义NPC精灵图时最痛苦的两个部分。

如果你制作过自定义NPC，你一定熟悉这个循环：你需要一个动画，于是打开图像编辑器，手动计算每个帧的位置，在JSON文件中手写帧编号，弄错一个，用SMAPI加载游戏，看着NPC出问题，返回JSON修复，重新加载，不断重复。没有预览，无法在进入游戏前看到你构建的内容。

上传精灵图 → 点击帧 → 观察播放 → 导出JSON。这就是动画构建器。
逐层绘制帧 → 复制到精灵图 → 导出PNG。这就是精灵图制作器。

将它们结合使用——在精灵图制作器中绘制你的精灵图，导出为PNG，加载到动画构建器中，构建你的动画序列。整个流程在一个浏览器标签中完成。

对其他模组工具感兴趣？请查看Godly Hand的其他部分发布：

• 坐标选择器：https://www.nexusmods.com/stardewvalley/mods/47616
• 调试命令：https://www.nexusmods.com/stardewvalley/mods/47582

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

⚙️ 动画构建器功能

🎬 以实际游戏速度实时预览动画
预览画布以游戏中完全相同的速度播放你的动画——无需猜测，无需重新加载。游戏内部将速度值除以10，因此 speed=200 将以每帧20ms运行。预览完全匹配这一点。标签会显示你输入时的实际每帧毫秒数。

🖼️ 从实际精灵图中可视化选择帧
上传你的精灵图PNG，每个帧会被切片并显示在网格中——你实际的像素，而不是占位框。蓝色边框 = 已选择。绿色边框 = 已在当前序列中。点击任何帧即可添加。在序列面板中点击帧标签将其移除。如果你愿意，也可以手动编辑原始序列。

📋 构建多个命名的动画
一个文件可以容纳你需要的任意数量的命名动画。每个动画都有自己的名称、帧序列、速度和循环延迟。名称必须与你的日程表条目完全匹配——该工具使其可见，这样你就不会忘记。

🔍 生成前进行语法检查
一个按钮在生成任何JSON之前运行完全检查。它会捕获缺失的名称、空的序列、重复的动画名称、超出精灵图边界的帧编号，以及会静默破坏日程表匹配的包含空格的名称。在接触输出之前，错误和警告会清晰显示。

📂 加载现有的 Animations.json 进行编辑
已经有动画文件了？直接加载。所有动画都会解析到构建器中，准备修改。格式错误或损坏的JSON会显示清晰的错误模态框，说明具体问题——无效的JSON语法和错误的文件格式会分别报告。

📥 无需精灵图即可加载 JSON
不需要加载精灵图即可检查现有文件。加载任何 Animations.json 并立即运行语法检查器。通知会告诉你帧选择和预览需要精灵图——但验证可以独立工作。适用于审核其他模组或检查旧文件。

⬇ 下载或复制输出
生成一次即可获得两种选项——下载 Animations.json 直接将文件保存到你的电脑，准备好放入你的模组文件夹。复制将其放入剪贴板。该工具还会在每次重新生成时保留先前输出的备份，一键即可访问。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

🎨 精灵图制作器功能

🖌️ 16×32像素画布，带图层系统
直接在正确的星露谷物语NPC帧尺寸上绘制。画布放大到每像素18px，方便舒适地绘制。默认图层为皮肤、头发、衣服和细节——每个独立绘制，在画布上合成。添加、重命名、重新排序或删除图层。使用眼睛图标切换可见性。

🎨 颜色面板，包含肤色和发色
三种颜色模式——完整的颜色轮用于任何自定义颜色，肤色色板面板包含14种从浅到深的色调，发色色板面板包含19种颜色，涵盖自然色调和幻想选项。将任何颜色保存到个人保存的色板行，该行在会话期间持续存在。

🔲 套索选择和移动
在任何像素周围绘制自由手绘选区。选定区域从活动图层上抬起，可以拖拽到新位置。应用以提交移动，或取消以恢复。选定区域内的所有内容作为一个单位移动。

🪣 绘制、擦除、填充和不透明度
标准绘制和擦除工具，外加填充。不透明度滑块从1–100%可将绘制的颜色与像素上已有的颜色混合——适用于阴影和颜色分层。与绘制和填充功能配合使用。

📋 成人及儿童模板
点击模板打开帧选择器，显示成人或儿童基础精灵的所有16个帧——从你的实际模板PNG渲染，带有透明背景。选择一个帧，它会加载到活动图层中，作为可编辑的起点。儿童模板完全支持，具有适合年龄的行布局，没有仅成人的硬编码槽位。

📄 精灵图槽位，带帧参考
你绘制的每个帧都会被复制到精灵图槽位中。槽位标有其帧编号范围（f0–f3, f4–f7等）和相应的行名称（正面行走、右侧行走、第4行等），这样你始终知道你在构建哪一行。编辑任何槽位可将其重新加载到画布中，所有图层保持不变。

📂 加载现有的精灵图进行编辑
已经有精灵图PNG了？直接加载。该工具验证其为64px宽，并将其切片为单独的帧。每个帧变成一个槽位，包含一个包含原始像素的基础图层，以及空白的头发、衣服和细节图层，可供绘制。

⬇ 导出为有效的星露谷物语精灵图
将完成的精灵图下载为单个64px宽的PNG，每行4个帧——正是星露谷物语期望的格式。即使填充的帧较少，最小高度为128px。空的槽位导出为透明。该文件立即可在你的模组中使用。

🗂️ 装配视图
切换到装配标签，以1倍、2倍、3倍、4倍和6倍缩放查看当前帧的合成效果。从此处切换图层可见性。通过点击直接跳转到绘制标签中的任何图层。从任一标签复制到精灵图。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

📥 安装
此工具完全在浏览器中运行。无需安装任何内容。

HTML版本——推荐给大多数用户

• 下载 GodlyHand_AnimationBuilder.html
• 在Chrome、Firefox或Edge中打开
• 完成——无需设置

JSX版本——适用于Claude / React环境

• 下载 GodlyHand_AnimationBuilder.jsx
• 放入Claude.ai或任何React沙盒中运行

两个版本功能完全相同。下载后无需互联网连接。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

📋 要求

你的NPC精灵图PNG 必须正好64px宽，高度为32px的倍数。每个帧为16×32px，每行4个帧。如果你使用精灵图制作器从头绘制精灵图，这会自动处理。如果你自带文件，请在加载前在任何图像编辑器中检查尺寸。

现代浏览器 Chrome、Firefox或Edge。下载文件后无需互联网连接。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

💙 致谢

Miss Coriel — Miss Coriel的NPC创建器
此工具使用的64px宽、每行4帧的精灵图格式遵循Miss Coriel的NPC创建器建立的标准。精灵图参考标签中的参考图围绕此布局构建。→ Miss Coriel的NPC创建器

Rafseazz 和 mamaesh — Ridgeside Village
Ridgeside Village的规模和复杂性——50多个NPC，每个都有日程和动画——不断提醒着这些工具的用途和它们所能实现的可能性。→ Ridgeside Village

Claude — Anthropic
整个开发过程中的助手。构建了动画构建器、精灵图制作器图层系统、套索移动工具、实时预览、语法检查器、肤色和发色调色板、成人和儿童模板，以及所有导出和导入逻辑。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━