【免费下载链接】ClaudeAnimationBaseA starter kit for animating hand-painted cartoons with Claude: p5.js p5.brush, the Clawd character, 31 acted emotions and a guide for the model项目地址https://gitcode.com/gh_mirrors/cl/ClaudeAnimationBase点击查看免费下载ClaudeAnimationBase 是一个基于 p5.js p5.brush 的手绘卡通动画起步套件内置 Clawd 角色、31 种带表演的情绪和一份写给 AI 的动画指南。你只需一句自然语言描述故事AI 就会按「分镜脚本 → 逐镜头搭建 → Contact Sheet 自查 → 渲染 MP4」四步工作流自动产出一支有手绘质感的卡通短片并且每一步都渲染缩略图「看」自己的作业来纠错。它到底是什么ClaudeAnimationBase 不是普通的代码库而是一套教 AI 做好动画的完整生产线组成部分说明角色 Clawd陶土色小方块吉祥物5 个关键视角 表情、帽子、舞蹈31 种情绪每种情绪自带表情、体色和跟随节奏的待机动作动画引擎p5.brush 笔触 水彩填充 每秒「沸腾」12 次的抖动线条纯 2D规则指南ANIMATION_GUIDE.md 是 AI 遵循的制作规范上图是项目自带的表情模型表从 happy、laugh 到 furious、starstruck31 种情绪全部画好备用。想换角色、加新情绪或新服装直接让 AI 改即可。第一步先写分镜脚本再写一行代码 ✍️AI 动笔前必须先产出分镜文件STORYBOARD.md格式在 ANIMATION_GUIDE.md 的 Workflow 一节中定义Logline一句话故事——「Clawd 想要 ___但是 ___于是 ___」World场景、小调色板、光线以及全片的色彩走向如冷夜 → 暖黎明Motif贯穿全片并回收的母题Clawds arc整片的情绪关键帧而非逐镜头安排Shots每个镜头标注起止时间、入/出转场、画面内容、事件、Clawd 的反应、运镜以及reads观众必须看懂的信息点各配起止时间reads 就是时间轴脚本每条信息都要给观众留足找到它、看懂它的时间且两条重要信息不能抢同一帧。写完 AI 还会对照自查每个镜头有事件吗每处接缝有转场吗全片有没有出现文字结尾是否与开场呼应 新手提示这一步是 AI 动画质量的分水岭。先让 AI 把分镜给你看、给你改确认后再进入下一步能省掉大量返工。第二步逐镜头搭建动画 ️分镜定稿后AI 开始搭建在 src/config.js 里设置片长duration和节奏bpm有音乐就填歌曲速度新建场景文件src/scenes/my_video.js用 IIFE 包裹以shots([...])收尾在 studio.html 中把demo.js的 script 标签替换为你的文件一次只建一个镜头先摆好关键姿势关键姿势要能当静帧看懂确认无误后再补中间的运动上图是 Clawd 的视角与运动参考表正面、3/4、侧面、背 3/4、背面五个手绘关键视角外加行走、转身、残影、跳跃、惊讶反应等动作规范以及一整套帽子。工程上有个精妙设计每一帧都是时间的纯函数——给定时间t就能算出同一帧。正因如此任意帧可以乱序、并行渲染也为下一步随时抽查任意时刻的自查打下了基础。第三步Contact Sheet 自查AI 给自己当审片人 这是 ClaudeAnimationBase 最有意思的一步读代码看不出动效AI 就把自己渲染出来的图打开来看。渲染器 render.mjs 提供三种审片工具# Contact Sheet每个镜头的首、中、尾帧看整部片子的形状 node render.mjs --sheet0.1,0.8,1.6,2.4 --cols6 --w320 --outout/check/sheet.jpg # Strip某时间段的每一帧专查运动转身、起跳、转场 node render.mjs --strip2.1:2.6 --cols6 --w320 --outout/check/strip.jpg # Crop全分辨率局部放大查脸、查道具与手的接触点 node render.mjs --sheet2.3,2.4 --crop760,420,500,400 --w500 --outout/check/face.jpgAI 拿到图后要逐项对照检查完整清单见 ANIMATION_GUIDE.md 的 Review loop 一节看得懂吗每个镜头的事件仅凭 Contact Sheet 就能读出吗Clawd 够大、和背景分得开吗节奏把 sheet 按帧序读每个信息点有几帧24 帧 1 秒一闪而过的 reads 必然被观众漏掉运动每个动作有预备anticipation和跟随follow-through吗帧与帧之间有跳变吗接触点脚踩在地上吗手里的东西贴着指尖吗规则有没有出现文字、3D、死气沉沉的空镜头发现问题就修修完再看。指南给出了明确预算每个镜头至少一张 sheet、每段关键运动和转场一张 strip、每个承载剧情的脸一张 crop——Contact Sheet 渲染只需每帧 0.1~1 秒便宜到不许跳过。第四步一键渲染 MP4 成片 ️自查通过后成片一步到位npm install node render.mjs --clip --outout/video.mp4长片可以并行渲染帧再编码支持断点续传node render.mjs --frames --workers4 # 并行渲染 JPEG 帧到 out/frames node render.mjs --encode --outout/video.mp4 # 再编码为 MP4环境要求Node.js、Google Chrome 和 ffmpeg。两个性能贴士无独立显卡时p5.brush 的水彩填充较慢秒/帧级。可以加--soft-gl用软渲染或干脆让 AI 把水彩填充换成别的画法[gpu_probe.mjs](https://link.gitcode.com/i/a715263bd0aa8259acdfb59ca77c0b27)可探测 Chrome 实际用到的渲染器无头 Linux NVIDIA GPU的云端机器加--gpu-anglegl-egl或vulkan即可走 GPU想先看效果上面第二条命令渲染的正是 src/scenes/demo.js 里 11 秒的示例短片《The fallen star》——注意官方提醒demo 只用来验证工具链不要照抄它的故事和镜头结构。在 Chrome 中打开 studio.html 可以逐帧拖拽预览?loopemotions还能循环播放表情表。新手避坑清单 ⚠️指南总结了让 AI 动画一眼假的常见失败开片前可以对照自查字幕、气泡文字、写着台词的牌子——画面里别出现文字用画出来的符号!、汗滴、爱心代替Clawd 全程站在大空景里当小不点——中景里它应该占够大的画面比例所有东西以同一个速度动、事件叠着发生——快的给动作慢的给含义表情啪地切换——必须走emotions()带预备、眯眼和落点硬切满天飞——每处接缝都要有转场笔刷擦除、iris、甩镜、动作切……写在最后 ClaudeAnimationBase 的价值不在于能生成动画而在于把资深动画师的分镜习惯、时间轴思维和审片流程全部写成了 AI 可执行的规则先有分镜再搭镜头用 Contact Sheet 反复自查最后渲染 MP4。把 ANIMATION_GUIDE.md 喂给 Claude Code丢一句做一支 15 秒 Clawd 追蝴蝶的视频你收获的是一整条可复用的动画生产线而不只是一个文件。赞分享【免费下载链接】ClaudeAnimationBaseA starter kit for animating hand-painted cartoons with Claude: p5.js p5.brush, the Clawd character, 31 acted emotions and a guide for the model项目地址https://gitcode.com/gh_mirrors/cl/ClaudeAnimationBase点击查看免费下载相关推荐Krita-AI-Diffusion动画工作流从分镜到成片AI辅助方案Krita AI Diffusion动画工作流从分镜到成片AI辅助方案 Krita AI Diffusion作为Krita的AI生成插件提供了从分镜草图到成AI 应用媒体生成本地部署终极AI视频创作自动化指南从脚本到成片的智能工作流程解析终极AI视频创作自动化指南从脚本到成片的智能工作流程解析 ShortGPT是一款强大的AI视频自动化框架能够简化视频创建、素材获取、配音合成和编辑等任务。无人工智能AI 应用媒体生成语音AI漫画创作自动化工作流从脚本到成品仅需3小时的革命性工具AI漫画创作自动化工作流从脚本到成品仅需3小时的革命性工具 TaleStreamAI作为业界领先的AI漫画创作自动化平台彻底重塑了传统漫画制作流程。通过先进人工智能AI 应用媒体生成语音大模型创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考