34. Дизайн, который работает

В этом выпуске: статьи о валидации форм, размере кнопки в тач-интерфейсе, размышления о работоспособности дизайна. Ссылки обновлены 14.06.2024.

Валидация форм

У компании «СКБ Контур» (один из продуктов — облачная бухгалтерия «Эльба») есть интерфейсные гайдлайны. Например, о валидации форм:

  • Когда и как показывать сообщения об ошибках;
  • Каким должен быть текст;
  • Что делать с чекбоксами и группами радиокнопок в формах.

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

Размер кнопки в тач-интерфейсе

Скотт Харф привёл результат исследования минимального размера кнопки для тач-интерфейсов и сравнил с рекомендациями Apple, Google и Microsoft.

Вывод: хороший интерфейс основан на элементах размером не менее 10 мм, а в идеале около 13 мм, что укладывается в стандарты Microsoft. Оставаясь в пределах этих границ, вы точно сможете создавать интерфейсы, которые помогут пользователям минимизировать ошибки и выполнять задачи быстрее.

В статье есть подсказка, как пересчитывать миллиметры в пиксели и пункты.

In English (копия в Вебархиве).

Дизайн, который работает

В ленте появилась статья с интригующим названием «Behance vs Реальность». Но нет, она не о том, что за отличными картинками часто скрывается крайне неудобное взаимодействие. Автор написал, что хороший дизайн не нужен, нужна доступность и понятность, а остальное пользователь не ценит.

В комментариях оказалась ссылка на рассказ о том, как убогое (по мнению дизайнера) рекламное объявление в газете сработало и привлекло клиентов. В дальнейшем заказчик разместил его ещё несколько раз. Из описания понятно, что текст объявления был набран слишком мелко, что означает плохую доступность.

Рекламное объявление — это сообщение о возможности решить определённую проблему. Если проблема есть, и это единственное сообщение на эту тему, то клиенты будут. Но если проблему решает ещё десяток предпринимателей, и все они размещают рекламу в газете, то клиентов данное объявление может и не принести.

Говоря о первой статье, стоит выделить 2 вида дизайна:

  1. Который работает, то есть решает задачи целевых групп;
  2. Который не только работает, но и радует глаз.

Работать — это минимальное требование. Но если есть возможность, не стоит этим ограничиваться.

Фото: fb.ru

Алкомаркет «Красное и белое» просто сделал очень заметную вывеску и витрину. По сути, это не только вывеска, но и наружная реклама. Наверняка, она такая не потому, что вокруг куча других алкомаркетов и надо выделяться.

Фото: abnews.ru

Можно решать задачи и делать это не вырвиглазно.

В случае «Красного и белого» покупатель заметит магазин. Возможно, ему плевать на качество исполнения вывески, особенно, если надо купить водки и напиться. Но он и его дети будут жить в среде, где распространены такие визуальные решения.

Домой он закажет некрасивую отечественную мебель. На своём заводе утвердит макет чайника, который промышленные дизайнеры нарисовали левой пяткой, так как надо показать 3 варианта, а этот «он точно не выберет».

Его продукция будет хуже той, производители которой выросли на плакатах в швейцарском стиле, гельветике в навигации и современной архитектуре спальных районов. В стране так и будет создаваться говно для внутреннего потребления.