Programica

Programica

онлайн-школа

Что такое онлайн-школа Programica?

Programica - это EdTech-проект, который пришел к нам с идеей создания образовательной площадки для подготовки учеников к ЕГЭ по математике. В результате эта идея воплотилась в масштабируемую платформу для подготовки к ЕГЭ с возможностью создания неограниченного количества курсов. Уже в процессе реализации проекта проект масштабировался до 2х предметов - математики и русскому языку.

Сегодня это удобный инструмент, с помощью которого пользователи могут:

  • проходить групповые онлайн-уроки с возможностью переписки с преподавателем в чате видео-трансляции, 
  • участвовать в вебинарах в рамках платформы, 
  • получать и выполнять домашние задания, 
  • готовиться к ЕГЭ с помощью функционала  "Тренировок", которые автоматизированы на основе ML- алгоритмов;
  • и многое другое.

Задача проекта

Разработать онлайн-площадку со своей системой видео-трансляций, функциональным личным кабинетом для разных ролей -  учеников, кураторов и преподавателей, а также обеспечить их комфортное взаимодействие в образовательном процессе.


Проектирование и дизайн

Работа над проектом началась с анализа ЦА и других онлайн-школ, формализации требований заказчика. На основе аналитики была разработана концепция проекта, которая включила в себя: 

  • функциональные и бизнес-требования к проекту
  • описание архитектуры проекта
  • описание структуры сайта для всех ролей пользователя
  • предлагаемый план разделения проектов на этапы.

Реализацию проекта мы разделили на 6 итераций. На каждую было разработано частное техническое задание. В результате каждая итерация решала свою серию задач.

В рамках разработки проекта мы использовали Agile-подход. Все процессы, которые можно было запустить параллельно, выполнялись параллельно. Выбранный подход помог ускорить процесс разработки. Между релизами работа не прекращалась. По окончанию каждого спринта мы демонстрировали Заказчику достигнутые результаты.

Бренд и стиль школы был разработан студией Method Zero by PINKMAN. 

На основе этого стиля мы разработали дизайн-систему в Figma и для разработки интерфейсов личного кабинета использовали ее компоненты.

При разработке дизайна личных кабинетов мы делали ставку на UX/UI. Programica - это сложная и многофункциональная платформа, поэтому основной задачей было сделать так, чтобы работа с сайтом была удобной для учеников, кураторов и преподавателей.

Дизайнер Денис Соколов:

“Особенность подобного продукта — подвижность, гибкость. В зависимости от условий: куплены ли уроки, начата ли домашка или тренировка, найден ли куратор — компоновка и вид разделов с блоками меняют своё состояние. У одного блока может быть до пяти различный вариаций. И это только «Главная» ученика. Здесь ключевой задачей было оптимизировать процесс — мы разработали дизайн-систему и использовали auto-layout, components и variants в Figma. За счет этого макеты можно было собирать словно в конструкторе — быстро и эффективно.

Нам потребовался широкий взгляд: мы детально изучали не только смежные продукты, но и видеохостинги, и приложения календарей, и мессенджеры — чтобы дать достойный пользовательский опыт в таких разделах как «Трансляции», «Расписание» и «Чаты». Над айдентикой и лендингом онлайн-школы работала студия Method Zero by Pinkman. Этот визуал портал наследует частично. Интерфейс выполняет роль «рамы у картины» — он самобытный, но не тянет на себя внимание и дает возможность сконцентрироваться на контенте.”


Разработка

Стек технологий
  • Frontend: Vue.js/Vuex
  • Backend: PHP 8.0, Laravel, PostgreSQL, Redis
  • Инфраструктура: Git, GitLab, Yandex.Cloud
  • Микросервис чата: Nest.js, Typescript, MongoDB
  • DevOps: Docker, Ansible
  • Административная панель: Laravel Backpack
Ученик

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

Реализована нетривиальная система курсов.

  • В рамках одного предмета может быть несколько курсов. 
  • У каждого курса может быть неограниченное количество потоков, в том числе проходящих параллельно. 
  • Для каждого потока курса можно вносить персональные изменения.
После оплаты ученику становится доступен раздел “Класс”.
На главной странице раздела выводится статистика по выполненным ДЗ, пройденным урокам и тренировкам, расписание, ссылка на ближайший урок, доступны записи прошедших уроков и др.
Онлайн-уроки
  • неограниченное число пользователей
  • чат с преподавателем
  • доступны запись, конспект, презентация урока
Домашние задания
  • ограничение по времени выполнения;
  • можно сохранить ДЗ в статусе черновика;
  • в рамках ДЗ отображается запись урока, ссылка на конспект, презентацию, статистика решения заданий;
  • отправка уведомление по итогу проверки;
  • автоматическа проверка результатов
Тренировки

Для генерации персональных тренировок Заказчик предоставил базу заданий с ответами для внедрения на платформу.
  • Тренировки проверяются автоматически платформой без привлечения ресурсов кураторов
  • Возможность сравнения пройденных тренировок с предыдущим месяцем. 
  • Возможность проходить тренировки к ЕГЭ в целом и нарабатывать опыт по конкретным темам.
Куратор

Основная задача куратора - это проверка домашних заданий, консультации и помощь ученикам в рамках чата платформы.
  • куратор видит количество необработанных заданий; 
  • с помощью виджетов контролирует сроки обработки домашних заданий;
  • имеет возможность установки сортировки по дедлайну проверки;
  • в рамках проверки ДЗ может смотреть само задание, прикрепленные файлы;
  • может оценить каждое задание, оставить комментарий.

Учитель/Преподаватель

Основная задача учителя - проведение онлайн-уроков, вебинаров.

Видеотрансляции

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

Имеет доступ к будущим урокам для подготовки и просмотру домашних заданий учеников. 

Функционал видеотрансляций реализован посредством open-source решения Jitsi Meet с автоматической записью уроков на стороне сервера c помощью Jibri.

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

Чат и центр уведомлений

Чат - это отдельный микросервис, интегрированный в платформу. В зависимости от роли на платформе реализованы разные связки, например, ученик может писать только куратору и в техподдержку.

Функционал:

  • разделение чата по вкладкам: уведомления, техподдержка, выбор куратора;
  • возможность в чате обмениваться файлами и изображениями;
  • поиск по переписке;
  • возможность для администратора просмотра переписки;
  • уведомления о начале урока для учителя и ученика.

Руководитель проекта со стороны MACHAON, Евгений Околита:

“Проект помог сплотить команду и вывести качество и понимание проектов на новый уровень. Каждый участник команды вносил и вносит свои пожелания наравне с аналитиком. В результате чего получилось избежать однобокости решения и предоставить максимальную возможность для изменений и масштабирования в будущем.”


Результат

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

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

Тестируются отдельные гипотезы, собирается обратная связь, формируется бэклог новых задач к релизу.

Тимур Мамедов, основатель онлайн-школы Programica:

“Очень долго выбирали с кем работать. Поступали разные предложения. Ключевым фактором в выборе MACHAON как подрядчика стал широкий портфель edtech проектов, начиная с проектов для Британской высшей школы дизайна, заканчивая зарубежными кейсами.

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



Выдаем результат

Мы реализовали функциональную, масштабируемую платформу для подготовки к ЕГЭ с возможностью создания неограниченного количества курсов.
Готовый проект: https://programica.ru/
Тип проекта: EdTech
Хочешь такой же?
Позвони или напиши нам
или
Оставить заявку
^ Наверх