Как собирать такие презентации с нуля

Что поставить, в каком порядке работать, чем ревьюить и на какие грабли не наступать второй раз.

2026-08-07 · собрано по итогам сборки дека Levitan (слайды 1–5)

Что поставить

1. Higgsfield CLI — генерация картинок, видео и 3D

npm i -g @higgsfield/cli
higgsfield auth login          # откроет браузер, порт 8765
higgsfield workspace list      # покажет id
higgsfield workspace set <workspace_id>
higgsfield account status      # проверка: email, план, кредиты
Важно: MCP Higgsfield с Claude Code не работает. У них в Clerk зарегистрирован callback claude.ai, а Claude Code слушает случайный порт localhost, поэтому авторизация падает с invalid_request: redirect_uri does not match. CLI использует зарегистрированный клиент и фиксированный порт — проходит с первого раза. Это не обход, а их же рекомендованный путь.

Проверка, что связь живая, — не «Connected» в списке серверов, а реальный ответ higgsfield account status с планом и балансом.

2. Скиллы Higgsfield

cd /tmp/hf-skills && npx -y skills@latest add higgsfield-ai/skills -y
# скиллы окажутся в ./.agents/skills — скопировать нужные:
cp -R .agents/skills/higgsfield-generate   ~/.claude/skills/
cp -R .agents/skills/higgsfield-brandkit   ~/.claude/skills/
cp -R .agents/skills/higgsfield-websites   ~/.claude/skills/
cp -R .agents/skills/higgsfield-product-photoshoot ~/.claude/skills/

Из девяти скиллов репозитория для дека нужны эти четыре. Остальные (game-generation, marketplace-cards, youtube-thumbnail, soul-id, video-explainer) только съедают контекст каждой сессии.

higgsfield-brandkit — главный для этой задачи: он умеет палитру, знак, типографику и деки, причём собирает их локально и детерминированно. В нём прямо запрещено просить картиночную модель нарисовать «похожее на слайд» — текст остаётся текстом.

3. Системные утилиты

brew install imagemagick librsvg
brew install --cask libreoffice     # нужен только для пути через PPTX
ИнструментЗачем
rsvg-convertрастр из SVG для просмотра знака
magickобрезка знака по контенту, нарезка слайдов, контактные листы
sofficeрендер PPTX в PDF для проверки — только если идёте в PowerPoint
Google Chromeрендер слайдов в PNG и печать в PDF, headless
python3 + Pillowскрипты brandkit, обработка ассетов
Playwright качать не нужно. Установленный Chrome в headless-режиме снимает и слайды, и PDF. Экономит ~150 МБ и один шаг установки.

Что НЕ нужно ставить

КандидатПочему мимо
Отдельный ключ MeshyMeshy 6, Tripo и Hunyuan3D доступны внутри Higgsfield на тех же кредитах
mcp-image / Gemini APIу Gemini генерация картинок только на платном тарифе, бесплатного нет вообще; Higgsfield уже оплачен
Blender + blender-mcpнужен только под запечённые 3D-рендеры в PPTX; для веба свет и камера задаются кодом
Spline MCPархивирован, у Spline нет публичного API
Gamma / Canva MCPнужны, только если требуется готовый .pptx и есть бренд-кит
Office-PowerPoint-MCP-Serverархивирован в марте 2026

Порядок работы

  1. Источник. ТЗ или текст в файл. textutil -convert txt -output out.txt in.docx для .docx.
  2. Бренд-система. Через /higgsfield-brandkit. Строго по порядку: палитра → знак → типографика. Каждый шаг утверждается отдельно, состояние пишется в brandkit/state.json. Смена палитры обнуляет знак, смена типографики — нет.
  3. Знак. Три разных механизма (не три варианта одного), Recraft V4.1 в векторе. Выбор всегда за человеком. После выбора — logo-inspect для фингерпринта, потом logo-export: он снимает полноэкранный фон и отдаёт чистый SVG + PNG 2048.
  4. Копи. Отдельным проходом, по правилам ниже. Утверждения из ТЗ не менять, менять формулировки. Показывать до/после построчно.
  5. Слайды. Один HTML, секции по 1920×1080, шрифты через Google Fonts, графика — inline SVG руками.
  6. Рендер. Скриншот всей страницы одной высотой, потом нарезка:
    CH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
    "$CH" --headless=new --disable-gpu --hide-scrollbars \
          --window-size=1920,5400 --virtual-time-budget=9000 \
          --screenshot=full.png "file://$PWD/deck.html"
    for i in 1 2 3 4 5; do y=$(( (i-1)*1080 ))
      magick full.png -crop 1920x1080+0+$y +repage "slide-0$i.png"; done
  7. PDF. В <style> добавить @page{size:1920px 1080px;margin:0} и @media print{.slide{break-after:page}}, затем:
    "$CH" --headless=new --disable-gpu --no-pdf-header-footer \
          --virtual-time-budget=9000 --print-to-pdf=deck.pdf "file://$PWD/deck.html"
    На выходе 5 страниц 1440×810 pt — это 16:9.
  8. Проверка глазами. Смотреть каждый слайд картинкой и искать переполнение, наложения, кривые переносы. Это единственный шаг, который отличает «сгенерили дек» от «продумали дек». Без него получается то же, что Gamma отдаёт из коробки.

