Утилита ai-design-check по 70 правилам свела 266 дизайн-замечаний на дашборде к нулю

Команда Enmera Software выпустила open-source утилиту ai-design-check, которая находит в интерфейсах от ИИ-агентов типовые «сгенерированные» признаки. На демо-дашборде проверка по 70 правилам нашла 266 дизайн-замечаний, после правок их стало 0. Сам чекер работает без ИИ и API-ключа, а чинит экран отдельный навык для Claude Code, Cursor и Codex, который после каждого прохода проверяет результат заново. • Чекер ловит отступы вне сетки 4 px, градиентные кнопки и эмодзи вместо иконок • Правила сверяли с 16 популярными дашбордами на Dribbble и Behance • Поддерживаются React, Next.js, Vue, Svelte, Blade и чистый HTML

AI-обработка оригинала X: @sinanyorulmazz; редакция Hamidun News
Утилита ai-design-check по 70 правилам свела 266 дизайн-замечаний на дашборде к нулю
Источник: X: @sinanyorulmazz. Коллаж: Hamidun News.
Слушать статью
Паспорт материала и цифры
ПараметрДанные
ПервоисточникX: @sinanyorulmazz ↗
Главный редактор
Ключевой факт #1Чекер ловит отступы вне сетки 4 px, градиентные кнопки и эмодзи вместо иконок
Ключевой факт #2Правила сверяли с 16 популярными дашбордами на Dribbble и Behance
Ключевой факт #3Поддерживаются React, Next.js, Vue, Svelte, Blade и чистый HTML

Интерфейсы, которые рисуют ИИ-агенты для кода, часто узнаются с первого взгляда: градиентные кнопки, эмодзи вместо иконок, приветствие «Welcome back, Alex! 👋» и случайные размеры шрифтов. Команда Enmera Software выпустила open-source инструмент ai-design-check, который такие места находит, исправляет и подтверждает результат повторной проверкой. По словам авторов, на демонстрационном дашборде число замечаний упало с 266 до 0.

Запускается инструмент одной командой: `npx @enmera/ai-design-check`. Зависимостей у пакета нет.

Из чего состоит набор

Первая часть — библиотека из 70 дизайн-правил. Для каждого правила описано, что именно проверяется, почему это важно и как исправить нарушение.

Вторая часть — собственно чекер. Он работает без ИИ и без API-ключа: это детерминированная проверка, которая помечает каждое нарушение. Среди примеров из анонса:

  • отступы, не попадающие в сетку 4 px;
  • размеры шрифта вне заданной шкалы;
  • кнопки с градиентом;
  • эмодзи в роли иконок;
  • заголовок вроде «Welcome back, Alex! 👋»;
  • незаметно удалённое кольцо фокуса, из-за чего ломается навигация с клавиатуры.

Третья часть — навык (skill) для агентов. Он правит экран за несколько проходов и после каждого снова запускает чекер. Установка для Claude Code, Cursor и Codex: `npx skills add enmerasoftware/ai-design-check`, после чего агенту достаточно написать «fix the design of this screen». Четвёртая часть — генерация видео «до/после» одной командой; ролик из анонса сделан именно так.

Заявлена поддержка React, Next.js, Vue, Svelte, Blade и обычного HTML.

Откуда взялись правила

Перед релизом авторы сравнили свои правила с 16 высоко оценёнными дашбордами на Dribbble и Behance. То, что объединяет лучшие работы, превратилось в проверки:

  • карточки метрик читаются в порядке «подпись → значение → изменение»;
  • у всех карточек один шаблон заголовка;
  • на графике подсвечена одна серия данных;
  • кнопки плоские;
  • поверхности отделяются фоном, а не тяжёлыми тенями.

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

Что стоит учитывать

Цифра «266 → 0» описывает соответствие набору правил на одном дашборде, причём демонстрационном. Она не доказывает, что интерфейс стал объективно лучше, и независимых проверок на чужих проектах в анонсе нет. Выборка из 16 референсов невелика и состоит из работ с портфолио-площадок, а такие работы нередко оптимизированы под красивую картинку, а не под повседневную работу с продуктом. Правила получились ограничивающими по вкусу: часть команд захочет градиенты или иные шкалы шрифтов, и набор придётся настраивать.

Тем не м$менее подход разумный: детерминированный чекер дешёв и воспроизводим, а агент получает измеримую цель вместо расплывчатой просьбы «сделать красивее». Для команд, где интерфейсы всё чаще пишут Claude Code, Cursor или Codex, это быстрый способ ввести минимальную дисциплину в вёрстке. Попробовать на своём экране можно за минуту, а затем решить, какие из 70 правил оставить.

Сюжет

Вопросы и ответы по материалу

Что известно по теме: из чего состоит набор?

Первая часть — библиотека из 70 дизайн-правил. Для каждого правила описано, что именно проверяется, почему это важно и как исправить нарушение. Вторая часть — собственно чекер. Он работает без ИИ и без API-ключа: это детерминированная проверка, которая помечает каждое нарушение. Среди примеров из анонса: отступы, не попадающие в сетку 4 px; размеры шрифта вне заданной шкалы; кнопки с градиентом; эмодзи в роли иконок; заголовок вроде «Welcome back, Alex! 👋»; незаметно удалённое кольцо фокуса, из-за чего ломается навигация с клавиатуры. Третья часть — навык (skill) для агент

Что известно по теме: откуда взялись правила?

Перед релизом авторы сравнили свои правила с 16 высоко оценёнными дашбордами на Dribbble и Behance. То, что объединяет лучшие работы, превратилось в проверки: карточки метрик читаются в порядке «подпись → значение → изменение»; у всех карточек один шаблон заголовка; на графике подсвечена одна серия данных; кнопки плоские; поверхности отделяются фоном, а не тяжёлыми тенями. Есть и забавное наблюдение: примерно половина популярных работ открывается строкой «Welcome back 👋». Правило против неё авторы всё равно оставили. Их аргумент: заголовок — самая ценная строка экрана, кот

Что известно по теме: что стоит учитывать?

Цифра «266 → 0» описывает соответствие набору правил на одном дашборде, причём демонстрационном. Она не доказывает, что интерфейс стал объективно лучше, и независимых проверок на чужих проектах в анонсе нет. Выборка из 16 референсов невелика и состоит из работ с портфолио-площадок, а такие работы нередко оптимизированы под красивую картинку, а не под повседневную работу с продуктом. Правила получились ограничивающими по вкусу: часть команд захочет градиенты или иные шкалы шрифтов, и набор придётся настраивать. Тем не м$менее подход разумный: детерминированный чекер дешёв и

ЖХ
Жемал Хамидун — CPO Alpina Digital, продакт-менеджер AlpinaGPT. Делает AI-продукты с 2019 года. Hamidun News — pet project, который вырос в production-агрегатор с 6000+ читателей.
✦ Практика · Hamidun Academy

Соберите рабочего ИИ-агента или сервис своими руками без ручного кода

В Академии Жемала Хамидуна (academy.hamidun.com) открыт бесплатный 72-часовой тест-драйв: интерактивные скетч-уроки по Claude Code и Cursor, живой Tech Radar и готовые шаблоны агентов.

Открыть 72ч бесплатный доступ →Интенсив по Вайб-кодингу
Что вы думаете?
Загружаем комментарии…