Дашборды и аналитические инструменты, которые оперируют сложными данными, не бывают примитивными. Если мы не просто показываем общую ситуацию и высокоуровневые показатели, а стремимся объяснить с помощью данных, почему такая ситуация сложилась и за счёт чего на неё можно повлиять, то входящие данные нельзя упрощать. Мы закладываем в визуализацию ту сложность, которая есть в исходных данных (принципы многомерности и информативности).
Но как при этом избежать «перегруженности»? На мой взгляд, сложное можно показать понятно, если глубоко разобраться во внутренней логике данных и сценариях пользователя — и отразить эту логику в интерфейсе. На визуализации особенно важны последовательность и консистентность графических и интерфейсных решений. Внутренняя сложность не прощает внешней небрежности и запутанности, они сразу оборачиваются «перегруженностью» и «нечитаемостью».
Ниже приведу практические советы по упорядочиванию визуализации.
Одинаковое выглядит одинаковым
Используйте один и тот же формат для одних и тех же данных везде на визуализации. Например, если динамика показателя во времени в одном месте показана столбиковой диаграммой, а в другом — линейным графиком, следует привести их к одному знаменателю. Тогда пользователя не собьёт с толку разное представление одного и того же параметра.
Разное выглядит по‑разному
Выбирайте форматы, которые отражают суть данных, тогда с большой вероятностью разные данные и срезы будут выглядеть по‑разному и станут узнаваемыми для пользователя. Например, если динамика среднего чека во времени и распределение выручки по категориям показаны одинаковыми вертикальными столбиками ради визуальной симметрии на дашборде, избавьтесь от неё и используйте разные форматы. Покажите динамику среднего чека линейным графиком, а для распределения выручки по категориям используйте цветные горизонтальные столбики. Окажется, что в этом случае на линейном графике можно показать не только общий средний чек, но и цветные линии средних чеков по категориям — профит!
Единство цвета
Цвет — один из главных каналов передачи информации на визуализации. Используйте цветовое кодирование для ключевого параметра, в идеале — единую цветовую шкалу на всей визуализации. Если есть необходимость в двойном цветовом кодировании, подумайте, как дополнить или расширить исходную схему (оттенки, прозрачность) или возьмите две кардинально отличающиеся схемы. Никогда не используйте две схемы с пересекающимися цветами.
Единая логика внутри и вокруг дашборда
Обоснуйте логику расположение элементов (заголовков, фильтров, графиков и конролов) на экране. Эта логика учитывает иерархию показателей и срезов — от большого к малому, от более важного к менее важному. Используйте единые правила для всех состояний визуализации.
Продумайте логику переходов между состояниями визуализации, при необходимости нарисуйте схему переходов между разными дашбордами в системе. Ни один экран не должен быть «вещью в себе».
Внимание к тексту
Стремитесь к понятным и лаконичным текcтовым формулировкам везде на визуализации. Всегда используйте одинаковые термины и обозначения для одинаковых понятий.
В качестве примера приведу один из самых простых лабораторных проектов — визуализацию оборота наличности. На входе эти данные представляли собой таблицу из 30 листов в экселе, в которой специально обученные люди искали аномалии внесения и снятия наличных. На интерактивной визуализации получилось сильно упростить представление этих данных без потери глубины.
Ещё один пример, разобранный в прошлом совете инструмент анализа рынка облигаций — самый информационно нагруженный и долговременный проект лаборатории. Из основного графика, созданного за пару недель, мы совместно с заказчиком вырастили полноценную экосистему для принятия инвестиционных решений, насыщенную, и в то же время понятную, где все сущности и показатели буквально разложены по полочкам:
Эти примеры кажутся очень разными, но их роднит то, что логика представления в точности отражает логику данных, лежащих в основе визуализации. Благодаря этому даже самые сложные интерфейсы и визуализации будут доступными для освоения и удобными в использовании.