Дизайн продукта
/
Clipboard and Report section creation
О проекте
Заказчиком являлась компания, использующая технологию искусственного интеллекта для определения и расширения целевой аудитории основных игроков рынка.

Цель проекта — разработать раздел для создания отчетов, который позволял бы пользователям делиться отчетами
с командой или использовать их в презентациях PowerPoint. Помимо этого было необходимо интегрировать внутренний буфер обмена, который позволял бы пользователям сохранять
и далее вставлять определенный контент в различных разделах приложения.
Моя роль
UX/UI Дизайнер
Сроки проекта
Октябрь 2023 - Ноябрь 2023
Определение проблемы
Для клиента было важно разработать простое и эффективное решение для создания и обмена отчетами. Пользователи нуждались в возможности управлять контентом в различных разделах приложения без нарушения рабочего процесса.
Ранее существующие инструменты были фрагментированными
и неэффективными из-за отсутствия единой системы управления контентом.
Определение ценности
Внедрение функции буфера обмена позволило бы создать единый административный центр управления. Что должно значительно повысить эффективность и продуктивность рабочего процесса. Новое решение позволило бы пользователям легко сохранять и передавать содержимое по всему приложению, в том числе облегчая создание отчетов.
Разработка буфера обмена
В ходе работы мы определили сценарии, в которых пользователям необходимо было добавлять различные компоненты с одного раздела приложения в другой.
Ранее для таких ситуаций у нас были предусмотрены библиотеки, однако переключение на них замедляло рабочий процесс.
Чтобы решить эту проблему, мы решили внедрить функцию буфера обмена, позволяющую легко сохранять и добавлять компоненты
в разные разделы приложения.
Как это работает
1
Например, в ходе работы пользователь наткнулся на интересный график и хочет сохранить его для будущего отчета. В такой ситуации он может воспользоваться буфером обмена.
2
Пользователь всегда может открыть буфер обмена через иконку
в хедере, а также раскрыть его в полноэкранный режим для удобства.
Данная опция находится в раскрывающимся меню, также как и возможность добавить график напрямую в отчет
Результаты
После внедрения функции буфера обмена мы провели юзабилити-тесты с участием пользователей, включая коллег
и сотрудников, работающих на стороне клиента, которые не были вовлечены в проект.
Хотя эта фича решала конкретные проблемы, у пользователей по-прежнему возникали вопросы по поводу
ее функциональной составляющей и потенциального использовании в других разделах приложения.
В результате мы составили список вопросов и доработок, необходимых в этих разделах.
1
Как следует интегрировать буфер обмена и отчеты?
Следует ли их объединять или лучше разделить данные разделы?
2
Какие компоненты можно будет добавлять в буфер обмена уже сейчас, а какие следует учитывать для будущих версий приложения?
3
Как лучше реализовать функцию совместной работы в разделе отчетов и каковы возможные ограничения?
4
Какая визуализация была бы оптимальной для работы в разделе отчетов?
Разработка раздела отчетов
Поскольку буфер обмена и отчеты были тесно связаны друг
с другом и изначально основной функцией буфера обмена была поддержка создания отчетов, мы решили объединить их.
Идея состояла в том, чтобы сделать административный центр управления точкой входа для обеих функций, объединив их
в одном модальном окне в буфере обмена.
В дополнение к визуализации отчетов в виде списка, оптимального для быстрого просмотра, когда пользователи точно знают, что им нужно, я разработала пару других версий, которые отображают содержимое отчетов более подробно
с крупными элементами.
Стоит отметить
Мы планировали запустить все варианты визуализации
и со временем проанализировать, какие из них наиболее популярны среди различных типов пользователей, и понять причины их предпочтений.
1
Изначально это решение казалось работоспособным, но после нескольких тестов мы поняли, что оно не масштабируется
для будущих задач. Более того, искать отчеты в других разделах было бы неудобно и запутано.
2
Также мы решили не перегружать буфер обмена чрезмерными элементами и функциональными возможностями, потому что он и так был предназначен для визуально сложных компонентов, таких как карточки сегментов и аудиторий, графики.
Поэтому мы решили сделать Отчеты отдельным разделом в приложении
На первых итерациях Отчеты поддерживали только графики
Функционал отчетов
Создать новый отчет
На странице отчетов пользователи могут выполнять несколько действий: создавать новые отчеты, редактировать существующие, дублировать отчеты или удалять их.
Далее мы рассмотрим основные действия пользователя,
а именно, создание нового отчета и редактирование существующего.
У этого действия есть несколько точек входа:
1
Добавление первого графика в новый отчет. Данное действие перенаправляет пользователя на страницу создания отчета
через подтверждение в модальном окне.
2
Нажатие кнопки “Create new Report” на полноэкранной странице буфера обмена.
3
Нажатие кнопки “Create new Report” на странице отчетов.
1
2
3
Буфер обмена служит основным инструментом для добавления контента
в отчет
На странице отчетов пользователь может найти кнопку редактирования для каждого отчета. Нажатие этой кнопки перенаправляет пользователя на экран редактирования,
где можно настраивать различные параметры.
Кроме того, на страницах создания нового или редактирования существующего отчета пользователь может перейти к созданию шаблона презентации. Этот раздел служит связующим звеном между приложением и загрузкой данных в PowerPoint.
Редактировать отчет
Управлять списком редакторов
Добавлять новые комментарии
или редактировать существующие
Добавлять новой контент в отчет из буфера обмена
Редактировать права доступа к отчету
Добавлять или удалять отчет из быстрого списка
Заключение
Этот проект демонстрирует способность выявлять
и удовлетворять сложные потребности пользователей
с помощью юзабилити-тестов и инновационного дизайна. Несмотря на трудности с интеграцией новых функций
и обеспечением удобства взаимодействия, мы разработали решение, которое повысило эффективность рабочего процесса
и удовлетворенность пользователей.
Работа над разделом отчетов подтолкнула нас к детальной проработке компонентов с графиками. В результате мы создали единые шаблоны для различных типов графиков, которые соответствуют необходимым требованиям к размерам
и визуализации, обеспечивая единообразный и интуитивно понятный пользовательский опыт.
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website