ГБУ «Автодороги»

Чем крут проект?

ГБУ «Автомобильные дороги» Москвы — одна из ведущих организаций дорожно-коммунального хозяйства в столице. В ведении учреждения — 3500 единиц техники. В штате — более 20 000 сотрудников.

Учреждение активно внедряет новые технологии. Вот и сейчас потребовалось заменить старую десктопную программу по обработке внутренних заявок. Компания-разработчик уже запустила тестовую версию. Но интерфейс показался ГБУ неудобным.

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

Решение

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

Найти золотую середину

Отправляюсь на установочную встречу с командой разработчиков. Сначала вникну в суть проекта и узнаю об ограничениях. Затем проведу интервьюирование экспертов.

Ребята вздыхают: «Уф, с чего же начать? Проект такой объемный». Но по ходу дела я быстро разбираюсь, что к чему. Просматриваем и комментируем новый тестовый интерфейс.

В целом он выглядит довольно чисто и приятно. Но вот незадача — заказчику из ГБУ он вовсе не по душе.

У разработчиков есть еще одни макеты. Их нарисовал подрядчик. Но ГБУ тоже забраковали логику расположения элементов.

Под конец мне показывают скетчи, нарисованные уже самим заказчиком. «Вот как нам надо!», — передает представить Автодорог, отправляя самостоятельно подготовленные мокапы. Разработчики хватаются за голову. Такой вариант кажется им неприемлемым.

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

Я прошу отыскать скрины старой десктопной версии программы. Ведь новый веб-интерфейс разрабатывался на её основе.

Всё сразу встает на свои места. В старом интерфейсе было много привычных для операторов вещей. А при создании нового их просто проигнорировали.

Важное мнение

Крайне важно опросить конечных пользователей. Ведь до этого разработчики всегда общались с руководством. Но, согласитесь, никто из них проводит за работой с программой 8 часов кряду 7 дней в неделю. Реальным юзерам видней.

Я готовлю онлайн-анкету и передаю в ГБУ. Идеальным вариантом было бы получить ответы всех сотрудников. Но информация даже от небольшого количества опрошенных проясняет многие моменты.

В небольшую анкету я умещаю и Flow-, и Activity-, и Sequence-, и Ergonomic-model-вопросы. Остается только обработать результаты.

Время действовать

Качественный интерфейс отличают четыре критерия:

— скорость работы с ним,

— отсутствие ошибок,

— быстрота обучения,

— удовлетворённость пользователя.

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

Ориентир на Gmail

Заказчик предлагает организовать рабочую область подобно почтовой программе. Такую логику расположения элементов поддерживают и 71% опрошенных. Один из лучших ориентиров — Gmail. Шапку делаем более информативной и компактной. Многочисленные «галочки» слева заменяем на современные чекбоксы (как на сайте ozon.ru). Сохраняем цветовое кодирование заявок (каждому статусу — свой цвет), привычное пользователям.

Удобные плашки

В левой части — выпадающее меню для перехода в другие разделы. Это экономит место, позволяет выводить там любое количество пунктов, а также служит заголовком страницы. Кнопка создания новой заявки — слева над фильтрами. Правее — пиктограммы печати, формирования отчета, удаления. Объемный фильтр в верхней части спрятан на выпадающую плашку. А у пользователей появилась возможность добавлять наиболее часто используемые параметры для фильтрации в «Мои фильтры».

Логичная редактура

Кнопка «редактировать заявку» отсутствует. Если пользователь захочет изменить параметр, то по клику на слово, оно превратится в дропдаун. Все данные логично разделены на блоки. В верхней плашке размещена ключевая информация, затем основные данные, сгруппированные по типам контента. Следом — сообщение и прикрепленные файлы, отображающиеся так, что пользователь сразу видит весь объем приложений.

Карту и историю — на видное место

Как показал опрос, все пользователи ежедневно открывают карту с заявками. Именно поэтому карта нужна на первом экране. Но чтобы она не занимала место, можно просто свернуть её под «аккордеон». В правом столбце выводим все даты и историю изменений. Пользователи ежедневно просматривают эту информацию. Для удобства работы совместим модули. Размещаем кнопку добавления комментария вверх.

Понятное добавление заявки

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

Заявки в поп-апах

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

Посмотрите вживую

После завершения работы над прототипами я готовлю обоснование. Это отличный вариант защиты своих проектировочных решений. Тем более когда заказчик находится удаленно, а общение производится через компанию-разработчика. Так все мои идеи будут донесены без искажений, а у заказчика не останется вопросов.

Понравился проект?

Давайте обсудим