# huashu-motion

Собирает motion graphics, launch-видео и explainers из редактируемого кода. Пригодится, когда нужно править конкретные кадры через живой просмотр.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 827 установок · ★ 1702
- Автор: 花叔
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/alchaincyf/huashu-motion/tree/HEAD/skills/huashu-motion/SKILL.md
- Обновлён: 2026-10-22
- HTML: https://affpapa.org/nevibecode/skills/huashu-motion

## Что делает

huashu-motion превращает ролик в одну HTML-композицию `index.html` с HTML и GSAP. Она покадрово рендерится в установленном Chrome, а пользователь смотрит результат в студии, указывает на нужный фрагмент и получает правку именно там. Скилл рассчитан на motion graphics, launch-видео и explainers.

Внутри есть CLI `om`: он забирает материалы продукта через `om grab`, создаёт проект командой `om new`, запускает студию через `om studio`, ждёт комментарии через `om inbox`, сохраняет отмеченные кадры через `om look` и рендерит результат командой `om render`. Есть также проверка `om check`, контроль готового рендера через `om qa`, звук, озвучка, субтитры, шрифты и экспорт GIF, MOV или WebM.

Проект должен содержать ровно одну корневую HTML-композицию; черновики и исходники складываются во вложенную папку. `om check`, `om still`, `om look`, `om sound` и `om render` используют установленный Chrome, а `om studio` поднимает сервер на `127.0.0.1`. Если песочница блокирует браузер или локальный сервер, их нужно запускать за её пределами после согласования с пользователем.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add alchaincyf/huashu-motion --skill huashu-motion -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/huashu-motion/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/huashu-motion/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add alchaincyf/huashu-motion --skill huashu-motion -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/huashu-motion/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add alchaincyf/huashu-motion --skill huashu-motion -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/huashu-motion/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install alchaincyf/huashu-motion huashu-motion
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/huashu-motion/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add alchaincyf/huashu-motion --skill huashu-motion -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/alchaincyf/huashu-motion --path skills/huashu-motion
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/huashu-motion/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add alchaincyf/huashu-motion --skill huashu-motion -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/alchaincyf/huashu-motion/tree/HEAD/skills/huashu-motion/SKILL.md

## Когда брать
- собрать launch-видео из материалов продукта
- создать motion graphics в `index.html`
- показать кадр и изменить отмеченный фрагмент
- проверить текст, перекрытия и motion перед рендером
- добавить музыку, эффекты, озвучку и субтитры

## Примеры запросов агенту
- Сделай launch-видео для моего проекта: сначала собери материалы через `om grab`, затем покажи результат в студии.
- Запусти `om check` для проекта и исправь проблемы с текстом, перекрытиями и движением.
- Возьми комментарий пользователя через `om inbox`, посмотри отмеченный кадр командой `om look` и обнови композицию.

## Похожие
- [huashu-design-html-native](https://affpapa.org/nevibecode/skills/huashu-design-html-native.md) — скилл · 426 установок
- [huashu-slides](https://affpapa.org/nevibecode/skills/huashu-slides.md) — скилл · 833 установки
- [motion-design](https://affpapa.org/nevibecode/skills/motion-design.md) — скилл · 19900 установок
- [design-motion-principles](https://affpapa.org/nevibecode/skills/design-motion-principles.md) — скилл · 12700 установок
- [framer-motion-animator](https://affpapa.org/nevibecode/skills/framer-motion-animator.md) — скилл · 11100 установок
- [motion-framer](https://affpapa.org/nevibecode/skills/motion-framer.md) — скилл · 5900 установок

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md