SLINKOV•Design
дмитрий слиньков

Кейс дизайна данных для федеральной торговой сети

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

Дано

Видели ли вы как оформляется поставка товара? Водитель, он же курьер, привозит в магазин несколько коробок сникерсов или прокладок. Продавщица, она же товаровед, подписывает бумажки. Так происходит во всем мире. Казалось бы, надежный тотальный учет?! Нет. Чтобы доверять всем этим бумажкам снова и снова, поставщик и магазин должны с незавидной периодичностью закидывать друг друга актами сверки. А иногда даже садиться за стол переговоров и решать: нахер сверки — ты мне должен столько-то. То есть, бумага порождает бумагу, которая порождает электронную запись, которая порождает бумагу, злость и вражду… и всё это толком не сбивается в единую цифру почти никогда. При этом, у обоих контрагентов могут быть самые навороченные компьютерные системы, ценность которых все равно разбивается о ручные сверки.
Дабы положить конец этому безумию, до некоторых уже доходит «простая» мысль: а что если оба контрагента сядут наконец-то в одну аналитическую систему вместо двух?!

В итоге получается многомерный куб федерального масштаба. Он объединяет в себе и ритейлеров и поставщиков. Вместо того, чтобы заниматься недельными сверками и штрафовать друг друга, они все просто «сидят» в едином информационном поле.

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

Что нужно сделать

Функциональные требования были следующими:

  1. Скорость. Наглядность, сопоставимость, открытость и разумный минимализм. Как результат, увеличивается скорость принятия управленческих решений.
  2. Устойчивость. Наглядность графиков, таблиц и дашбордов должна сохраняться даже при самых экстремальных, нештатных изменениях исходных данных.
  3. Онбординг. Освоение аналитической системы новыми сотрудниками должно проходить быстро. Подсказки в соответствии с уровнем квалификации пользователя — часть самостоятельного изучаемой системы.
  4. Стиль. Фирменный стиль той компании, представитель которой вошел в систему, необходимо квалифицированно, динамически встраивать во все аналитические экраны.
  5. Нормативка. Соответствие директиве о веб-доступности («Web Accessibility Directive» или «Directive (EU) 2016/2102»).
  6. Совместимость. Любые решения дизайна данных должны быть реализуемы существующей системой на любых устройствах пользователей.

Расскажем вам сегодня о самой, пожалуй, наглядной части этого проекта: разработке аналитического трехмерного дашборда.

Как мы это сделали

Для начала мы, вместе с заказчиком, разобрали товаропоток на типовые «косточки»:

Производитель → Распределительный центр производителя → Распределительный центра ритейл сети → Магазин → Семья потребителей.

Все эти этапы нужно было представить максимально реалистичными трехмерными изображениями. Забегая вперёд, скажу, что нам легче было взять за основу проекты и high resolution фотографии реально существующих зданий.

Итак, вот вам галерея того, как рождался магазин:
А вот так создавался распределительный центр:
Заводы тоже брались «живьем», с натуры:
Ну и постепенно из всего этого получались вот такие 3d-здания и семья потребителей:
Кроме того, заказчик особо настаивал на сходстве виртуальных экранов с аналогами из фантастических фильмов типа Аватара.
В качестве инструмента рисования зданий был выбран Autodesk 3ds Max. Семью и одежду мы подбирали на стоковых площадках, где можно взять 3d героев на любой сюжет. Даже на не шибко приличный))
Композиция семьи
Дэшборд. Стартовый экран для тысяч пользователей — сотрудников ритейловой сети и её поставщиков.
Дэшборд. Стартовый экран для тысяч пользователей — сотрудников ритейловой сети и её поставщиков.

Одевание семьи и сведение всей сцены производилось в мощном бесплатном опенсорсном инструменте Blender.

Окончательная доводка под формат десктопного экрана, а также нарезка на компоненты для верстки в HTML производилась в Figma.
Почему мы?
Почему именно нам доверили такое дело?
Мы занимаемся данными 20 лет. А дизайном — «только» 10 ))
Мы создавали рынок систем бюджетирования, контроля и анализа в РФ, Украине, Молдове и Казахстане.
Было дело, внедряли мощные аналитические системы: Business Objects, SAP SEM, Comshare, Hyperion, Cognos, Tableau, Oracle Siebel, Power BI и др. Знаем о них почти всё.
У наших спецов есть опыт методологической постановки. Мы ставили процессы сбора и анализа данных в корпорациях на тысячи пользователей по всей РФ.
Вот уже страшно сказать сколько лет мы занимаемся разработкой продающих презентаций, веб-сайтов и рекламных видеороликов для инновационных бизнесов и при этом...
Мы знаем как представлять данные для разных носителей, стилей и форматов.
И да: мы работали с Big Data, когда этого слова еще не было! )))

Сценарий использования

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

Пользователи всё равно сюда заходят. Конверсия не нужна никакая. Нарисовал несколько цифр и вперёд.

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

То есть, многие будут смеяться, но внутренние проекты, с точки зрения маркетинга, нуждаются в том же самом, что и внешние:
  • Портрет потребителя
  • УТП
  • Название
  • Слоган
  • Логотип
  • Айдентика
  • Воронки захвата и т п.
Итак, каждый пользователь заходит в систему именно через этот экран. Но в идеале он показывает им цифры в их айдентике. Совсем как в современных рекламных технологиях спортивных состязаний. Каждый видит именно то, что релевантно его рынку.
Виртуальная реклама при трансляции футбольного матча. Источник: metro.co.uk

Эти цифры показывают только то, что нужно в первую очередь.

Далее, после клика, можно провалиться в изящные детали, над которыми конечно же тоже поработали UI и UX специалисты.

Чтобы было понятно что мы делаем с разномастными табличками, вот тут подвигайте:
Многие могут задать язвительный вопросик: «Нафига условному PowerBI или ClickView какой-то ещё дизайн, если вся эта красивость поступает вместе с купленной системой в коробке?» Да дело в том, что не поступает. Какая-нибудь демо-компания да, красивое. Шаблоны — тоже да. Но как только вы всё это начнёте заполнять своими данными, красота уходит. Да и не до неё, когда проект внедрения аналитической системы только начался. До полезности бы сначала добраться.

Прямо как вот этом комиксе:
Среднестатистический процесс выбора аналитической системы в организациях

Ещё одна аналогия на этот счёт. Возьмите мощную библиотеку шаблонов лендингов Тильды. Они конечно же делают Интернет менее мерзостным. Но, оказавшись в руках занятого своим бизнесом недизайнера, зачастую, они не спасают от появления на свет некрасивых сайтов.

Получилось что-то уникальное? Делай курс!

Работа юзеров кипит, как никогда. Чтобы всё это развивалось самостоятельно, делаем гайды. Есть мысли из таких гайдов создать учебный курс. Потому что в нашей стране всё, что про UI, оно про веб-сайт, приложения, да про мобилки. А про данные — ни-че-го.

Будем работать над этим!

Если есть какие-то вопросы, пишите!
    ***
    Мои истории в Телеграм-канале.

    Да! И есть еще закрытая фб-группа «Маркетинг инноваций». Стучитесь — я открою!