Спроектировали интерфейса для сервиса онлайн-терапии с психологом, который содержит функционал:
- Онлайн-сессии с психологом
- Заметки по клиентам
- Настройка расписания
- Баланс и вывод средств
- Электронные сертификаты
Прототипы интерфейса
На прототипах согласовали информационную архитектуру, иерархию элементов, и их взаимное расположение, с учётом приоритетов от бизнеса и аналогичных удачных решений.
Дизайн-концепт
Цель сервиса — безопасный выход в онлайн-практику для начинающих и опытных психологов. Для этого спроектирована отдельная страница для специалистов с подробной информацией о преимуществах сервиса.
Стартовая страница
В интерфейсе личного кабинета сделали чистый визуал с цветовыми акцентами на целевых действиях. В дизайне стремились не перегружать, сделать интерфейс удобным для регулярного использования.
Расписание специалиста
На странице специалиста сразу видно доступные варианты для бронирование. Отображаем стоимость и длительность сессии, показываем часовой пояс при выборе времени и даём возможность выбрать ближайшее доступное время специалиста в один клик.
Бронирование и оплата
При бронировании времени выводим сводную информацию для проверки. Для групповых сессий предусмотрено поле "пригласить по email".
Онлайн-сессии
В назначенную дату и время создаётся онлайн-встреча внутри платформы. Вторым этапом планируется реализация групповых сессий с участием нескольких клиентов.
Настройки профиля
В настройках профиля помимо управления информацией добавили уровень специалиста, который завязан на количество проведённых сессий и влияет на размер комиссии сервиса.
Баланс аккаунта
В личном кабинете предусмотрен баланс: клиент использует баланс для оплаты онлайн-сессий. Специалист получает на баланс средства от успешно проведённых сессий.
Отзывы
На страницу специалиста в каталоге добавили блок с отзывами, чтобы клиенту было легче найти своего специалиста, сравнить и определиться с выбором.
Состояния экранов
В дизайне предусматриваем все состояния экранов, в том числе отправку отзыва, состояние модерации, отклонение отзыва и публикацию на странице специалиста.
Админка и статистика
Для администраторов в личном кабинете сделали раздел со статистикой по сессиям, финансам и пользователям. В дальнейшем предполагается масштабировать этот раздел.
Контроль сессий
В админ панели предусмотрено расширенное управление основными сущностями: пользователи, сессии, финансовые операции, отзывы.
Настройка расписания
Реализовали удобное расписание в ЛК специалиста, где он может отмечать слоты, доступные для бронирования клиентами. Предусмотрели опции уйти в отпуск, сдублировать расписание на следующий месяц и скопировать слоты на другой день.
Макеты в Figma в 5 размерах
Сделали макеты в 5 разрешениях для всех страниц всех ролей. Предусмотрели макеты для стейтов: состояния до начала сессии, во время и после завершения.
Шаблоны email писем
Сделали тексты ошибок, уведомлений, подсказок. Составили список системых событий и шаблоны email уведомлений для каждой роли.
UX-тесты на пользователях
После согласования прототипа мы собрали фокус-группу из психологов в качестве респондентов, подготовили задания по прототипу и провели UX тестирование, чтобы выявить проблемы в интерфейсе, понять, что неудобно или чего не хватает. Как итог — доработали интерфейс с учётом пожеланий специалистов.
UI kit
Реализовали необходимые UI компоненты и их основные состояния, чтобы у разработчиков не осталось вопросов как должен вести себя интерфейс в том или ином случае.
Типографика
Реализовали правила, по которым выстроена типографика проекта, поведение шрифтов в зависимости от разрешения экрана, начертания и семантики страницы.
Размерности и адаптивы
Определили брейкпоинты для разработки под популярные устройства и разрешения экранов, чтобы дизайн выглядел консистентно, не зависимо от контекста использования.
Цветовая палитра
Разработали правила колористики с учётом принципа контрастности, составили правила построения теней у элементов. Определили основные оттенки и акцентные цвета.
ACL
Реализовали правила разграничения доступа к разделам и функционалу для всех ролей пользователей. Позже ACL будет использоваться разработчиками при проектировании архитектуры приложения.
Готовность к разработке
Таким образом за 3 месяца проведены все необходимы предпроектные работы, реализован дизайн-проект интерфейса и UI-kit необходимых компонентов с основными состояниями, правила колористики и типографики проекта. Интерфейс протестирован на реальных пользователях, проверены основные бизнес-гипотезы, найдены слабые места в дизайне и улучшены до разработки.
В результате качественно выполнили все предпроектные работы. Сделали документацию с функциональными требованиями и тест-кейсами. Передали проект команде разработки. Сейчас оказываем поддержку по ходу разработки. Срок выполнения с момента подписания договора до начала разработки составил 3 месяца.
Нужен дизайн интерфейса?
Опишите задачу в свободной форме, в течение часа мы отправим стоимость дизайна. Пишите, мы открыты интересным проектам.
mail@cron.design
telegram: @сrondesign
