«Скучные» интерфейсы — где найти вдохновение

Пересказ доклада Анастасии Режепп из DataArt на ProfsoUX 2016.

Используйте строгий визуальный стиль. Поскольку пользователь смотрит на монопольное приложение в течение продолжительного времени, позаботьтесь о том, чтобы притушить цвета и текстуру визуальной части. Придерживайтесь консервативной цветовой палитры.

Алан Купер

Сложные корпоративные системы — это бесконечные таблички и прочие 50 оттенков синего. Проектировщикам интересно их проектировать, а вот дизайнерам рисовать — не очень.

Чем заняться дизайнеру в таком проекте?

Вертикальный ритм

Интерфейс с выстроенным вертикальным ритмом выглядит аккуратнее, его проще верстать.

Вертикальный ритм

Придерживайтесь единого ритма на всей странице или придумывайте свой для каждого блока.

Вёрстка таблиц

Читайте Тафти и упрощайте внешний вид таблиц.

Таблица не должна быть похожа на рыболовную сеть, где каждая цифра в своей клеточке».

Ян Чихольд

Тафти против чересполосиц, но разделители полезны, когда:

  • В ряду — больше одной строчки текста;
  • Есть столбец с кнопками.

Инфографика

Читайте Storytelling with Data (автор Cole Nussbaumer Knaflic) и Information Dashboard Design (автор Stephen Few).

Круговые диаграммы — почти всегда зло. Если бизнес-аналитик просит сделать круговую диаграмму, переработайте задачу, поймите, какая цель. Предложите вместо неё другое представление.

Доступность

Повышайте доступность интерфейса. Изучайте сайт WebAIM. На эту тему много пишут Salesforce.

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

Читайте также пересказ доклада Виктора Ерофеева «Зачем проектировать доступный интерфейс. Взгляд из бизнеса» с ITGM6.

Анимация

Она точно поможет отвести душу. Анимация в сложных корпоративных системах:

  • Индикаторы загрузки;
  • Перетаскивание;
  • Иконки;
  • Интерактивное меню.

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

Вывод

Если включить голову, то и скучать не придётся, и продукт станет лучше.

Слайды презентации и видео.

Также опубликовано на Медиуме.

Опечатка? Выделите её и нажмите кнопки Control и Enter.

Технологии цифрового маркетинга — книга, где я был соавтором (параграф про создание сайта) и литературным редактором (привёл текст к единой стилистике и упростил формулировки). От 249 рублей.