В разных дизайн-системах названия компонентов совпадают не всегда. Например, то, что в одной системе называется toast, в другой может быть alert, notification или snackbar. В работе я разделяю такие компоненты не по названию, а по поведению.
Toast обычно появляется как короткий отклик на действие пользователя. Например, «Файл сохранён», «Ссылка скопирована», «Изменения применены». Он не требует отдельного решения и быстро исчезает.
Alert чаще работает как заметное сообщение внутри интерфейса. Он может оставаться на экране, предупреждать о важном состоянии, ошибке или ограничении. Например, что часть функций недоступна, данные не сохранены или действие требует внимания.
В мобильных интерфейсах alert может работать иначе. Это может быть системное модальное окно, которое перекрывает экран и требует выбора: подтвердить, отменить, разрешить, удалить. Поэтому я смотрю на задачу, которую должно решить сообщение в интерфейсе.
Важно определить: — какое событие или состояние нужно показать; — нужно ли пользователю что-то сделать; — сообщение временное или постоянное; — оно связано с действием пользователя или с состоянием системы; — может ли человек продолжить работу без реакции.
Связано с действием пользователя — Toast: чаще да. — Alert: не обязательно, может показывать состояние системы или страницы.
Нужно ли оставить сообщение на экране — Toast: обычно нет, даже если это предупреждение или некритичная ошибка и сообщение не требует действия. — Alert: да, если предупреждение или ошибка должны оставаться видимыми.
Требует действия — Toast: обычно нет. — Alert: часто да.
Можно продолжить без реакции — Toast: да. — Alert: зависит от важности сообщения.
На практике в дизайн-системе не всегда представлены оба компонента. Например, есть alert, но нет toast. Тогда я использую alert как основу для toast и описываю поведение этого компонента, чтобы не возникало путаницы.
Так в системе фиксируются два разных компонента с разной логикой работы и поддерживается единообразие стилистики.
Внутри конкретного продукта можно назвать компонент toast, alert или notification, главное, чтобы команда одинаково понимала его поведение и место в интерфейсе. #дизайнсистема
