Обновилась AI Design Context — вышла версия 0.5.0 🎉
Это npm-пакет с дизайн-контекстом и skills для AI-агентов. В новой версии появились инструкции для проверки интерфейса после изменений: открыть страницу в браузере, пройти сценарий, посмотреть скриншоты и зафиксировать проблемы.
🔎 ЧТО ДОБАВИЛОСЬ
Четыре skills с конкретными задачами:
• design-understand — разобраться, зачем нужен экран, какое действие главное и какие компоненты уже есть в проекте. • visual-qa — проверить отступы, переносы, обрезание текста, перекрытия и визуальную иерархию. • responsive-check — проверить интерфейс на разных размерах экрана. • accessibility-check — проверить подписи, клавиатурную навигацию, фокус и доступность элементов.
Например, агенту можно дать задачу: поправить форму на мобильном экране, пройти заполнение и отправку, проверить ошибки и приложить скриншоты найденных проблем.
В отчёте должно быть видно, что действительно проверено, а что осталось без проверки. Один удачный скриншот ещё не подтверждает, что работают клавиатура, диалоги и все состояния формы.
🛠 КАК ПОДКЛЮЧИТЬ
npm install -D --save-exact ai-design-context@0.5.0 npx ai-design-context init
После init в проект добавляются отсутствующие skills из набора — всего их 20.
Существующие инструкции и локальные skills сохраняются. При обновлении с 0.4.0 нужно повторить init.
Для проверки нужны browser tools или Playwright и модель с анализом изображений. Пакет даёт контекст и порядок работы; инструменты подключаются отдельно.
Пакет в npm: https://www.npmjs.com/package/ai-design-context
Что изменилось и как работает проверка: https://github.com/dev-ik/ai-design-rules/releases/tag/v0.5.0
