Xiaoma Studio

用代码做「Opus 5.5 爆款级」动效视频、HTML 幻灯片和有动效的官网 / 落地页 / 展厅大屏页：知识科普、品牌/产品发布片、motion reel、歌词 MV、数据叙事、纪录片风短片、可演讲也可导出视频/PDF 的 HTML slides、带交互演示的产品官网。视频规则来自抖音/X/YouTube 30 条高赞 Opus 5.5 视频的逐帧拆解，网页规则来自一个真实上线官网的多轮走查反馈；附确定性渲染引擎（HTML→MP4）、代码合成配乐音效、网页骨架、多宽度截图体检、字体与 logo 工具，以及配图配视频的审美规则。当用户要做动画视频、动效、宣传片、MV、解说视频、片头、showreel、PPT/幻灯片/演示文稿、把文章或数据做成视频、做官网/落地页/产品展示页/展会大屏页、给页面或视频配图配视频时使用。任何能写代码的模型或 agent 都能用。

16 stars 1 forksDocuments & Office Files

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add crawfordxx/xiaoma-studio --skill xiaoma-studio

Manual install

git clone --depth 1 https://github.com/crawfordxx/xiaoma-studio.git /tmp/xiaoma-studio
mkdir -p ~/.claude/skills
cp -r /tmp/xiaoma-studio/. ~/.claude/skills/xiaoma-studio

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# xiaoma-studio

一句话：**每一帧都是时间 t 的纯函数，先看拼图再出片。**

这份 skill 把 30 条高赞 Opus 5.5 视频（抖音 12 / X 10 / YouTube 8，最高 60 万赞、64 万播放）归纳成可执行的工作流、审美规则和一套渲染引擎。照着做，任何模型都能产出同一标准的视频和幻灯片。

做**网页**（官网、落地页、展厅大屏）走另一条线：网页是实时的，不是 `f(t)`，直接跳到下面的「网页」一节。

## 环境

```bash
cd <skill>/engine && npm install          # 只装 playwright-core；浏览器复用本机 Chrome / Playwright 缓存
# 另需：ffmpeg、python3 + numpy（scipy 可选，加速音频合成）
```

找不到浏览器时：`npx playwright install chromium-headless-shell`，或设 `CHROME_PATH`。

## 工作流（不要跳步）

1. **Brief**：弄清楚主题、时长、画幅（16:9 / 9:16 / 1:1）、受众、有没有品牌素材 / 音乐 / 旁白。缺的按默认值来，不要卡住（默认值：16:9、30–60 秒、纯音乐 + 字幕叙事）。
2. **选风格原型**：从 `references/aesthetics.md` 的 10 个原型里选一个，整片只用这一个。题材和原型的对应关系见同一文档开头的选型表。
3. **写 STORYBOARD.md**：按 `templates/STORYBOARD.md` 写。要有一句话 logline、钩子、按拍排的镜头表、每个镜头要让观众「读到」什么、转场、首尾怎么呼应。写完先对照 `references/storyboard.md` 的检查表自查。有用户在场时，先给用户看分镜。
4. **搭合成**：`node engine/init.mjs <项目目录> video|slides` 建一个自包含项目（模板 + 运行时 + STORYBOARD.md），只改内容和镜头函数，不改 engine。动效写法见 `references/motion.md`，引擎 API 和坑见 `references/code-rules.md`。
5. **拼图自检循环**（最关键的一步）：
   ```bash
   node engine/render.mjs comp.html --sheet out/sheet.jpg      # 默认每拍一帧；--every 1 = 每秒一帧
   ```
   再跑一遍不需要看图的自动检查（每轮都跑，不能读图的模型更要靠它）：
   ```bash
   node engine/lint.mjs comp.html        # 确定性（乱序渲染 = 顺序渲染）/ 文字对比度 / 文字重叠
   ```
   **能读图就打开图片亲自看**；不能读图的模型以 lint 全绿 + `--stills` 关键帧的像素统计为准，并在报告里写明「未目视检查」。按 6 项各打 1–10 分：前 2 秒钩子、手机尺寸可读性、动效质量、变化密度、风格一致、声画同步。修最差的 3 处，重出拼图，直到每项 ≥ 8 才进下一步。单个时刻用 `--stills 2.5,7.0 --dir out/stills` 看原尺寸。

