Принципы грамотной визуализации при разработке приложений

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

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

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

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

Таким образом, и постоянно растущие объемы информации, и существующая задача экономии времени как в учебном процессе, так и профессиональная деятельность предъявляют требования к представлению и передаче информации в компактном виде. Решение данной задачи сегодня видится в раскрытии и применении различных форм выявления выявленных образований. Следовательно, процесс раннего развития «визуального мышления» становится важным аспектом при работе с информацией [3].

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

  • символы – знаки абстрактных референтов: слова, эмблемы, визуальные изображения;
  • иконы схем, включающие диаграммы, схемы, чертежи и другие виды «нефигуративных» изображений;
  • иконы изображений, а именно фотографии, изображения, повышение полноты представления отображающегося объекта;
  • индексы, занимающиеся замещением референта разрешений визуальных сообщений [2].

Визуализированная информация представляется в сжатой форме, в виде внутреннего символа-образа [5]:

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

Термин «визуализация» в общем понимании в науке трактуют как «представление физических явлений или процесс в форме, удобной для зрительного восприятия» [1], с использованием графических форм, где изображение является извлечением смысловой части вербального (текстового) сообщения, что лучше воспринимается и позволяет быстро и эффективно донести до зрителя собственные мысли и идеи. Физиологически, восприятие визуальной информации является основной для человека. Есть многочисленные исследования, подтверждающие, что:

  • 90% информации человек воспринимает через зрение;
  • 70% сенсорных рецепторов находятся в глазах;
  • около половины нейронов головного мозга человека задействованы в обработке визуальной информации;
  • на 19% меньше при работе с визуальными данными используется когнитивная функция мозга, отвечающая за обработку и анализ информации;
  • на 17% выше производительность человека, работающего с визуальной информацией;
  • на 4,5% лучше вспоминаются подробные детали визуальной информации.

Исходя из вышеизложенного, сделаем вывод, что

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

Как показывают различные исследования, особенно в графических и художественных сферах [4], человек предрасположен обрабатывать именно визуальную информацию, что позволяет:

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

Тем самым, успешность корректной визуализации напрямую зависит от правильности ее применения.

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

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

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

Разрешение представленных недостатков мобильных приложений возможно при учёте основных принципов визуализации:

  • Поставьте цель – что вы хотите показать.
  • Сформулируйте конкретную задачу.
  • В зависимости от цели располагайте данные в логическом порядке: от большего к меньшему, или наоборот.
  • Выбирайте подходящий тип визуализации данных, который упростит восприятие информации.
  • Единообразие графиков. При сравнении используйте графики одного типа.
  • Подписывайте данные непосредственно на графике, так мозг воспринимает картину целиком и быстрее делает выводы.
  • Минимум элементов при визуализации – убирайте лишнюю информацию, логотипы, даты, визуальный шум. Чем проще график – тем быстрее информация доходит до мозга.
  • Лаконичный дизайн. 3D-эффекты отвлекают внимание читателя от информации и не решают задачу.
  • Общепринятые цвета: «правильно» выделяется зелёным, а «неправильно» – красным.

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

Текст статьи
  1. Азимов, Э.Г. Новый словарь методических терминов и понятий (теория и практика обучения языкам) / Э.Г. Азимов, А.Н. Щукин. – М.: Издательство ИКАР, 2009. – 448 с.
  2. Бразговская, Е.Е. Семиотика. Языки и коды культуры: учебник и практикум для академического бакалавриата / Е.Е. Бразговская. – 2-е изд., испр. и доп. – М.: Издательство Юрайт, 2019. – 187 с.
  3. Каракозова, Е. Н. Визуализация при формировании иноязычной информационной компетенции студентов технического вуза // Проблемы современного педагогического образования. 2022. №74-1.
  4. Катханова, Ю.Ф. Творческие способности и их развитие в графической деятельности // монография – Чебоксары: ИД «Среда», 2018. – 140 с. ISBN 978-5-6041637-3-3. doi:10.31483/r-21623
  5. Моторная, С.Е. Предварительный просмотр информации о технологии обучения в высшей школе / С.Е. Моторная // АНИ: педагогика и психология. – 2020. – №2 (31). – С. 177-183.
Список литературы