Дизайн без слопа

Процесс дизайна — это примерно три шага: выписать все ограничения, под которые проектируешь; перебрать варианты решений, которые им удовлетворяют; и, если по дороге понял, что ограничение нужно добавить или убрать, — вернуться к первому шагу. Схема из книги «Notes on the Synthesis of Form» Кристофера Александера, и она до сих пор точнее большинства современных методичек.

Типичная ошибка — пропустить пересмотр и играть в латание дыр по одной. Пользователь запутался — и рука сама тянется к точечному фиксу: «сделай эту кнопку заметнее», «добавь подсказку сюда». AI это только усугубляет — промптить точечные правки слишком легко. В итоге получается лоскутное одеяло, где одни сценарии случайно важнее других, и запутавшихся пользователей становится больше.

Агенты обожают добавлять. В коде это лишние try-catch и переизобретённые утилиты, в интерфейсе — лишние подписи, линии, иконки и рамки. Результат выглядит лучше, чем среднестатистический интерфейс, свёрстанный инженером руками, — но по сути он всё равно плохой: перегруженный и шумный.

Твоя работа — вычитать дизайн, как вычитывают diff. Пройдись по каждому элементу и задай один вопрос: «это правда нужно?» Если сомневаешься — убирай. Иерархию почти всегда можно построить размером, отступами и светлотой, а не дополнительными украшениями.

Гравитация прототипа — тихий убийца. Стоит агенту собрать первую версию прямо в твоём кодбейзе, как «доточить её» становится проще, чем исследовать альтернативы. Заодно агент вынужден графтить дизайн на существующий код — и это тоже сужает пространство решений.

Итерируй там, где итерация дешёвая: Figma по-прежнему лучший вариант, и её AI-интеграции быстро растут; подойдут Cursor Design Mode, Claude Design или даже одноразовые HTML-прототипы. Главное правило: проси у AI три-четыре варианта каждого экрана, а не один. Сравнение вариантов учит быстрее, чем полировка одного.

Очевидно для инженера, но критично для дизайна: отделяй представление от логики и собирай переиспользуемые компоненты. Тогда приложение остаётся визуально цельным, а не превращается в коллаж из пяти по-разному переизобретённых кнопок.

Лучший способ оценить дизайн — preview-деплой с настоящим бэкендом. Даже если агент собрал ровно то, что ты просил, подержав экран в руках с реальными данными, часто понимаешь: не то. Полировка и переделки будут всегда — заложи их в план.

Для больших фич удобно разводить фронт и бэк по разным PR: бэкенд проверяется тестами, фронтенд — глазами через preview-ссылку, которой легко поделиться.

Большинство UX-проблем уже решены до тебя. Твоя задача — находить эти решения и собирать из них своё. Посмотри, как похожие продукты решают похожие задачи и доносят похожие идеи.

Каждый сильный дизайнер начинает любой проект с подборки скриншотов-референсов. Делай так же: пачка скриншотов — это ещё и отличный контекст для агента, который будет собирать твой интерфейс.

Вкус — это рефлексия над собственной реакцией: что именно мне здесь нравится или мешает и почему. Инженеры отлично видят, что дизайн «не работает», но не знают, как чинить — потому что у них нет наработанной библиотеки решений. Она набирается только репами: пробуешь, смотришь, рефлексируешь, повторяешь.

Это весело, но местами жёстко: до состояния «хорошо» дизайн доходит через поток критики. В Ref, где нет штатного дизайнера, это называют молотьбой: кидаешь дизайн в центр круга и бьёшь его палками, пока команда не почувствует — готово.