Дизайн приборной панели — рекомендации и рекомендации

Послушайте аудиоверсию этой статьи.

Панели мониторинга — это уникальный и мощный способ представления основанной на данных аналитики с использованием методов визуализации данных, которые отображают релевантные, полезные данные, а также отслеживают статистику и ключевые показатели эффективности (KPI). Информационные панели должны представлять эти данные в быстром, удобном для сканирования формате с наиболее важной информацией, понятной с первого взгляда.

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

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

В этой статье мы приводим стратегические, аналитические, операционные и информационные примеры, а также фундаментальные принципы, лежащие в основе каждой успешной конструкции информационной панели, независимо от ее типа.

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

В своей книге « Визуализация данных » Ной Ильинский и Джули Стил утверждают:

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

Ключевые характеристики отличных информационных панелей

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

Отличные информационные панели четкие, интуитивно понятные и настраиваемые.

• Они быстро передают информацию.
• Они отображают информацию четко и эффективно.
• Они показывают тенденции и изменения данных с течением времени.
• Они легко настраиваются.
• Наиболее важные виджеты и компоненты данных эффективно представлены на ограниченном пространстве.

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

Великолепные информационные панели предоставляют все одним щелчком мыши.

• Вся необходимая информация доступна сразу.
• Данные имеют приоритет.
• Информация отображается четко в визуальной иерархии на одном экране.
• Дизайн обеспечивает связный обзор, который включает в себя разрозненные, четкие исходные данные с дополнительными возможностями детализации для получения дополнительной информации.
• Элементы (диаграмма, таблица, форма) отображаются в свернутом виде с возможностью вызвать более подробную информацию в модальном окне или перейти на страницу с более подробной информацией.
• Дизайн повышает удобство использования благодаря фильтрам, позволяющим пользователям настраивать способ отображения данных и фильтровать контент с помощью меток, категорий и ключевых показателей эффективности.

Уменьшенная сложность обеспечивает ясность

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

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

Эффективные решения по дизайну приборной панели должны основываться на:

• цели проекта
• характер данных
• потребности пользователей

Когда вы читаете визуализацию (или любой другой вид сообщения), ваш читатель имеет ограниченное количество умственных способностей, которые он может посвятить решению проблемы. Часть этих умственных способностей будет посвящена расшифровке визуализации; любые оставшиеся умственные способности могут быть использованы для понимания сообщения (если читатель еще не сдался в отчаянии). Ной Ильинский и Джули Стил (визуализация данных)

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

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

Определение целей информационной панели и отображение соответствующих данных

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

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

Несколько ключевых вопросов, которые следует задать при определении целей дизайна приборной панели:

• Сколько шагов нужно сделать пользователям для достижения конкретной цели?
• Достаточно ли интуитивно понятен интерфейс, чтобы пользователь мог самостоятельно достичь своей цели?
• Какая информация нужна пользователю для успешного достижения цели?

Чтобы определить, какова может быть цель конкретного дизайна информационной панели, определите ее, спросив: «Какую конкретную проблему этот дизайн собирается решить для пользователя?» Ответ даст представление о том, какие показатели, свойства, значения, визуальные эффекты и данные имеют значение.

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

Контекст в дизайне информационной панели

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

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

Всегда помните о контексте пользователей при проектировании — определяйте их технические знания, их знакомство с системой в целом, их цели и так далее.

Обязательно задайте следующие вопросы, пытаясь определить поведение пользователя и контекст:

• Учитывает ли дизайн направление, в котором посетитель привык читать?
• Требует ли взаимодействие с дашбордом технических знаний?
• Удастся ли пользователям выполнить большинство действий всего за несколько кликов?
• Соответствует ли дизайн пользовательскому контексту за счет создания раскрывающихся меню; использует ли он наводящую на размышления иконографию и цветовые палитры?

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

Пользовательские интерфейсы с темной тематикой могут помочь снизить нагрузку на глаза и обеспечить четкость интерфейса. Однако использование этого подхода требует тщательной оценки направления дизайна — преимуществ, недостатков и потенциальных ловушек, как указано в предыдущей статье блога о дизайне: Dark UI Dos and Don't.

Лучший дизайн приборной панели с пользовательскими исследованиями

Исследование пользователей помогает создать среду, в которой пользователям предоставляются релевантные, четкие и краткие данные. Это помогает им думать о содержимом и данных, которые они ищут, а не о том, как их использовать и получать к ним доступ.

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

Дизайнер пользовательского опыта, исследователь и автор Майк Куниавски отмечает, что это «процесс понимания влияния дизайна на аудиторию».

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

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

Прогрессивное раскрытие информации в дизайне информационной панели

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

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

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

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

Анимация — это процесс создания иллюзии движения; это динамика, которая создает ощущение прогресса и постоянную обратную связь, тем самым уменьшая неопределенность пользователя и повышая воспринимаемую производительность.

Преимущества использования прогрессивного раскрытия на информационных панелях:

• Снижение неуверенности и беспокойства пользователей (отображая признаки прогресса, пользователи уверены, что все работает, как задумано)
• Предоставление пользователям того, на что они могут посмотреть (частичное отображение данных), а не заставлять их ждать
• Предоставление пользователям четкого представления о предстоящих шагах и создание понимания того, как информация представлена ​​иерархически.

Потенциальные проблемы с прогрессивным раскрытием информации и загрузкой данных включают:

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

Резюме

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

• Прежде всего, сопереживайте своим типам пользователей и понимайте их цели.
• Донесите до пользователей четкую историю, используя наводящие на размышления визуальные эффекты, метки, прогрессивные методы раскрытия информации и анимацию.
• Упростите сложные вещи, применяя методы исследования пользователей.
• Показывайте данные и информацию в нужное время в системе детализации.
• Используйте визуализацию данных для осмысленного представления информации.

• • •

Дальнейшее чтение в блоге Toptal Design:

• UX электронной коммерции — обзор лучших практик (с инфографикой)
• Важность ориентированного на человека дизайна в дизайне продукта
• Лучшие портфолио дизайнеров UX — вдохновляющие тематические исследования и примеры
• Эвристические принципы для мобильных интерфейсов
• Упреждающий дизайн: как создать волшебный пользовательский опыт