Первичное ТЗ и требования

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

Бенчмаркинг

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

Прототипирование UI

Спроектировали интерфейс и информационную архитектуру, показали иерархию элементов, их взаимное расположение, смысловые акценты.

Тестирование прототипа

Настроили интерактив и провели UX тесты на пользователях для проверки основных бизнес-гипотез. Как результат — нашли слабые места в дизайне и улучшили интерфейс до разработки.

Цветовая палитра

Реализовали палитру и правила колористики для проекта, с учётом контрастности. Предусмотрели палитру для тёмной темы.

UI компоненты и Состояния элементов

Сделали UI Kit основных компонентов с необходимыми состояниями, чтобы фронтенд-разработчику было понятно, как ведёт себя интерфейс и как он выглядит в том или ином случае.

Сборка на компонентах

Собрали тёмную тему, используя UI kit компонентов и цветовую палитру. Благодаря системной организации проекта дизайн тёмной темы может занимать всего несколько дней.

Макеты в Figma

Сделали макеты страниц в 4 разрешениях под разные устройства: десктоп, ноутбуки, планшеты, смартфоны.

Стейты страниц

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

Публичная часть

На сайте реализовали каталог курсов, расставили цветовые акценты на целевых действиях: переход на страницу курса и покупка.

Сопровождение дизайна

Реализовали множество сопутстствующих работ: шаблоны email, тексты уведомлений и подсказок, список достижений, рекламные баннеры и т.д.

Разработка MVP

Сайт школы сделали SPA-приложением, настроили интеграцию с личным кабинетом, эквайрингом и amoCRM.

Админка

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

ЛК слушателя

У слушателей свой личный кабинет. В профиле есть дашборд со статистикой и прогрессом. Слушатели проходят курсы, получают достижения. Есть чат для общения с однокурсниками и кураторами.

ЛК куратора

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

Интеграции

Настроили авторизацию через соц. сети. Подключили онлайн-оплату через Сбер API, рассрочку через Тинькофф и сделки в amoCRM. Настроили хранение и трансляцию видео контента через CDN-сервис.