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

Задание
В облачной организации Megamarket существует несколько проектов: Stage, Prod-1 и Prod-2. Необходимо спроектировать интерфейс, в котором администратор проекта Stage сможет добавлять пользователей и назначать им роли. Пользователи могут быть как новыми, так и уже существующими в организации, но ещё не добавленными в проект. Если пользователь уже существует в организации, его организационные роли наследуются в проект, и администратор должен видеть эту информацию и понимать, какие роли будут унаследованы. Администратор изначально не знает, какие пользователи уже есть в организации, поэтому интерфейс должен помогать избежать ошибок и дубликатов. Добавление пользователей происходит по email с указанием роли. Должна быть возможность приглашать сразу несколько пользователей одновременно.
Если вкратце: нужно было спроектировать интерфейс приглашения пользователей в проект: администратор добавляет пользователей по email, назначает им роли и может приглашать сразу нескольких человек. Пользователи могут быть как новыми, так и уже существующими в организации.
Процесс
Рабочий процесс я строил по фреймворку Double Diamond. Получился следующий ход работы:
Понимание задачи
Как получил вводные, я начал разбираться в теме и терминах. Спросил у GPT, где можно посмотреть схожие flow.
Разбил задачу на User Stories и Job Stories, которые буду реализовывать в сценариях.
Когда я ввожу имя пользователя, я хочу видеть, существует ли этот человек уже в организации или проекте, чтобы избежать ошибок и дубликатов
Когда я приглашаю новых пользователей, я хочу указать их роли сразу, чтобы потом не тратить время на переназначение
Когда я закончил добавление, я хочу видеть статус инвайта, чтобы быть уверенным, что приглашения сработали
Когда я добавляю пользователя по email, я хочу видеть, если email некорректный или уже добавлен в проект, чтобы сразу исправить ошибку
Когда я подключаю к проекту сразу нескольких коллег, я хочу добавить их всех за один раз, чтобы не повторять одно и то же действие несколько раз.
Как администратор проекта, я хочу знать какие пользователи уже есть в организации, чтобы не ошибиться с добавлением их к проекту
Как администратор проекта, я хочу добавить в проект коллегу, чтобы он получил доступ к проекту
Как администратор проекта, я хочу видеть список всех пользователей проекта, чтобы понимать, кто уже включён в проект и у кого какие роли
Дискавери
Из описания задачи в голову сразу пришли несколько сервисов, в которых есть похожий flow. Дополнительно, я попросил GPT поискать продукты, где закрываются потребности из Job & User Stories.
Остановился я на GitHub, GitLab, Vercel. Самостоятельно разобрался как в каждом продукте реализованы ранее выписанные сценарии. Сделал скриншоты, вынес их себе в фигму.

Для каждого сценария, отобразил как это работает в продуктах в такой таблице (горизонтально Job & User Stories, вертикально сервисы). Красным стикером помечал наблюдения.
Еще GPT посоветовал прочитать документации BitBucket Cloud (Atlassian), FireBase, AWS, Google Cloud IAM. Просмотрев их, в целом нашел схожие паттерны как и у рассмотренных мной продуктов.
Гипотезы и прототипы
Из-за временных рамок (у меня было 2 дня на выходных ✌️), я не успел описать и приоритизировать гипотезы, поэтому от некоторых идей пришлось отказаться. Но я реализовал все ключевые, собрав тем самым один вариант подходящий под все выписанные сценарии.
По итогу дискавери, пришел к выводу, что: — flow GitHub'a больше подходит под нашу задачу; — GitLab работает иначе, нежели описано в задаче; — у Vercel интересное решение по добавлению пользователей и ролей + есть возможность отправлять инвайт по ссылке;
Отсюда появились идеи, как можно скомбинировать лучшие практики в одном прототипе. Для каждой User & Job Stories я отрисовал по макету (остальные покажу уже в цвете)

UI-kit
После составления прототипа, выделил и собрал компоненты, которые необходимы для проектирования сценариев.
Hi-fi дизайн
На компонентах собрал уже итоговые макеты для каждого сценария. Сделал сразу в темной теме, потому что, исходя из статистики, значительная часть пользователей предпочитает тёмную тему в рабочих интерфейсах.
В качестве фирменного стиля у меня ограничений не было, поэтому я выбрал максимально приближенный к темной теме приложения МТС.
Далее демонстрирую экраны основного сценария приглашения пользователя, подкрепляя их сторями.






Тестирование
После проектирования макетов, я собрал минимальный интерактивный прототип по главному сценарию и провел коридорное исследование на 5 респондентах.
Перед респондентами стояла задача: пригласить пользователя Messi L. и назначить ему роль Editor.
Итого из наблюдений, как респонденты справляются с задачей, я понял, что мои гипотезы подтвердились. Все справились с поставленной задачей.
Выводы
Считаю у меня получился хороший вариант! И это мнение подкреплено успешным тестированием. Получилось разработать макеты сценария, которые решают задачу из тестового.
Что не успел реализовать:
- Выполнял ТЗ на выходных, поэтому не смог задать вопросы по задаче
- Доработать некоторые компоненты, стейты для некоторых уже созданных компонентов и добавить стили
- Реализовать альтернативный вариант как на GitHub, где мы добавляем сразу несколько пользователей (в одном инпуте) на одну роль
- Более подробно расписать и отобразить флоу некоторых экранов
От команды получил несколько вопросов, замечаний и предложений, как можно было бы допилить сценарии. По итогу получил положительный фидбек и хорошую проверку своих навыков.
Вернуться на Главную

