раздел 03
Итерации и правки
Первая версия от агента - черновик. Нормальная презентация получается за три-пять кругов правок, и каждый круг занимает минуты, если правки формулировать правильно и после каждой смотреть результат в браузере.
Правки по номеру слайда
Агент считает секции по порядку, так что «слайд 6» для него однозначен. Формулируйте правку как редактор: что именно и как. «Слайд 6: оставь три пункта из пяти, убери про интеграции и сроки» лучше, чем «слайд 6 перегружен».
Несколько правок за раз - нормально. Двадцать за раз - агент потеряется в середине. Оптимум пять-семь.
Единый стиль через переменные CSS
Если агент сразу вынес цвета и шрифт в переменные (вы просили об этом в ТЗ), смена палитры - одна правка. Если не вынес, попросите это первой правкой, иначе каждая смена цвета будет ловлей двадцати мест по файлу.
Вынеси все цвета, шрифт и базовые размеры (заголовок, текст, отступы)
в переменные CSS в :root. Ничего визуально не меняй, только рефакторинг.
Потом покажи список переменных.
Дальше «поменяй акцент на #f59e0b» правится за секунду и точно везде.
Иллюстрации: рисованные SVG
Просите рисованные inline-SVG, а не эмодзи и не стоковые картинки из сети. Причины практические. Эмодзи на разных системах выглядят по-разному и на проекторе смотрятся как детская книжка. Картинки по ссылке из интернета не откроются офлайн и исчезнут, когда сайт-источник их удалит. А SVG рисуется кодом, масштабируется без потерь, красится в цвета палитры и правится словами: «стрелку сделай толще».
Что агент рисует хорошо: схемы процессов из блоков и стрелок, воронки, таймлайны, простые иконки, сравнения «было/стало», столбчатые диаграммы. Что рисует плохо: реалистичные предметы, людей, сложные сцены. Для последнего лучше сгенерировать картинку отдельно (курс Генерация изображений) и встроить как data-URI.
Слайд 5: вместо списка из четырёх шагов нарисуй схему inline-SVG:
четыре блока слева направо, стрелки между ними, подпись в каждом.
Цвета из переменных палитры. Без эмодзи и без внешних картинок.
Таблицы и графики кодом
Таблица - обычная HTML-таблица, только крупная и без лишних линий. Простой график - SVG-бары: столбики с подписями, высота пропорциональна значению. Агент это делает за одну итерацию, и цифры потом правятся текстом, а не перерисовкой в стороннем инструменте.
Слайд 8: столбчатая диаграмма SVG, пять столбцов: 2022 - 120, 2023 - 180,
2024 - 260, 2025 - 340, 2026 - 410. Значение над каждым столбцом,
последний столбец акцентным цветом. Ось Y не нужна.
Проверка в браузере после каждой правки
Это обязательная часть цикла, а не финальный шаг. Агент не видит результат своего кода. Он может закрыть тег не там, и половина слайдов пропадёт, а в чате будет «готово». Открывайте файл, листайте до последнего слайда, потом сужайте окно до половины экрана: холст должен уменьшиться целиком, а не обрезаться.
Можно попросить агента самого проверить файл в браузере, если у него есть такой инструмент (например, Playwright в IDE). Тогда он откроет страницу, прощёлкает слайды и посмотрит консоль на ошибки. Как настроить и что просить - в курсе Проверка результата.
Открой presentations/pilot-budget-v1.html в браузере, пройди все слайды
стрелкой вправо, на каждом сделай скриншот 1280x720. Проверь консоль
на ошибки. Отчёт: список слайдов, где текст выходит за границы холста.
Контроль плотности текста
Самая частая правка. Агент уважает исходник и тащит на слайд целые абзацы. Правило из ТЗ - не больше шести строк - нужно повторять при правках, потому что при добавлении содержимого агент о нём забывает.
Пройди по всем слайдам. Где текста больше 6 строк - сократи до тезисов,
одна мысль на строку. Если сократить без потери смысла нельзя -
раздели на два слайда и скажи мне, какие разделил.
Сохранение версий
Два способа. Простой: копии файла deck-v1.html, deck-v2.html, deck-final.html. Правильный: git, где каждая версия - коммит с понятным сообщением «сократил слайды 3-5, добавил график на 8». Откатиться на любую версию можно за секунду, и не копится папка из двенадцати файлов с «final-final-2». Как это делать без терминала и страха - в курсе Основы git.
Промпт для агента, который сам ведёт версии:
Перед каждой правкой презентации делай git commit текущего состояния
с сообщением, что именно изменилось. После правки - ещё один коммит.
Дальше - как показать презентацию с проектора, отдать файлом и распечатать в PDF.