Насколько правильным будет делать цвет ошибок почти таким же, как цвет кнопок?

Здравствуйте. В интерфейсе акцентный цвет и цвет кнопок красный, но также в нём предусмотрено отображение состояний ошибки в формах. Насколько правильным будет делать цвет ошибок почти таким же, как цвет кнопок? Не будет ли это отрицательно сказываться на восприятии интерфейса пользователем? Стоит пересмотреть цветовое решение?

Анастасия!

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

Красная кнопка в форме
Красное выделение ошибки

А на некоторых сайтах не дисейблят красную кнопку при появлении ошибок, но интерфейс всё равно остаётся понятным.

P. S. Это был вторничный совет о дизайне интерфейсов. Присылайте вопросы.

Интерфейс
Отправить
Поделиться
Запинить

Комментарии

Евгений Арутюнов

Анастасия,

почему так можно и почему так делают:

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

Ещё так можно, потому что роль цвета — вспомогательная, а порядок диктуется в основном словами и их взаиморасположением. Соответственно, чем чище дизайн в целом, тем меньше он страдает от таких «локальных конфликтов».

Так делают, потому что издержки от такого цветового конфликта минимальные — неприятно, но никому особо не мешает. А издержки от решения во что бы то ни стало избежать такого конфликта — заметные. Нужно или вообще отказаться от красного, полностью отдать его ошибкам — если у нас какой‑то красный бренд, он потеряет лицо, это слишком высокая цена. Или нужно отследить все‑все ситуации и научить им интерфейс — а это усложнит разработку и поддержку.

9 фев 2021

Мне кажется, это усложняет восприятие. Человек привыкает к тому, что у «красного бренда» красный цвет становится позитивным действием. По нему идёт движение дальше (кнопки, ссылки, активные элементы). А негативные действия нужно закодировать другим цветом, близким по значению, но хорошо различимым.

10 фев 2021

Анастасия, не нужно придумывать второй красный цвет для ошибок, если он близок к фирменному цвету продукта. Во‑первых, так на слабых мониторах, он всё равно останется таким же, а во‑вторых, даже на сильных мониторах на одном и том же экране 99% пользователей не заметят разницы, ну или заметят, но не обратят внимание.

Убеждать клиента, что ему нужно заменить фирменный стиль тоже неправильно.

Идите от контекста — если это таблица, то подкрашенные ошибки не сольются с интерфейсом. Если это сообщение, то может помочь иконка рядом с текстом, которая сообщит, что «Внимание». Эту же роль может сыграть текст рядом с сообщением. Решает контекст.

4 дек 2021

Анастасия, столкнулась с такой же проблемой. Всё‑таки, другой цвет ошибки облегчает экран. Ничего страшного, если ошибка не будет кричать на тебя ярко‑красным: «Опасность❗⛔🆘❗» В голове всплывает образ школьной тетради или дневника, где всё перечеркнуто красным, и эмоции соответствующие. Пользователь и так поймёт, что нужно что‑то поправить, и не будет ощущать на себе такого сильного давления при этом. И брендовый цвет после этого не будет восприниматься в негативе💌

15 дек 2021

Рекомендуем другие советы