跳过主要内容
ANY
Skill免费GameSkill 出品 · 调优版

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 出品
下载 ZIP

我们测过

在 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 流程加上可运行示例、测试报告、自检清单和中文指南。

下载测过的 ZIP(450 KB)路线图:发布与运营

协议:基于 chessunyan/renoise-motion-skills(作者 chessunyan),协议 MIT。ZIP 保留协议文件(LICENSE),CHANGES.md 列出了 GameSkill 加的所有文件。

Pixel Blocks Motion: 8-bit motion graphics drawn by code

自检清单

  • 先写节拍分镜表再写场景 / 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 测过的版本

测过的版本装到 .claude/skills/
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, plus render.mjs, chip.mjs and bake-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。

相似 skills