«Отан» — обучающая платформа для автошколы
Закрытая LMS-платформа на 1000+ уроков с тремя уровнями доступа, видеозащитой и казахской локализацией.
Клиент: Автошкола «Отан»
Что было не так
Школа вела учёт в трёх местах сразу: студенты в одной таблице, уроки в другой, видеоматериалы где придётся — на дисках и в облаке.
Прогресс каждого ученика восстанавливали по памяти: нигде не было видно, кто на каком уроке остановился, кто досмотрел материал, а кто вообще перестал учиться.
Видео при этом нужно было показывать, но не отдавать: платный контент могли скачать и раздать.
Что решили и почему
Решили делать закрытую обучающую платформу вместо таблиц.
Три уровня доступа — студент, преподаватель, администратор — потому что это три разные задачи: студенту нужен свой прогресс, преподавателю группа, администратору вся школа.
Видео с защитой от скачивания и с трекингом просмотра: видно не только «открыл», но и «досмотрел до конца». Без этого прогресс — фикция.
Тесты с автопроверкой, чтобы преподаватель не проверял руками, и отдельный режим работы над ошибками — учиться на своих промахах, а не перерешивать всё подряд.
Доступ ограничен по дате: у обучения есть срок, платформа должна закрываться сама.
Весь интерфейс на казахском — школа казахстанская, ученики учатся на родном языке.
Как делал
- 01
Разобрал текущий процесс школы: где что лежит, кто за что отвечает, что теряется.
- 02
Спроектировал систему: роли и права, структура тем и уроков, режимы экзамена, что видит каждая роль.
- 03
Вёл разработку этапами по планам — базовая платформа и БД, затем UX, затем фильтры и отслеживание активности, затем модуль видеоуроков, затем мобильный интерфейс и экран результатов. Каждый этап отдельным планом с проверяемым результатом.
- 04
Отлаживал пограничные случаи, которые вылезают только в реальной эксплуатации — например, студент начинал экзамен и закрывал вкладку, а незавершённая сессия висела и мешала начать новую. Сделал автоматическое закрытие таких сессий при старте следующей.
- 05
Задеплоил, платформа работает в продакшене.
Стек проекта
- Next.js / React / TypeScript — сама платформа
- Supabase — авторизация и база данных (кто вошёл, что ему доступно)
- Разграничение прав — три роли: студент, преподаватель, администратор
- Видеоплеер с защитой и трекингом — видео нельзя скачать, видно кто досмотрел
- react-hook-form + Zod — формы и проверка вводимых данных
- shadcn/ui + Tailwind — интерфейс
- Framer Motion — переходы и анимации
- Ограничение доступа по дате — обучение закрывается по истечении срока
Результат
Платформа в продакшене, обслуживает поток школы.
Более 1000 уроков в системе.
Учёт перестал вестись в таблицах: прогресс каждого ученика виден в одном месте.
Время на администрирование сократилось примерно на 70%.
Похожие кейсы
Farabi Business School (KazNU MBA) — сайт бизнес-школы
Трёхъязычный сайт бизнес-школы с квизом подбора программы вместо справочника с устаревшей информацией.
- Было:
- У бизнес-школы при национальном университете был сайт с неактуальной информацией и низкой конверсией.
- Сделали:
- Решили пересобрать сайт как инструмент приёма заявок, а не как справочник.
- Стало:
- Сайт работает в домене университета, проект сдан и принят.
«Вверх» — посадочная страница онлайн-интенсива
Посадочная страница интенсива, выстроенная вокруг снятия конкретных возражений — совмещение с работой и цена.
- Было:
- Автор запускала курсы через Instagram — без отдельной посадочной страницы.
- Сделали:
- Решили строить страницу вокруг снятия конкретных возражений, а не вокруг описания программы.
- Стало:
- Интенсив получил посадочную страницу вместо запуска через ленту соцсети.