Три варианта дизайна за 5 минут: git worktrees глазами вайб-кодера

Делаю редизайн ifonin.ru. За две недели накопилось 64 промпта для Claude Code — правлю CSS, переставляю блоки, экспериментирую со шрифтами.

Финал. Три кандидата на запуск.

Переключаться между ветками — боль. git stash, потом git checkout, потом git stash pop. Надеяться, что ничего не сломалось. Хочу сравнить варианты side-by-side, но не готов плодить три папки с полными копиями репозитория.

Один промпт

Пишу Claude Code: “Сделай мне три варианта одновременно. Хочу открыть их в браузере и сравнить.”

Получаю за пять минут:

  • Три рабочих папки (worktrees) — по одной на каждый дизайн
  • Три Hugo-сервера на портах 1314, 1315, 1316
  • Живой сайт с автообновлением для каждого варианта

Открываю три вкладки. A — жирные цвета. B — минимализм. C — экспериментальная типографика.

Меняю CSS в одном — live reload показывает результат мгновенно. Говорю Claude Code “сделай шрифт крупнее в B” — делает, не трогая остальные два.

Никаких stash. Никаких конфликтов.

Три папки, три ветки, три порта. Я не писал ни одной команды git вручную.

Что такое worktrees

Три копии проекта без тройного расхода места. Все три worktrees делят один .git каталог, но работают независимо.

Редактирую файл в папке variant-a. Папки variant-b и variant-c не трогаются.

Аналогия — три окна в Figma vs три отдельных файла. Технические детали про .git/worktrees, bare clone и объекты можно почитать в официальной документации git. Мне важнее результат: три варианта запущены, я сравниваю и правлю на лету.

Как я сравнивал

Три вкладки в браузере, открытые side-by-side. Localhost:1314, :1315, :1316. Прокручиваю синхронно. Смотрю как меняется ощущение от шрифта, от отступов, от цветов.

Claude Code слушает:

  • “В A сделай заголовки жирнее.”
  • “В B убери все цвета кроме черного и белого.”
  • “В C поставь межстрочный интервал 2.0.”

AI редактирует CSS в трех папках параллельно. Изменения появляются во всех вкладках.

Без переключений. Без потери фокуса. Без страха что-то сломать.

Каждый вариант живет в своей ветке, каждая правка — отдельный коммит.

За час — десяток итераций.

Результат и очистка

Выбрал A. Попросил Claude Code смержить его в main. Остальные два удалил. Claude Code почистил worktrees, удалил ветки, прибрал метаданные.

Репозиторий снова чистый.

От идеи до финального дизайна на продакшене — 5-10 минут. Три работающих сервера, живое сравнение, мгновенный выбор.

Почему это вайб-кодинг

Я не знал про worktrees до этого. Claude Code знал.

Компания incident.io запустила четыре Claude Code агента параллельно на разных worktrees — ускорила delivery в несколько раз. Эксперт Gordon Chiam пишет, что переключение веток съедает 10-15 минут на каждый switch.

Git worktrees появились в 2015-м. Больше десяти лет назад.

Но я узнал про них только когда Claude Code сказал: “Вот как это сделать.”

Вайб-кодинг работает.