# particle-system

Скилл для ИИ-кодинга, который помогает агенту собрать систему частиц: конфетти, снег, дым, искры, сетку из точек и GPU-частицы на Three.js Points.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 1400 установок · ★ 44
- Автор: iart-ai
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/iart-ai/webgl-animation-skills/tree/HEAD/skills/particle-system/SKILL.md
- Обновлён: 2026-06-22
- HTML: https://affpapa.org/nevibecode/skills/particle-system

## Что делает

Скилл описывает, как вести много мелких элементов простыми правилами на каждую частицу и получать органичное движение. Внутри — цикл интегрирования состояния частицы: силы складываются в ускорение, скорость и позиция обновляются за кадр, частица стареет и перерождается. Автор советует полунеявный метод Эйлера и ограничение `dt` через `Math.min(dt, 1/30)`, иначе зависшая вкладка разносит симуляцию.

Дальше идут готовые куски кода: список функций-сил (гравитация, сопротивление, притяжение к точке с ослаблением сингулярности), flow field по шуму и настоящий curl noise через конечные разности. Отдельно разобраны два режима эмиссии — залп для конфетти и искр против постоянного потока для снега и дыма. Конфетти выглядит конфетти из-за вращения, плоских прямоугольников, гравитации и сопротивления воздуха, а не из-за круглых точек.

Для сетки связанных точек есть пространственная сетка: наивная проверка всех пар растёт как O(n²) и умирает после примерно 300 частиц, а разбиение по ячейкам с обходом восьми соседей даёт O(n). Для тысяч частиц предлагается `BufferGeometry` с `Points` и анимация в вершинном шейдере. Нужна библиотека шума вроде simplex-noise, если берёте flow field.

Скилл рассчитан на Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode.

## Установка

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

1. **Через Skills CLI (Vercel)**
```bash
npx skills add iart-ai/webgl-animation-skills --skill particle-system -a claude-code
```

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

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add iart-ai/webgl-animation-skills --skill particle-system -a codex
```

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

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add iart-ai/webgl-animation-skills --skill particle-system -a cursor
```

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

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install iart-ai/webgl-animation-skills particle-system
```

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

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add iart-ai/webgl-animation-skills --skill particle-system -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/iart-ai/webgl-animation-skills --path skills/particle-system
```

### Windsurf (Devin Desktop)

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

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add iart-ai/webgl-animation-skills --skill particle-system -a opencode
```

### Claude.ai

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

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

## Когда брать
- собрать фон из связанных точек без падения fps
- сделать залп конфетти с вращением и гравитацией
- пустить снег с покачиванием и разной глубиной
- нарисовать дым или искры через эмиттер
- отрендерить десятки тысяч частиц на GPU

## Примеры запросов агенту
- сделай систему частиц для конфетти по клику на кнопку
- нужен фон-созвездие из точек, которые соединяются линиями рядом
- добавь flow field из curl noise для фоновых частиц

## Похожие
- [build-interactive-particle-trail](https://affpapa.org/nevibecode/skills/build-interactive-particle-trail.md) — скилл · 1100 установок
- [globe-particles](https://affpapa.org/nevibecode/skills/globe-particles.md) — скилл · 1400 установок
- [pixijs-scene-particle-container](https://affpapa.org/nevibecode/skills/pixijs-scene-particle-container.md) — скилл · 5800 установок
- [threejs-shaders](https://affpapa.org/nevibecode/skills/threejs-shaders.md) — скилл · 15600 установок
- [threejs](https://affpapa.org/nevibecode/skills/threejs.md) — скилл · 3400 установок
- [threejs-aaa-graphics-builder](https://affpapa.org/nevibecode/skills/threejs-aaa-graphics-builder.md) — скилл · 3200 установок

Из того же набора: [iart-ai/webgl-animation-skills](https://affpapa.org/nevibecode/by/iart-ai/webgl-animation-skills.md) — 3 карточки

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

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