Дизайн Компания Everpoint
675

Как тренды UX-дизайна влияют на внешний вид навигаторов и карт

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

В закладки
Даже самая детальная веб-карта не будет эффективным инструментом, если навигация внутри нее построена кое-как.

Общие UX - тренды

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

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

Для обеспечения максимально эффективного и комфортного пользовательского опыта многие продукты стремятся взаимодействовать или даже объединяться с синергетическим эффектом.

Специфика профессиональных ГИС

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

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

Но развитие функционала, а особенно использование новых средств визуализации (полноценные объемные модели местности, виртуальная и дополненная реальность) невозможно без развития старых и создания новых UX-структур. Здесь UX обеспечивает функциональный прогресс.

Публичные сервисы

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

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

Учитывая общие тренды, можно выделить несколько популярных UX-стратегий:

  • Узнаваемость

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

  • Специфичность

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

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

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

  • Идеальная визуализация

    Максимальное внимание уделяется качеству визуализации. Используются как традиционные, так и новые средства, включая виртуальную и дополненную реальность.

  • Синергетический эффект

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

  • Расширение функционала

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

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

Так, например, комбинирование стратегий узнаваемости и кейсового мышления позволяет решить задачу удержания пользователя (customer retention), что крайне важно в эпоху клипового мышления не только для карт и геосервисов, но и для цифровой среды в целом. В данном случае речь идет об использовании карточного дизайн-паттерна (активно стал использоваться с 2014 года и тенденция до сих пор актуальна в целом по вебу). Большое влияние на его развитие оказал Material Design. Данный подход позволяет держать фокус пользователя на выполнении строго одной задачи/функции/итерации, что особенно актуально в достаточно наполненных функциональностью ГИС-системах.

Проектирование интерактивных карт

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

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

  • Диапазон масштабов. В зависимости от типа, количества и детальности данных необходимо выбрать диапазон масштабов, в котором нужно обеспечить читаемость карты;
  • Подложка. В зависимости от явлений, которые мы хотим показать, подойдут подложки разного типа и оформления: для отображения объектов городской инфраструктуры, очевидно, понадобится подробная картографическая подложка, для глобальных метеорологических и климатических карт скорее всего подойдет подложка на основе космоснимков;
  • Порядок слоев. Необходимо соблюдать реальный порядок объектов. Мост должен быть отображен поверх реки, а не наоборот. Допустимы сознательные изменения в порядке слоев для расстановки визуальных акцентов;
  • Выбор способов изображения. Типы данных и их географическое распределение диктуют необходимые способы распределения. Например, отображение небольшого набора важных точечных объектов предполагает использование пинов на всех масштабах, а карта с большим количеством объектов, призванная продемонстрировать скорее их распределение, чем конкретное местоположение, будет лучше смотреться в виде тепловой карты;
  • Объективность. При отображении числовых показателей важно не искажать их. Так, если площадные объекты раскрашиваются по абсолютному числовому показателю, необходимо учитывать их площадь — нормировать по ней используемый показатель;
  • Наглядность. Если используются числовые классификации, важно учитывать распределение данных. Выбор алгоритма классификации может существенно повлиять на облик карты;
  • Единообразие графических приемов. Для сложных карт, сочетающих различные данные, важно соблюдать единообразие в оформлении. Если все числовые показатели будут отображены с помощью размера символа, а качественные - с помощью цвета, такая карта будет читаться;
  • Цветовые сочетания. Важно не только использовать гармонично сочетаемые цвета, но и правильно их применять. Если объекты раскрашены от "плохо" к "хорошо", должна применяться цветовая шкала от красных оттенков к зеленым, а не наоборот;
  • Детализация. Стремление отобразить на карте максимальное количество данных часто приводит к тому, что карта становится нечитаемой. Нужно отображать только то, что действительно важно на данной карте.
  • Визуальные акценты. На любой карте есть основной контент и вспомогательный. Основной контент должен выделяться визуальными средствами (размер и цвет значков, контрастность и т.д.), вспомогательный должен его дополнять, но ни в коем случае не перебивать.

#Everpoint #геомаркетинг #ux #картография #ГИС #веб_дизайн

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Компания Everpoint", "author_type": "self", "tags": ["\u043a\u0430\u0440\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f","\u0433\u0438\u0441","\u0433\u0435\u043e\u043c\u0430\u0440\u043a\u0435\u0442\u0438\u043d\u0433","\u0432\u0435\u0431_\u0434\u0438\u0437\u0430\u0439\u043d","ux","everpoint"], "comments": 0, "likes": 6, "favorites": 13, "is_advertisement": false, "subsite_label": "design", "id": 47637, "is_wide": false, "is_ugc": true, "date": "Mon, 15 Oct 2018 20:16:32 +0300" }
{ "id": 47637, "author_id": 210116, "diff_limit": 1000, "urls": {"diff":"\/comments\/47637\/get","add":"\/comments\/47637\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/47637"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114 }

Комментариев нет 0 комм.

Популярные

По порядку

0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Голосовой помощник выкупил
компанию-создателя
Подписаться на push-уведомления
{ "page_type": "default" }