Read the full skill on GitHub

Details

Skill name: xiaoma-studio
Repository: crawfordxx/xiaoma-studio
License: MIT
Repo updated: 23 October 2026

FAQ

What does the Xiaoma Studio skill do?

How do I install the Xiaoma Studio skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add crawfordxx/xiaoma-studio --skill xiaoma-studio. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Xiaoma Studio popular?

It lives in crawfordxx/xiaoma-studio, which has 16 GitHub stars and 1 forks.

Related skills

Norteia Formaciones

Luispitik/norteia-formaciones

Skill de NorteIA para generar programas de formación completos, profesionales y auditables, módulo a módulo. Genera 4 entregables por módulo: Guía del Formador (DOCX), Presentación PPTX, Manual del Participante (DOCX) y Evaluaciones con clave de respuestas (DOCX). USAR SIEMPRE cuando el usuario diga "genera la formación para", "prepara el curso de", "crea el módulo de", "formación sobre", "programa formativo", "curso para", "módulo de formación", "prepara la formación", "training", "genera los materiales de", o cualquier referencia a crear contenido formativo, materiales didácticos, cursos, ta

Documents & Office Files

Job Matcher

sangowu/job-matcher-skill

根据用户简历(CV)和求职意向，抽取CV结构化字段、实时检索匹配职位、生成可交互HTML报告。当用户提供简历文件(pdf/docx/txt/md)或粘贴简历文本，并希望找工作、匹配职位、获取职位推荐、做求职匹配时使用。

Documents & Office Files

Handwriting to Latex

yangcodingmaster/Claude-Code-Skill-handwriting-to-latex

Use this skill whenever the user uploads handwritten notes, problem sets, scanned documents, or iPad handwriting PDFs and wants them converted into LaTeX format. Trigger phrases include: convert to LaTeX, transcribe to tex, handwriting to LaTeX, LaTeX this, typeset my notes, put this in Overleaf format. Activate proactively whenever the user uploads an image or PDF containing mathematical expressions or handwritten academic content.

Documents & Office Files

Extend Slides

L01nki1/extend-slides

在已有课程资料（PPT/PPTX、讲义、教材、课堂录音转写、Word、Markdown、扫描件与截图）基础上，为大学课程生成「只增不删、保留原知识脉络」的中文扩展讲解文档，供复习使用。USE FOR: 课件扩展讲解、PPT 转复习笔记、讲义扩写、lecture slides / course notes 扩展、录音转写整理成章节讲义、按章节生成中文讲解、公式推导与例题解法展开、中英术语对照、考点梳理。DO NOT USE FOR: 批改作业或试卷、生成 PPT 文件、重构或压缩原有知识体系、非课程类文档的润色翻译摘要、单纯 OCR 或单纯翻译。

Documents & Office Files

Latex

hameefy/claude-latex-skill

Produces compilable LaTeX for researchers in numerical optimisation and applied mathematics. Use for theorems, proofs, convergence analysis, algorithms, tables, TikZ figures, derivations, literature reviews, or structured academic documents, and for requests such as "write up", "typeset", "format in LaTeX", "produce a .tex file", or "give me the LaTeX for". Covers numerical optimisation, nonlinear equations, deep learning theory, and numerical analysis; inverse problems, EIT, and PINNs are supported through an optional reference file. Three modes: (1) DOCUMENT MODE, a full standalone article;

Documents & Office Files

PDF Markup

hamzaabduljabbar/claude-pdf-markup-skill

Perform bulk markup operations on PDF drawing sets without needing Bluebeam Max. Searches markups by criteria and changes them in bulk, adds standard stamps to multiple sheets, updates comment text consistently, applies stamps like "Not for Construction" or "Revised" across a drawing set, or extracts all markups into a register. Trigger on phrases like "mark up these drawings", "bulk markup change", "add a stamp to all sheets", "use my pdf markup skill", or any request to apply or modify markups on PDF drawings programmatically.

Documents & Office Files

Browse the most popular Claude skills, all documents & office files skills, or write your own with the skills generator.