Улучшенный UI для быстрого сравнения строк таблицы
Представьте, что вам нужно изучить взаимосвязи и закономерности в таблице данных. На первый взгляд, это несложная задача, но когда оперативная память перегружена, она может стать настоящим испытанием для вашего мозга. Многие пользователи сталкиваются с этой проблемой, особенно когда пытаются сравнить данные из нескольких строк таблицы.
Главная сложность в сравнении данных — необходимость удерживать в голове значения, особенно если строки расположены далеко друг от друга. Сравнивать соседние строки легко, но при сравнении несмежных строк пользователи вынуждены прилагать дополнительные усилия.
Например, пользователь должен сначала найти название записи слева, затем переместить взгляд вправо, чтобы найти нужное значение. После этого ему нужно посмотреть вниз, чтобы найти следующую запись, а затем снова переместить взгляд вправо, чтобы сравнить данные.
Пользователи вынуждены удерживать значения в своей рабочей памяти во время просмотра таблицы. Однако это крайне сложно, когда вокруг слишком много данных, отвлекающих внимание. Ненужная информация, заполняющая поле зрения, может вытеснять важные элементы из памяти(источник).
Это похоже на ситуацию, когда вы заходите в другую комнату, но забываете, зачем пришли. Любой новый стимул или информация могут отвлечь вас от изначальной задачи.
Чем больше значений необходимо сравнить, тем больше вероятность того, что рабочая память будет перегружена. Риск возникновения ошибки возрастает, если строки расположены далеко друг от друга, а столбцы с ключевыми данными находятся далеко от идентификатора записи.
Ошибки выравнивания при просмотре
Ошибки при выравнивании могут возникнуть, если столбцы с данными находятся далеко от столбцов с идентификаторами записей. Когда пользователь просматривает таблицу, ему необходимо сосредоточить взгляд на одной строке. Если же он случайно переместится на соседнюю строку, то может запомнить неверные данные.
Риск ошибки возрастает, если в таблице много числовых данных. Легко случайно принять значение из соседнего столбца за нужное, особенно если оба содержат числа. Таким образом, пользователь должен не только точно выровнять взгляд по строке, но и по столбцу.
Ограничения при сравнении данных
Табличный формат ограничивает глубину анализа данных. Пользователь может сравнивать только ту информацию, которая отображается в таблице. Если детали записи скрыты в модальном окне, их нельзя легко сопоставить с другими данными.
Иногда пользователям нужно сравнивать не только обзорные данные, но и детали записей. Делать это сложно, если приходится открывать несколько модальных окон и запоминать значения из каждого из них. Такой процесс требует многократного сканирования, прокрутки и нажатий, что может перегрузить рабочую память
Сравнивать данные гораздо проще, когда они находятся рядом и видны на одном экране. Поэтому важно разработать UI для массового сравнения записей.
Начать можно с добавления новой кнопки "Сравнить" в панель массовых действий. Эта панель отображается, когда пользователь выбирает несколько записей.
Однако у такого подхода есть ограничения. Сравнивать 10–20 записей одновременно невозможно и непрактично. Исследования показывают, что человеческое сознание может одновременно удерживать в памяти не более четырех элементов (источник).
Это означает, что для сравнения стоит ограничить количество записей до четырех. Если пользователь выбирает более четырех записей, кнопка "Сравнить" должна становиться неактивной. Таким образом, пользователи могут сравнивать только две, три или четыре записи за раз.
После нажатия кнопки "Сравнить", пользователи увидят таблицу сравнения выбранных записей в модальном окне. В ней будут отображены все детали записей, что позволит сравнивать любые наборы данных.
Табличные строки превращаются в крупные столбцы, где каждая точка данных выстраивается вертикально и выравнивается горизонтально между записями. Значения отображаются крупным и жирным шрифтом для улучшения читаемости и быстрого восприятия. Заголовки колонок имеют ненавязчивый дизайн и располагаются над значениями. Ячейки имеют пропорциональный размер и достаточный отступ, чтобы данные легко воспринимались.
При наведении курсора на значение появляется тонкая подсветка всей строки для удобного сравнения. Пользователи могут прокручивать вниз, чтобы просмотреть все данные. Организованный и чистый интерфейс помогает быстрее находить различия и сходства между значениями.
Если пользователи выбирают три записи для сравнения, ширина модального окна уменьшается, но ширина колонок остаётся неизменной. В верхней части интерфейса также отображается заголовок, указывающий количество записей, которые сравниваются.
То же самое происходит и при сравнении двух записей. Единообразие и согласованность размеров колонок помогают пользователям точно оценить объём информации, который им нужно проанализировать.
Эта UI-модель массового сравнения идеально решает когнитивные сложности, с которыми сталкиваются пользователи при сравнении данных.
Исключает перегрузку рабочей памяти, поскольку на экране остаются только выбранные записи без отвлекающих факторов. Предотвращает ошибки выравнивания при сканировании, так как пользователи сравнивают значения в чётко выстроенных смежных колонках, а не прыгают по строкам. Экономит время и усилия, ведь больше не нужно запоминать значения из отдельных модальных окон — вся информация видна сразу.
Сравнение данных в нескольких строках таблицы — сложная когнитивная задача, которая требует нового, более удобного UI-решения. Будущее таблиц — не только в хранении и отображении данных, но и в том, чтобы ускорить и упростить их анализ.