Как AI помог собрать WCAG-доступный DataPicker, но ручная доработка все решила

Команда попыталась быстро собрать календарь выбора даты на React с помощью Claude, но почти готовый интерфейс все равно пришлось серьезно дорабатывать. История показывает, что для доступности важен не только код, но и проверка реальными сценариями: клавиатурой, экранными дикторами и режимами отображения.

Что получилось у ИИ с первого раза

Claude помог быстро собрать основу: структуру компонента, ARIA-атрибуты, базовую навигацию с клавиатуры и логику календаря. Для старта это уже серьезная экономия времени, особенно когда нужно быстро показать рабочий прототип.

На уровне кода решение выглядело аккуратно и даже производило впечатление готового продукта. Но именно такие задачи часто обманывают: интерфейс может быть визуально понятным, при этом оставаться неудобным для части пользователей.

Где проявились проблемы доступности

После проверки с NVDA и VoiceOver выяснилось, что фокус уходит за пределы окна, некоторые даты озвучиваются неверно, а закрытие по Esc оставляет пользователя без понятного контекста. Для людей, которые работают только с клавиатурой или используют screen reader, это уже не мелочь, а барьер.

Дополнительные проблемы всплыли в Windows High Contrast: выбранное состояние отображалось некорректно, а переключение месяцев сопровождалось слабой обратной связью. То есть интерфейс формально работал, но не обеспечивал уверенное и предсказуемое использование.

Что это значит для бизнеса и команд

Для записи к врачу, банка, сервиса доставки или любого другого продукта с формами такой календарь — не просто деталь дизайна, а часть пользовательского пути. Если выбор даты неудобен, люди могут бросить оформление заявки, а команда потеряет конверсию и доверие.

Главный вывод простой: ИИ хорошо ускоряет первую версию, но WCAG-доступность нельзя проверить одним взглядом на код. Нужны ручные тесты, сценарии с клавиатурой и проверка разными средствами озвучивания, а похожие задачи удобно обсуждать и прорабатывать с ИИ-сервисом как с помощником, а не как с окончательным судьей качества.

Частые вопросы

Можно ли доверить ИИ создание доступного интерфейса полностью?

Нет, лучше использовать ИИ для черновика и ускорения работы, а затем обязательно проверять поведение интерфейса вручную.

Почему календарь выбора даты так сложно сделать доступным?

Потому что он должен одинаково удобно работать мышью, клавиатурой и экранными дикторами, а еще корректно вести себя в разных режимах отображения.

Чем полезна такая работа для обычной команды?

Она помогает раньше находить барьеры в интерфейсе, снижать число жалоб и делать продукт удобнее для всех пользователей, а не только для тех, кто пользуется мышью.