Кейс Авито
Zero-Defect Design AI™
Как мы научили AI работать арт-директором и сократили цикл ревью с нескольких дней до 15 минут.
Сложность дизайн-ревью в больших командах
В большой дизайн-команде согласование дизайна отнимает больше времени, чем сама работа над ним. Помимо рутины арт-директора, это еще и бесконечный процесс «договориться о встрече, внести правки, снова договориться о встрече, и так по кругу». Мы решили эту проблему, внедрив кастомного AI-арт-директора Zero-Defect Design AI™.
Ревью одного макета в Авито требует участия до пяти разных специалистов: старших дизайнеров, коллег из смежных вертикалей, хранителей дизайн-системы, продакт-менеджеров. У каждого свой фокус, а знания распределены.
Итог: затянутые циклы и десятки часов на синхронизацию. Или, что еще хуже, пропуск важных этапов согласования и всплывшие ошибки на продакшене. Нужен был единый, объективный источник правды.
Задача: Научить AI думать как арт-директор
Живой арт-директор оценивает дизайн по двум ключевым критериям: общее качество дизайна и соответствие дизайн-системе. Например, проверяет визуальную иерархию, типографику, отступы и соответствие стандартам доступности. Мы решили автоматизировать эти задачи, научив AI делать то же самое.
В нейросеть загружаются:
- Дизайн-макет для проверки.
- Правила из дизайн-системы.
- Четкий чек-лист для анализа.
На выходе — детальный и структурированный отчет об ошибках. Мы взяли один из самых сложных экранов Авито — карточку объявления автомобиля (более 20 блоков и 120 элементов UI). AI анализирует макет и выдает детальный отчет.
Пример обратной связи от AI-артдиректора
Zero-Defect Design AI™ не просто ищет ошибки. Он отмечает сильные стороны, предлагает конкретные улучшения и объясняет, как привести макет в полное соответствие с дизайн-системой. Результат — подробный отчет, который заменяет десятки комментариев в Figma и несколько циклов правок.
Несоответствие стиля заголовков
Заголовки секций (E6.1, E7.1) используют размер 21px. Правило DS (стр. 92) требует стиль H25, который определён как 24px (24/28+12). Необходимо заменить стиль для полной консистентности.
Отсутствие тени у кнопок
Второстепенные кнопки (E10.3, E8.4) выполнены без тени. Правило DS (стр. 83) гласит: "Тень. Предустановлена только для типа Default с приоритетом Secondary". Требуется добавить эффект тени.
Низкий контраст текста
Второстепенный текст в блоке B9 использует цвет #757575. Контрастность 4.63:1 формально проходит порог WCAG AA (4.5:1), но находится на границе. Рекомендуется затемнить цвет для улучшения доступности.
Дублирование точки входа
Кнопки E6.4 и E12.4 ведут к отчету Автотеки, но имеют разный стиль и расположение. Это нарушает эвристику согласованности. Необходимо унифицировать сценарий, оставив один основной блок.
Некорректный вертикальный ритм
Отступ после блока B6, который заканчивается кнопкой, составляет 28px. Правило DS (стр. 77) требует компенсацию в 6px для залитых объектов. Итоговый отступ должен быть 34px.
Группировка по принципу близости
Блок B9 (информация о продавце) — отличный пример. Аватар, имя и рейтинг сгруппированы, а кнопки действий "Позвонить" и "Написать" логично отделены. Это делает интерфейс предсказуемым.
Поиск стабильности
Первые тесты на мощных LLM-моделях дали нестабильный результат. Основной проблемой стал высокий уровень ложных ошибок («галлюцинаций»), когда AI уверенно придумывал несуществующие проблемы. Стандартные решения на рынке дают около 30-40% галлюцинаций — наш внутренний стандарт был не выше 10% даже на сложных мобильных макетах.
Пример галлюцинации: Модель могла сообщить об ошибке, не найдя размер шрифта, который был глубоко спрятан в дизайн-системе и применялся к специфическому компоненту.
Мы снизили уровень ложных срабатываний ниже 10% с помощью специального подхода: иерархического картирования элементов макета и структурированных JSON-файлов, которые помогают нейросети ориентироваться в дизайн-системе. После серии экспериментов мы остановились на модели Gemini, которая показала наилучшую стабильность и точность. Модель эффективно понимала контекст и давала обратную связь, сравнимую с комментариями опытного специалиста.
Качество и предсказуемость
Мы специально вносили в макеты малозаметные ошибки — AI каждый раз успешно их отлавливал. Он генерировал структурированные отчеты с конкретными задачами, порой замечая то, что мог пропустить человеческий глаз.
«Мне понравился этот разбор, это очень полезно и реально экономит время. Я увидел проблемы, которые сам пропустил бы».
— Отзыв дизайнера, первым протестировавшего систему
«С появлением AI-ревью дизайн-команда стала работать значительно быстрее, и релизы стали реже переноситься. В среднем, скорость согласования макетов увеличилась примерно в 5 раз, а нагрузка на арт-директоров снизилась примерно на 20-25 часов в неделю».
— Отзыв продакт-менеджера команды
Как выглядит результат и что получили
Сейчас AI-артдиректор работает в формате серии промптов и прикрепления файлов в чат Gemini. Это промежуточное решение, чтобы идеально отладить промпты и процесс перед интеграцией в плагин для Figma.
«Мы сократили цикл ревью с нескольких дней до 15 минут, освободили время старших дизайнеров и повысили качество итогового продукта. Весь процесс внедрения занял всего три встречи».
— Отзыв Ксюши, дизайн-лида команды
Масштабируемая экспертиза
Знания арт-директоров доступны 24/7 для всей команды, а не только во время редких созвонов.
Вкус компании
AI-артдиректор работает по критериям и оптике действующего арт-директора, передавая вкус компании дизайнерам.
Скорость и фокус
80% рутинной обратной связи генерируется за минуты, что освобождает время старших специалистов для стратегических задач.
Кастомизация под процесс
Zero-Defect Design AI™ полностью настраивается под уникальные процессы и стандарты ревью вашей компании.
Этот подход — новый стандарт для больших команд. Он экономит самое ценное — время лучших специалистов.
Хотите также?
Напишите — разберём ваш процесс, покажем другие кейсы и поможем внедрить.