Чем ревьюить

Ревью-страница с коммент-слоем: слайды в масштабе 70% плюс два способа оставить замечание.

Комменты лежат в localStorage браузера, ключ по document.title, никуда не уходят.

Страница собирается скриптом, а не руками. build-review.py читает deck.html, вынимает CSS, defs и секции слайдов и заворачивает их в оболочку с коммент-слоем. Правим дек — пересобираем одной командой, и ревью не расходится с исходником:
python3 build-review.py

Правила копи

Полный список — в скилле landing-copy. Самое частое, что придётся выкорчёвывать:

МаркерЧто делать
«не X, а Y»маркер номер один. Переписать прямым утверждением или сценой: «занят вашими способностями, пока остальные модели заняты вашей работой»
«без X»заменить на «вместо X» либо убрать
«революция», «трансформация», «синергия», «контур», «эффективность»запрещены
абстракция вместо сцены«практически не научились масштабировать развитие человека» → «развитие человека осталось ручным»
превосходная степень без базы«самая измеримая способность» → «измеряется точнее любой другой»
эмодзи, восклицательные знакив основном тексте нет

Авторские формулировки заказчика не трогать, даже если нарушают правила. Если сомневаешься — спросить.

Грабли, которые стоили времени

ГдеЧто происходитКак правильно
Recraft, параметр colorsпадает на формате {"rgb":[...]}массив hex-строк: ["#6E5BFF","#A99BFF"]
Знак после Recraftлежит на квадратном холсте с большими полями, в вёрстке выглядит вчетверо мельче заданногоmagick logo.png -trim +repage logo-trim.png
<img> в колоночном flexрастягивается по ширине контейнера и искажает пропорцииalign-items:flex-start на контейнере
Блочное правило position:relativeперебивает absolute у подписей, они уезжают в уголисключать их из селектора либо оборачивать контент отдельным слоем
Chrome headless screenshotснимает только вьюпорт, остальные слайды пустые--window-size на полную высоту страницы
Регулярка на body{...}по границе слова цепляет .cover-body и p.body, вёрстка рассыпаетсялукбехайнд (?<![\w.\-])body\s*\{
npx skills addставит в текущую папку как в проект, глобально не умеетзапускать из нейтральной папки и копировать в ~/.claude/skills/
Засечные шрифты в кириллицена тёмном фоне волосяные штрихи выцветают, средние кегли плывутдля тёмных деков одно семейство без засечек, иерархия масштабом и весом
Проверка кириллицы у Google Fontsgrep по комментарию /* cyrillic */ врёт: комментарии отдаются только под браузерным User-Agentискать U+0400 в unicode-range
Путь в PPTXPowerPoint подменяет шрифты своимишрифты установить в систему до экспорта

Цены

Кредиты Higgsfield, реальные ответы higgsfield generate cost:

МодельКредитовПод что
text2image_soul_v20.12атмосферные фоны, черновые прогоны
nano_banana_22быстрые итерации
gpt_image_27текст внутри кадра, финальные ключевые кадры
recraft_v4_1 (вектор)10кандидаты знака
kling3_010видео
Дек Levitan 1–5 стоил 40 кредитов — четыре вектора знака. Ни одной сгенерированной картинки: обложка, схемы и глифы нарисованы inline-SVG. Для манифестных и схемных слайдов это и правильнее — фотофон ослабляет текст.

Что осталось за кадром