UI-перепроектирование корпоративного портала
Раньше мы уже работали с «АльфаСтрахованием» — проектировали интерфейс внутренней информационной системы. На этот раз нашей задачей было UI-перепроектирование интерфейса для сотрудников компании.
Любой проект начинается с обоснования
У «АльфаСтрахования» есть внутренний портал, площадка для корпоративного контента и для HR-сервисов. Личный кабинет — это разводящая страница, с которой и только с которой можно открыть сервисы. Все сервисы объединены на левой панели, сумбурной и неудобной.
Так раньше выглядел личный кабинет
Вот такие сервисы будут когда-нибудь на портале
Нам нужно было сделать личный кабинет сотрудника и два сервиса («Мои отпуска» и «Мои заявки») человечнее: проще, удобней и доступней для пользователя.
Сервис «Мои отпуска» до перепроектирования
Чтобы понять масштаб проблемы, посмотрите, как выглядели эти сервисы до перепроектирования.
Сервис «Мои заявки» до перепроектирования
Обсуждаем
Обсудили будущий интерфейс с представителями заказчика. Заподозрили, что быстрого проекта не получится: каждый из них представлял результат по-своему, единого мнения не было ни о чем. Даже о назначении и функциональности кабинета с сервисами.
И действительно, этот небольшой проект занял немало времени: любое предложение долго обсуждалось на самом высоком уровне.
А еще нормально работать мешала секретность. У нас не было доступа к порталу — пришлось ездить в петербургский офис за скриншотами. Переговоры — только по телефону, потому что внешние мессенджеры в компании запрещены.
«АльфаСтрахование»: портрет сотрудника
Анализируем
Мы описали пользовательские роли (их всего две — руководитель и рядовой сотрудник) и сценарии использования.
Сценарии использования личного
Кабинет и сервисы руководителя должны функционально отличаться от кабинета и сервисов рядового сотрудника. В частности, руководитель принимает решения по заявкам подчиненных — в «Моих заявках» должен быть соответствующий раздел.
Сервис «Мои заявки», сценарии руководителя и сотрудника
Рисуем
Утвердили документы и начали рисовать. Работали мелкими итерациями, результаты показывали в виде презентаций.
Со стороны заказчика проектом занимался новый сотрудник, еще не вполне знакомый с внутренними процессами компании. Согласовывал любое изменение со всем начальством — по всей цепочке руководства. А это очень долго.
Директор по развитию в какой-то момент решил нарисовать кабинет сам — в свободное время, так что это затянулось. А мы тем временем занялись сервисами «Мои отпуска» и «Мои заявки».
Пытаясь показать, каким хочется видеть личный кабинет, в «АльфаСтраховании» перерисовали наш вариант. Вот что у них получилось
Проектируем
Нарисовали детализированный прототип, показали заказчику, запустив очередное внутреннее обсуждение.
Вот что у нас получилось.
Вот сюда попадает сотрудник, который хочет на море в апреле и в глушь, в Саратов — в октябре
Сервис «Мои отпуска» дает возможность посмотреть график отпусков, заявить о намерении отдохнуть, перенести отпуск на другие даты.
Формы заявок на отпуск и на перенос отпуска
Отдельный сервис позволяет просматривать эти и другие заявки, следить за их статусом.
Сервис «Мои заявки», одобренная заявка на отпуск
Руководитель принимает решения по заявкам подчиненных — в «Моих заявках» есть соответствующий раздел («Мне на согласование» с подразделами «Кадровые документы» и «Заявки на отпуск»).
Сервис «Мои заявки», раздел «Мне на согласование»
Дизайн
Оформили все в корпоративных цветах «АльфаСтрахования». Компания очень серьезно относится к корпоративному стилю: в огромном, очень подробном style guidу больше сотни страниц.
Корпоративные цвета «АльфаСтрахования»
Библиотека компонентов
Сделали библиотеку компонентов (UI kit), чтобы в «АльфаСтраховании» дальше могли рисовать самостоятельно — по мере развития портала. Это точно понадобится: пока мы работали над «Заявками» и «Отпусками», появилось несколько новых сервисов.
Итак, мы сделали все, что запланировали. В «АльфаСтраховании» посмотрели на наши прототипы, приняли дизайн…
Внезапный поворот
…Но тут в компании внезапно заметили, что корпоративный портал в целом не очень хорош.
И взяли паузу, чтоб принять стратегическое решение — переделывать ли портал полностью или поручить нам UI-доработку. А стратегические решения — это надолго. Вот, до сих пор ждем.
Но, возможно, у этого кейса все-таки будет продолжение.