Pixel Blocks Motion: 8-bit motion graphics drawn by code
/pixel-blocks-motion
Make pixel-art motion graphics for a game (launch intro, level-up clip, data story, title card) entirely with code: a beat-locked storyboard, a scene drawn on a 320×180 framebuffer, probe stills, then an MP4 or GIF from ffmpeg in about a second, with synthesised chiptune sound effects. No browser, no npm packages, no API key.
- 许可证
- MIT
- 出品
- GameSkill 出品
我们测过
在 Node + ffmpeg (the skill's own render.mjs, no browser) 上通过 37/37 项检查(2026-11-03):能触发、有可运行示例、有截图和自检清单、单一职责、中英文文档齐全。触发检查是把提示词和 skill 描述做匹配,不是真实 agent 运行。
测试报告这个 skill 做什么
什么时候触发
Make pixel-art motion graphics in the Pixel Blocks style (deep navy pixel grid, four arcade inks, words and charts built block by block, stepped 12 fps motion, chunky bitmap type …
GameSkill 测过的版本
GameSkill 调优版:skill 文件取自提交 dc14835d302d,按我们的 skill 流程加上可运行示例、测试报告、自检清单和中文指南。
协议:基于 chessunyan/renoise-motion-skills(作者 chessunyan),协议 MIT。ZIP 保留协议文件(LICENSE),CHANGES.md 列出了 GameSkill 加的所有文件。
自检清单
- 先写节拍分镜表再写场景 / Write the beat storyboard before the scene
- 所有位置都从 step(t) 算,不用原始 t / Every position comes from step(t), never raw t
- cues() 和 draw 用同一套时间常量 / cues() uses the same timing constants as draw
- 渲染前先出探针截图表并检查 / Probe stills and check the contact sheet before the full render
- 只用四种街机色加白色,不要渐变和抗锯齿 / Only the four arcade inks plus white; no gradients or anti-aliasing
- 发布作品用自己的角色、音乐和字体 / Use your own hero, music and font for published work
中文指南
这个 skill 做什么
完全用代码做像素风动效:先按节拍写分镜表,再在 320×180 的帧缓冲上画场景,出探针截图表检查,最后用 ffmpeg 大约 1 秒渲染出 MP4 或 GIF。音效由场景里的 cue 现场合成 8-bit 声音,和画面用同一套时间,不会错位。不需要浏览器、npm 包或 API key。
什么时候用
- 给像素或街机风格的游戏做发布开场、升级/成就短片、标题卡
- 做 8-bit 风格的年度回顾或数据图表动画
怎么装
下载本页 ZIP,把 pixel-blocks-motion/ 放进 agent 的 skills 文件夹:Claude Code 用 .claude/skills/,Codex、Gemini CLI、OpenCode 用 .agents/skills/,Cursor 用 .cursor/skills/,Copilot 用 .github/skills/,Windsurf 用 .windsurf/skills/。需要 Node 18+ 和 ffmpeg;要做中日韩文字时再装 Pillow。也可以直接对 agent 说:Install the skill from https://gameskill.dev/skills/pixel-blocks-motion/install.md
和原仓库的区别
原作者在 THIRD_PARTY.md 里写明,番茄吉祥物、水印、生成的 chiptune 音乐和从冬青黑体(Hiragino)栅格化的中文字形表不在 MIT 范围内。GameSkill 的版本去掉了这些,换成我们自己的:用四种街机色画的像素灯笼主角、用 skill 自带的 chip 音色合成的 24 秒 chiptune、用 Noto Sans CJK(SIL OFL 1.1)重新烘焙的字形表。每处改动都写在 ZIP 里的 CHANGES.md。
最小示例
gameskill/examples/lantern-run.mjs 是我们写的 8 秒发布开场「LANTERN RUN」:标题一个字母一个八分音符地由方块落下拼出,灯笼主角跳着吃金币填满进度条,重拍上闪屏,最后停在闪烁的 PRESS START。
我们怎么测的
总分 37/37,结果在 gameskill/test-report.json。检查了品牌素材确实没有打包(番茄、原 chiptune、冬青黑体字形表、水印都不在,文件和代码里也不再提番茄);我们的字形表来自 Noto Sans CJK,覆盖示例用到的每个字,字形完整没有被裁掉;我们的 chiptune 是 24 秒、可重复生成、中间没有静音。原仓库的三个示例和 16 秒合辑都能渲染出带音乐和音效的 MP4;探针截图里没有番茄的颜色、颜色数少于 40(没有抗锯齿)。我们的 Lantern Run 示例:截图表、同一帧两次渲染逐字节相同、最后一帧标题和 PRESS START 都亮着、第 12 拍闪屏反色、MP4 响度在 -14 LUFS 附近、GIF 640×360。另外修了一个问题:用 Noto Sans CJK 烘焙时原脚本会把字的下半截裁掉,我们让它把字垂直居中(写在 CHANGES.md)。
搭配
pixelfx:像素特效循环game-trailer-from-code:代码做的游戏预告片
安装
告诉你的 AI
Install the skill from https://gameskill.dev/skills/pixel-blocks-motion/install.md
GameSkill 测过的版本
mkdir -p .claude/skills
curl -fsSL https://gameskill.dev/dl/skills/pixel-blocks-motion.zip -o /tmp/gameskill-pixel-blocks-motion.zip
unzip -oq /tmp/gameskill-pixel-blocks-motion.zip -d .claude/skills
rm /tmp/gameskill-pixel-blocks-motion.zip包含内容
- A style contract: navy pixel grid, four arcade inks, stepped 12 fps motion, 5×7 bitmap type
- pixel.mjs: a tiny framebuffer engine with beat clock, falling blocks, hops, rolling numbers and sprites
- render.mjs: probe-still contact sheets and a 1-second MP4 or GIF render through ffmpeg
- chip.mjs: chiptune sound effects synthesised from the scene's cues, so sound never drifts off picture
- Three example scenes (launch intro, data story, level-up) and a CJK glyph baker
适合
- A short launch intro, level-up or achievement clip for a pixel or arcade game
- A year-in-review or player-stats chart in an 8-bit style
不适合
- Single pixel-art illustrations or sprites (codixel, pxl)
- Live-action or realistic footage
试试这条提示词
Make an 8-second 16:9 Pixel Blocks launch intro for my game Lantern Run: the title lands block by block, the hero collects coins that fill a bar, flash on the drop, end on PRESS START.关于这个 Skill
Make pixel-art motion graphics in the Pixel Blocks style (deep navy pixel grid, four arcade inks, words and charts built block by block, stepped 12 fps motion, chunky bitmap type, chiptune sound effects) entirely with code. A brief becomes a beat-locked storyboard, a scene module drawn on a 320×180 framebuffer, probe stills, then an MP4 or GIF rendered by ffmpeg in about a second, with no browser and no npm packages.
From the pixel-blocks SKILL.md in chessunyan/renoise-motion-skills.
What's inside
- The style contract and its tokens (ground, grid, inks, canvas, motion, blocks, type, sprites)
- Workflow: brief, storyboard on the beat, build the scene, probe stills, render and mix
- Engine reference for
scripts/pixel.mjs, plusrender.mjs,chip.mjsandbake-glyphs.py - Example scenes: launch intro, data story, level-up, and a 16-second reel
- Gotchas found while making the showcases
GameSkill’s copy
The author’s tomato mascot, generated chiptune track and Hiragino-derived glyph tables are not under the MIT licence, so they are not in this ZIP. In their place: a pixel lantern hero drawn in the four arcade inks, a chiptune loop synthesised with the skill’s own chip voices, and glyph tables baked from Noto Sans CJK (SIL OFL 1.1). Use your own hero, music and font for published work.
环境要求
- Node.js 18+ and ffmpeg
- Python 3 with Pillow, only for CJK glyph tables
常见问题
基于 chessunyan/renoise-motion-skills (作者 chessunyan,协议 MIT)。ZIP 里保留原作者的 LICENSE 和 NOTICE,ATTRIBUTION.md 和 CHANGES.md 写明来源提交和 GameSkill 加的内容。
搭配使用
作者标注的相关 Skills,或更适合相邻任务的 Skills。
pixelfx
244 pixel-art effects written as code (fire, explosions, magic, weather, UI, pickups, critters) plus a draft, render, look, refine loop for making new ones; every effect exports a sprite sheet with Aseprite-style JSON for Godot, Unity, Phaser or any engine.
Game Trailer from Code (Steam trailer and store images)
A GameSkill original: turn your own running game into a 15-second Steam gameplay trailer and every store image with code. Frame-exact capture, a JSON cut list, zh/en captions and SRT, a soundtrack synced to game events, an H.264/AAC encode, and a checker for Steam's trailer rules, loudness, the 6-second microtrailer and the capsule sizes.
Codixel
A pixel-art skill built on one idea: the agent writes code, it is not a painter. It asks for a reference image, then removes the background, pixelates, rigs with bones and animates it in code with a 2,000-line toolkit (core/pixel.js), showing every step on a sheet before making game files.
相似 skills
Effekseer VFX (game effects as code, checked in a real Godot render)
Two agent skills from KanaWorks_AI: effekseer-vfx writes game effects (hits, slashes, projectiles, explosions, beams, shields) as Python recipes, compiles them with the official EffekseerCore and reviews them as filmstrips rendered in Godot; vfx-review is the independent reviewer that scores them. Video-model flipbooks and Unity URP element skills are optional routes.
open-game-skills
An MIT pack of about 190 SKILL.md agent skills for game design: combat feel, camera, traversal, world, validation, 2D/Spine and art pipeline, with a dispatcher and adapters for Three.js, PixiJS, Phaser, Cocos, Godot, Unity and Unreal.
Underhood
Five free Claude skills for modding games you own: recon, reverse engineering (.NET, IL2CPP, native, pak AES keys, unknown formats), building and testing the mod in game, local art via ComfyUI, and release.
Universal Modder
Skills, tools and a fal MCP that let Claude Code mod PC games you own: recon, reverse engineering, generated assets, in-game testing.