Как мы создали маскота Puskie: комикс, спрайт-листы и «живая скрепка» для студии
От логотипа-паука до character sheet, комикс-панелей в блоге и покадровой анимации в лаборатории: пайплайн Gemini → slice → manifest, отличие от Cursor Agent и подключение CLI.
**Puskie** — не «ещё один чат-бот в углу сайта», а персонаж бренда Пуск‑Медиа: тот же паук, что в комикс-статьях про SEO и маркетинг, только в формате **покадровой анимации** и консультанта в лаборатории `/puskie-lab`.
Финальный вид — **PNG через GenerateImage в Cursor** (основной путь, см. `docs/puskie/GENERATION-TOOLS.md`) или Google Gemini / OpenAI с жёстким character lock и turnaround-листом. Ниже — весь маршрут, который можно повторить у себя.
- Лаборатория Пуски — Живой прототип: анимация + чат + аудит URL.
- Комикс-книга — Формат «нижка» с разворотом сцен по клику.
Три контура: не путать Cursor, project-dev и Puskie
**Cursor Agent / Composer** — разработка кода в IDE. Маскот туда не встраивается.
**CLI project-dev** (на VPS) — деплой сайтов клиентов, SSH, ветки. Отдельный продукт.
**CLI `puskie`** — консультант студии: база знаний, анимация, аудит URL, команды генерации ассетов. В репозитории `puska-landing` есть обёртка `scripts/puskie-cli.mjs` и dev API `npm run puskie:api` (прокси Vite → `/api/puskie`).
На VPS ваш основной CLI можно вызывать те же npm-скрипты через `spawn`, как описано в `docs/puskie/CLI-INTEGRATION.md`. Отдельного репозитория CLI в папке Downloads мы не нашли — укажите путь к проекту на сервере, и команды `puskie sprite gen` привяжем к нему один в один.
Шаг 0: Character bible и turnaround
Персонаж зафиксирован в `scripts/lib/studio-comic-character.mjs`: фиолетовый #671be3, два больших глаза, восемь ног, pop-art контур, без «реалистичного» паука.
Команда `npm run generate:studio-comic-character` генерирует **character-sheet-turnaround.png** (4 позы на белом фоне) и опционально **character-front-hero.png**. Референс — логотип из `public/brand/`.
Этот лист обязателен для всех следующих генераций: комикс-панели в блоге, обложки и спрайт-листы маскота. Без него модель «уплывает» в другого персонажа.
Шаг 1: Комиксы в блоге (статика)
Статьи с `comicStrip` / `comic` в `src/data/blog/content/` получают панели через `npm run generate:studio-comic` — каждая сцена с тем же CHARACTER_LOCK и референсом листа.
Комикс-книга `/komiks` собирает кадры из статей; по клику сцена **разворачивается на месте** (без модалки): крупный кадр → абзацы из статьи → практический вывод.
Шаг 2: Спрайт-лист для анимации
Принцип **«без смещения»**: один PNG с сеткой N×M на чистом белом #FFFFFF, одинаковый масштаб и базовая линия ног в каждой ячейке. Промпты — в `scripts/lib/puskie-sprite-prompts.mjs`.
Пресеты: `idle-blink` (4×2), `talk-a` / `talk-b` (4×3), `weave` (3×2), `read-tablet` (2×2). Генерация: `npm run generate:puskie-sprite-sheet -- --preset idle-blink`.
Резка: `scripts/slice-puskie-sprite-sheet.mjs` → папка `frames/` + `manifest.json` (fps, размер ячейки, путь к sheet).
Плеер `PuskieSpritePlayer` крутит **один CSS background** по листу — без мерцания между отдельными файлами. В лаборатории при ответе включается `talk-a`, в покое — `idle-blink`.
Шаг 3: Один скрипт для всех ассетов
```bash
npm run puskie:assets
```
Последовательно: turnaround (если нет) → idle-blink → talk-a → weave → read-tablet. Нужен `GEMINI_API_KEY` в `.env`.
Без API: `npm run puskie:brief-idle-rest` → сгенерировать кандидата в Cursor (GenerateImage) → `puskie:install-idle-rest-candidate`.
Шаг 4: CLI и лаборатория
Терминал 1: `npm run puskie:api` (порт 8787). Терминал 2: `npm run dev` — Vite проксирует `/api/puskie` на API.
Чат в UI вызывает `POST /api/puskie/chat` → ответ + имя анимации. URL в сообщении → режим `read-tablet` и карточка аудита (сейчас заглушка, далее Playwright на VPS).
Из CLI: `node scripts/puskie-cli.mjs chat "Сколько стоит SEO-аудит?"` — тот же backend.
Качество: что проверяем глазами
Контур тела не должен «прыгать» больше 2 px между кадрами — иначе анимация дёргается.
Чередование `talk-a` / `talk-b` даёт живость без отдельного слоя «только рот».
Production-лист — `sheet.png`; dev — `sheet-dev.png`. Хук `usePuskieManifest` подхватывает лучший доступный файл.
Puskie v2: expert-fuzzy и эфир (май 2026)
**Старые статьи и комиксы не перерисовываем** — там остаётся герой v1 (канон 3D). Для новых материалов эталон — **expert-fuzzy**: ворсистый экспертный паук с асимметричными пятнами на лбу, turnaround в `reference/expert-fuzzy-*.png`.
Публичный эфир: **`/puskie-stream`** — общий чат, ответы текстом (голос позже). CLI (`npm run puskie:api`) возвращает **JSON**: `reply`, `characterVersion`, `playback.steps[]` с id анимаций из библиотеки (`talk-a`, `talk-b`, `read-tablet`, `weave`…). UI проигрывает очередь — рот и жесты без ручного переключения.
Режим **Digest**: за N минут выбирается лучший вопрос из чата и отвечается одним разворотом — удобно для «стрима» с настройкой окна в API.
Ассеты v2: `public/imagery/puskie/characters/expert-fuzzy/animations/` — пока fallback на v1-листы, генерация: `npm run puskie:brief-expert-fuzzy-streamer` и пайплайн pass-idle-v2 с новым референсом.
- Puskie Live (стрим v2) — Общий чат, JSON playback, режимы Live и Digest.
- Puskie v1 (legacy) — Прежний канон для сравнения.
Что дальше
Подключить реальный краулер аудита на VPS в режиме `puskie-consultant`.
Связать оплату «улучшение под ключ» с project-dev после передачи доступов.
Голос в эфире (TTS) поверх того же JSON playback.
- Комикс-книга — Все выпуски Puskie — клик по кадру открывает разворот с текстом статьи.
- Карусели для соцсетей — Скачать все слайды серии в 1080×1080.
- Лаборатория Puskie — Живой прототип: анимация, чат, аудит URL.
- Стикер-пак — Скачать PNG для Telegram.