2025TelecomWeb

Успешное тестовое в МТС Web Services

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

Задание

В облачной организации Megamarket существует несколько проектов: Stage, Prod-1 и Prod-2. Необходимо спроектировать интерфейс, в котором администратор проекта Stage сможет добавлять пользователей и назначать им роли. Пользователи могут быть как новыми, так и уже существующими в организации, но ещё не добавленными в проект. Если пользователь уже существует в организации, его организационные роли наследуются в проект, и администратор должен видеть эту информацию и понимать, какие роли будут унаследованы. Администратор изначально не знает, какие пользователи уже есть в организации, поэтому интерфейс должен помогать избежать ошибок и дубликатов. Добавление пользователей происходит по email с указанием роли. Должна быть возможность приглашать сразу несколько пользователей одновременно.

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

Процесс

Рабочий процесс я строил по фреймворку Double Diamond. Получился следующий ход работы:

Понимание задачи

Как получил вводные, я начал разбираться в теме и терминах. Спросил у GPT, где можно посмотреть схожие flow.

Разбил задачу на User Stories и Job Stories, которые буду реализовывать в сценариях.

Когда я ввожу имя пользователя, я хочу видеть, существует ли этот человек уже в организации или проекте, чтобы избежать ошибок и дубликатов

Ilya Lyskov

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

Ilya Lyskov

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

Ilya Lyskov

Когда я добавляю пользователя по email, я хочу видеть, если email некорректный или уже добавлен в проект, чтобы сразу исправить ошибку

Ilya Lyskov

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

Ilya Lyskov

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

Ilya Lyskov

Как администратор проекта, я хочу добавить в проект коллегу, чтобы он получил доступ к проекту

Ilya Lyskov

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

Ilya Lyskov

Дискавери

Из описания задачи в голову сразу пришли несколько сервисов, в которых есть похожий 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.

Итого из наблюдений, как респонденты справляются с задачей, я понял, что мои гипотезы подтвердились. Все справились с поставленной задачей.

Выводы

Считаю у меня получился хороший вариант! И это мнение подкреплено успешным тестированием. Получилось разработать макеты сценария, которые решают задачу из тестового.

Что не успел реализовать:

  1. Выполнял ТЗ на выходных, поэтому не смог задать вопросы по задаче
  2. Доработать некоторые компоненты, стейты для некоторых уже созданных компонентов и добавить стили
  3. Реализовать альтернативный вариант как на GitHub, где мы добавляем сразу несколько пользователей (в одном инпуте) на одну роль
  4. Более подробно расписать и отобразить флоу некоторых экранов

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

cпасибо за уделенное время!

буду рад посотрудничать с вами

Почта скопирована