UX Movement
August 5

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

Когда встроенная функция редактирования не работает

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

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

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

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

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

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

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

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

Перевод статьи The Easiest Way to Bulk Edit Data Tables из блога UX Movement Newsletter.

В нашем Телеграм-канале UX Teddy публикуем так же переводы практических статей из блога UX Movement про проектирование сложных интерфейсов, форм и страниц — подписывайтесь!