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