Пять китов создания эффективной информационной панели
Первое знакомство с любой системой происходит через панель инструментов. Поэтому переоценить важность ее дизайна очень сложно. Ведь из увиденной картинки пользователь делает сразу несколько выводов:
— насколько информативна подача;
— как быстро он сможет достичь нужных целей;
— под силу ли ему разобраться со всеми данными.
Дашборд по сути должен дать визуальный обзор всего продукта, предоставив анонс всех возможных его функций.
Имея опыт UX/UI дизайна более 13 лет, KLONA готова поделиться своими секретами и правилами создания идеального dаshboаrd.
Определение типа дашборда
Первым шагом несмотря на то, что дизайн и функционал – несколько противоположные понятия, является изучение функций устройства и целей непосредственного использования приборной панели.
В зависимости от поставленных задач различают три типа:
Аналитические панели
Помогают ответить на вопросы: «Почему так произошло?» и «Чего ожидать в разных случаях?». Для них характерны большие объемы данных и возможность выявления тенденций. Состоят из сложных таблиц, диаграмм, графиков.
Прекрасно подходят для отслеживания изменений определенного значения во время длительного периода, а также для прогнозирования ситуации в будущем.
Решение для руководителей и аналитических отделов.
Цель: позволит увидеть текущие проблемы, определить тенденции и понять задачи улучшения ключевых процессов.
Оперативные дашборды
Дают картинку состояния процесса в реальном времени. Позволяют мониторить текущие данные. Обычно включают простые графики и метки.
Вариант для менеджеров, управления техникой, игр и программ онлайн.
Цель: оценка ежедневных показателей.
Стратегические приборные доски
Отслеживают ключевые показатели и влияют на принятие долгосрочных решений. Такие дашборды зачастую имеют временные рамки – месячные, квартальные, годовые шкалы производительности.
Выбор для руководителей.
Цель: мониторинг ключевых показателей работы, отслеживание производительности за указанный период, анализ эффективности.
Изучение аудитории
Определить пользователей поможет и предыдущий шаг. Но это в глобальном смысле.
Более конкретно перед разработкой дизайна дашборда нужно узнать всю информацию об аудитории, — кто будет непосредственно работать со всеми показателями.
И в этом случае поверхностным анализом не обойтись. Нужно хорошо изучить следующие аспекты:
— кто будет работать с панелью?
— какую информацию будут использовать для разных целей и задач;
— какой имеется опыт взаимодействия с метриками и данными;
— какие есть приоритеты в визуале и цвете.
Главное – понять цель поиска пользователя и изучить его путь к ней. Это и есть основной ориентир во всей схеме проектирования UX/UI дизайна dаshboаrd.
Анализ целей и ожиданий
Эффективные панели информации – это комплексный сбор данных для принятия обоснованного решения. Поэтому для разработки дизайна приборной доски нужно понимать, какие решения должны в итоге приниматься и какие данные необходимы быть в метрике.
Опрос аудитории, которая будет работать с установкой, покажет существующий опыт и поможет внедрить его в новые метрики и графики дашборда. Только так можно определить спектр нужных данных и задать их динамичность.
Выбор вида отображения данных
Громоздкие и неудобные электронные таблицы, сохраняющие кучу информации, не смогут поместиться на экран дашборда и не обеспечат должного удобства восприятия и работы. Идеальной альтернативой в этом случае станут диаграммы и графики, использование которых также имеет свои особенности:
— для акцентирования внимания на самом важном показателе лучше применять диаграмму с одним значением;
— для отображения динамики его изменения подойдет диаграмма с индикатором на одно значение;
— провести сравнение фактических данных с целью позволит пулевая диаграмма;
— продемонстрировать несколько наборов данных стоит в табличном формате, при этом количество строк не должно превышать 10;
— непрерывные данные лучше мониторить с помощью линейной диаграммы;
— диаграмма столбчатая покажет изменения во времени для данных из одной категории;- круговая диаграмма наиболее быстро и понятно передает картинку сравнения секторов. Более информативной ей поможет быть детализация данных сегмента при наведении курсора или активации определенного фрагмента;
— более оригинально выглядит точечная диаграмма для сравнения переменных, но при этом понимание данных займет больше времени и потребует больше усилий.
При выборе любого типа метрики стоит отталкиваться от главных требований к дизайну приборной панели – она должна быть информативной, понятной и полезной пользователю.
Важные советы по разработке полезной информационной панели можно посмотреть в видео:
Организация приборной панели
Завершающим этапом в разработке дизайна дашборда является создание проекта (наброска, прототипа) на основе определенных целей и подобранных графических элементов.
Для начала стоит создать саму структуру панели, используя сетку, в которую и будут вноситься сгруппированные метрики.
Существуют специальные правила оформления дашборда:
— важные параметры должны располагаться в верхнем левом углу (по правилу чтения);
— связанные индикаторы обязательно группируются вместе, предотвращая длительные поиски пользователем нужного следующего показателя;
— для разделения групп нужно использовать пустое пространство, что также придаст дизайну доски легкости и удобства;
— для лучшего понимания и восприятия данных можно повторно применять отдельные элементы дизайна диаграмм, достигая целостности и единообразия подачи.
Дьявол в деталях — главные правила разработки дизайна дашборда
Создание приборной панели – это задача сделать показатели максимально понятными, что обеспечит эффективность достижения целей. А вот для этого нужно уделить максимальное внимание всем аспектам и деталям, гармонично сочетая простоту восприятия и стильность подачи.
Удобно, как только возможно
Дашборд будет более понятен и удобен для работы с данными, когда будут соблюдены следующие правила:
— сравниваемые элементы должны визуально группироваться;
— связанная информация располагается в непосредственной близости;
— визуальный баланс достигается путем выравнивания элементов дашборда, подачей в виде информационной сетки;
— разделить разные аспекты мониторинга позволит дополнительное пустое пространство между секциями, группами;
— быстро прочитать данные без перегружения визуала можно с помощью известных сокращений или информативных меток.
Усложнять просто, упрощать сложно
Наиболее понятная панель должна обеспечивать простоту подачи максимально сложных показателей. Другими словами, нужно представить сложные понятия в простой и понятной форме:
— ограничьте объем информации, не перегружая восприятие;
— используйте меньше столбиков, сложных для прочтения, выбирая в качестве альтернативы яркие и понятные акцентные диаграммы и графики;
— оставьте только нужные показатели, согласовав их количество с пользователями;
— отображайте числа в удобном формате, округляя их по возможности и не путая пользователя длинным хвостом, не несущем важной информации.
Приоритеты прежде всего
Нельзя смешивать все данные вместе, иначе второстепенное запутает и не даст дойти до нужной цели.
Определите главные показатели и создайте своеобразную иерархию подачи информации на панели:
— на первом месте размещаются самые важные данные;
— на втором идут тенденции, раскрывающие предыдущие показатели;
— далее – информация, которая помогает разобраться в проблеме.
Важные элементы нужно также визуально выделить, сделав это с помощью размера шрифта, цвета, анимации и т.д.
Размер и форма имеет значение
Речь идет о таком элементе дизайна как шрифты и метки. Текст и подписи данных должны хорошо читаться и гармонично вписываться в рисунок диаграмм.
Выберите оптимальный шрифт, используя для выделения вес шрифта, заголовки. Можно взять несколько стилей, применяя их к разным группам.
Правильно размещайте легенду графического объекта: на большом экране – под диаграммой, на миниатюрном устройстве – над диаграммой. Главный критерий – легенда должна быть в поле зрения при работе с данными.
Для удобства чтения графиков и диаграмм также используются метки. При этом их написание должно быть только горизонтальным – максимально удобным для пользователя.
В случае использования сложных метрик лучше дополнить их формулами или описаниями, что облегчит интерпретацию и сделает восприятие более комфортным.
Палитра восприятия
Цвет — это та область, где наш разум соприкасается со Вселенной. Пауль Клее
С помощью цвета можно придать дизайну дашборда характер, сделав его уникальным и эффективным. Для этого стоит тщательно продумать и выбрать цветовую схему, используя не более шести оттенков. Такая палитра должна использоваться для всех метрик на приборной доске, что поможет быстрее ориентироваться в показателях.
Для создания контраста или выделения главных элементов применяются цветовые акценты, оставляя для второстепенных данных нейтральные тона.
Для передачи динамики непрерывных данных можно использовать один цвет, играя с его насыщенностью.
ВАЖНО! Не стоит сбрасывать со счетов существующие стойкие ассоциации, перекручивание которых может завести пользователя в заблуждение (красный предупреждает о проблеме, зеленый показывает положительный результат и т.д.).
Напутствие на пути к идеальной панели
Создав эффективную панель информации (даже с учетом всех рекомендаций), нужно постоянно отслеживать ее пользу для целевой аудитории. Очень часто дизайн может потребовать изменений. Чтобы быть уверенным в безупречной работе программы, нужно периодически проводить опросы пользователей, анализировать обратную связь, тестировать функциональность прибора. Всегда стоит стремиться к улучшению и развитию, всегда есть, куда расти.
И в завершение, если вы сомневаетесь в успешном собственном пути к идеальному дашборду, то вы всегда можете рассчитывать на команду KLONA, в активе которой сотни реализованных проектов по разработке UX/UI design dashboard.
Свяжитесь с нами, и наши специалисты отобразят ваши сложные показатели в удобном и полезном формате.
Мы – не лучшие, мы просто делаем ЛУЧШЕЕ!