Workspace Digital Awards 2025 — успейте номинировать кейсы по льготной цене до 1 декабря. Принять участие!
Делаем IT
Запустили образовательную платформу для предпринимателя-зумера
Делаем IT
#Сайт под ключ#Разработка программного обеспечения#Администрирование серверов

Запустили образовательную платформу для предпринимателя-зумера

156 
Делаем IT
Делаем IT Россия, Казань
Поделиться:
Клиент

True School

Сфера

Обучение

Регион

Россия, Москва

Тип сайта

Интернет-магазин, Корпоративный сайт, Порталы и сервисы

Сдано

Февраль 2024

Задача

True School — онлайн-платформа для подростков, которым не хватает знаний из обычной общеобразовательной программы. Цель проекта — дать информацию самым любознательным тинейджерам по доступным ценам и улучшить систему образования.

Главная особенность True School — уникальный набор предметов. Например, в ней студенты изучают математику через призму финансовой грамотности, а русский язык через ораторское искусство. Также на площадке размещаются лекции преподавателей из студентов разных стран — это по-настоящему уникальный контент, к которому в других случаях трудно получить доступ. Например, один из уроков провел профессор из Стэнфорда.

Какая задача перед нами стояла:

True School — это «Школа 2.0». Современная, легкая, технологичная — именно такой ее видит создатель проекта. Из этой философии мы сформулировали 3 основные идеи, которых придерживались в разработке.

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

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

➡Защищенность. В True School публикуется уникальный контент, которого нет на других площадках. Поэтому для и клиента было важно снизить вероятность того, что к платформе смогут получить доступ люди без оплаченной подписки.

Решение

В чем были ограничения и сложности:

Главная трудность состояла в очень ограниченном бюджете. Для нашего заказчика мы были уже четвертым исполнителем, который брался за создание сайта True School. Клиент — молодой человек, он сам совсем недавно выпустился из школы. Поэтому многие студии видели его неопытность, пользовались ситуацией и халатно относились к работе.

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

А дело все в том, что основной образовательный контент на платформе — видео. Предполагается, что один ролик могут смотреть до 300 человек одновременно.

Решается все довольно просто — размещением роликов на сторонних сервисах. Но тут на сцену выходит наше ограничение в бюджете: такие решения стоят денег, и клиент ну никак не мог себе их позволить.

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

1Страница авторизации

True School стал нашим первым проектом в сфере онлайн-образования. При этом в плане функций он не преподнес никаких сюрпризов и особых сложностей — набор фишек у платформы довольно стандартный.

➡Первое куда попадает пользователь — страница авторизации.

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

На этапе разработки этой страницы нам нужно было решить один вопрос безопасности. Для клиента важно, чтобы без оплаченной подписки никто не мог получить доступ к контенту площадки. Например, на некоторых сайтах окно авторизации обходится с помощью POST и GET-запросов. Так злоумышленники получают доступ к видео или другой информации. В нашем случае пейволл взломать не получится.

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

➡На странице регистрации тоже все стандартно — потенциальным студентам нужно ввести имя, фамилию, email и пароль для доступа к платформе.

Далее необходимо подтвердить регистрацию на почте и оплатить подписку на 30, 180 или 365 дней.

Для платежей мы используем эквайринг Тинькофф. И чтобы пользователям было удобно, мы разработали функцию отслеживания наличия подписки и количество оставшихся дней. Благодаря этому студенты в реальном времени видят, сколько еще они могут пользоваться сервисом.

2Shorts

➡На главной странице пользователь может перейти в Shorts — это сборником коротких роликов-сторисов с полезной информацией.

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

Shorts идеально подходит для советов, небольших лайфхаков и других коротких форматов.

3Вкладка с уроками

➡Вкладка с уроками выполнена в виде сетки карточек.

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

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

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

➡После просмотра ролика и, чтобы закрепить знания, студенты проходят тест. Он расположен на отдельной странице, у пользователей есть возможность выбирать из заданных вариантов ответа.

➡В профиле находятся основные настройки: персональная информация, платежные данные, статус подписки и подключенные устройства.

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

Результат

➡Мы реализовали все core-фишки, даже несмотря на ограниченный бюджет. При этом ни одна важная функция не осталась за бортом.

➡Платформа получилась быстрой и легкой. Как с точки зрения бэкенда, так и фронта. Все как мы планировали изначально.

➡Сайт выдерживает нагрузки с большим запасом.

➡ Мы разработали административную панель для загрузки контента и работы с пользователями.

➡Сейчас проект True School полностью запущен

Отзыв клиента

А.Гультяев
А.Гультяев

Директор

Выражаем вам свою благодарность за невероятный труд и профессионализм, который вы продемонстрировали при создании образовательной платформы True School.

скан отзыва
https://schooltrue.ru/

Стек технологий

  • JavaScript JavaScript Язык программирования
  • PHP PHP Язык программирования
  • TypeScript TypeScript Язык программирования
  • Next.js Next.js Фреймворк/библиотека
  • Laravel Laravel Фреймворк/библиотека
  • React.js React.js Фреймворк/библиотека

Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

Делаем IT с удовольствием обсудит вашу задачу

Оставить заявку