Платформа для изучения английского языка.

• Онлайн-платформа для изучения английского языка (LMS)

  1. Цель проекта

  Создать онлайн-платформу для изучения английского языка с моделью обучения:
  45 минут — автоматизированный урок + 15 минут — онлайн-занятие в Zoom с преподавателем.

  Платформа должна позволять:

  • автоматизировать часть урока (тесты, задания, аудио, тексты, видео);

  • показывать преподавателю результаты ученика до Zoom-занятия;

  • продавать уроки / курсы

• 
  

  2. Технологический стек (предлагаемый)

  • Frontend: Next.js (React, TypeScript, Tailwind CSS)

  • Backend: Node.js + NestJS

  • Админка: PayloadCMS 

  • База данных: PostgreSQL

  • Хостинг: VPS (оформлен на заказчика)

• ⚠️ Важно:
  Frontend для учеников должен быть полностью кастомным по дизайну (Figma), независимо от выбора админки.

  
  

  3. Роли пользователей

  • Админ / Преподаватель

  • Ученик

• ---

  4. Админка / Конструктор уроков (КРИТИЧНО)

  Админ должен самостоятельно, без кода и без программиста:

  • создавать и редактировать уроки;

  • добавлять блоки урока:

    • текст

    • аудио

    • видео

    • картинки

    • тесты

  • менять порядок блоков внутри урока;

  • включать / выключать урок;

  • добавлять дополнительные страницы урока (ДЗ, контрольная).

• Админка должна быть:

  •  PayloadCMS

• ---

  5. Тесты (КРИТИЧНО)

  Система тестирования внутри уроков должна поддерживать:

  • банк заданиями (20–30 вариантов тестов) ; примеры по ссылке на figma

  • банк с блоками (видео, каритинка, текст, аудио).
    
    

• ---

  6. Для ученика

  Ученик должен иметь возможность в личном кабинете:

  • пройти урок, выполняя задания;

  • получить ответы и подсказки(если не правильно)

  • увидеть результат;

  • перейти к Zoom-уроку по кнопке ( если забронировал).

• ---

  7. Для преподавателя

  Преподаватель должен:

  • видеть ответы ученика;

  • видеть результаты тестов до Zoom-урока;

  • видеть историю ответов с предыдущих уроков

• ---

  8. Оплата и доступ

  • Доступ к урокам только после оплаты;

  • Возможность:

    • продавать индивидуальные уроки с учетелем;

    • продавать пакеты / курсы;

    • вручную выдавать доступ ученику.

• ---

  9. Дизайн

  • Дизайн фронтенда (ученик) — строго по Figma;

  • Админка может быть стандартной (если PayloadCMS).

• ---

  10. Контроль и права

  • VPS и все сервисы оформлены на заказчика;

  • заказчик имеет:

    • полный доступ к коду;

    • доступ к базе данных.

• ---

  11. Этапы разработки

  • 1 Этап - админ панель с возможностью создавать задания внутри уроков 
    2 Этап - фронтенд, полный дизайн сайта 
    3 Этап - слияние фронтенда и бекенда с админкой

  • 4 Этап - настройка автоматических оплат wayforpay 
    
    
    
    ЛОГІКА РОБОТИ САЙТУ (USER FLOW + FUNCTIONAL LOGIC)
    1. Головна сторінка
    Головна сторінка містить:

  • коротку інформацію про платформу та методику навчання;

  • пояснення формату навчання;

  • переваги (автоматизовані уроки + заняття з викладачем);

  • CTA-кнопки:

    • Зареєструватися

    • Визначити рівень

    • Переглянути курси

• Дизайн і структура — відповідно до наданих макетів Figma.

  ---

  2. Реєстрація учня

  Користувач проходить реєстрацію:

  • email + пароль (або інший погоджений спосіб);

  • після реєстрації автоматично потрапляє на етап визначення рівня.

• ---

  3. Визначення рівня англійської

  Користувачу пропонується 2 варіанти:

  Варіант А — тест на визначення рівня

  • короткий онлайн-тест +- 80 питань;

  • автоматична перевірка;

  • система визначає рівень (A1–C1).

• Варіант Б — вибір рівня вручну

  • користувач може сам обрати рівень, якщо він його знає;

  • система зберігає обраний рівень.

• ---

  4. Рекомендація продукту

  Після визначення рівня система показує рекомендацію, що придбати.

  Два основні продукти:

  ВАРІАНТ 1 — Самостійне навчання (без викладача)

  • доступ лише до уроків;

  • автоматична перевірка;

  • можливість докупити заняття з викладачем пізніше. 

• ВАРІАНТ 2 — Повний рівень з викладачем (дорожчий)

  • доступ до всіх уроків рівня 32 уроків+контрольні і дз;

  • заняття з викладачем - 32 заняття теж ;

  • бронювання занять можливе тільки після покупки уроків.

• ---

  5. Оплата

  Після вибору продукту:

  • користувач переходить до оплати;

  • після успішної оплати відкривається доступ відповідно до придбаного тарифу.

  • впродовж 3 днів можливо змінити рівень. 1 закриється - бажаний відкриється. 

• ---

  6. Уроки та бронювання занять

  6.1 Уроки

  • користувач бачить сторінку з уроками свого рівня;

  • уроки відкриваються відповідно до логіки доступу;

  • відповіді учня зберігаються і не можуть бути змінені (ні учнем, ні викладачем).

• 6.2 Домашнє завдання

  • сторінка ДЗ відкривається через 2–3 години після проходження уроку;

  • ДЗ має автоматичну перевірку.

• ---

  7. Календар та заняття з викладачем

  • календар доступний тільки після покупки індивідуальних уроків;

  • учень може забронювати заняття ( чи 1 чи всі 32 заздалегіть) з викладачем;

  • якщо учень має лише уроки без викладача — доступна опція докупити заняття. 

• 8. Кабінет викладача

  У кабінеті викладача відображається:

  8.1 Результати учнів

  • результати уроків;

  • повністю пройдений матеріал учня (сторінки з уроками);

  • відповіді учня тільки для перегляду (редагування заборонено).

• 8.2 Календар занять

  • список запланованих занять;

  • календар розбитий на години і у кожній годині по 4 слоти 15 хв

  • можливість:

    • підтвердити заняття;

    • запропонувати зміну часу.

    • закрити слоти часу, якщо час не підходить, до того, як учні почнуть бачити календар

• 8.3 Оплати

  Викладач бачить статистику оплат:

  1. Загальна сума:

     • помісячно;

     • поквартально.

  2. Розподіл:

     • уроки з викладачем;

     • уроки без викладача.
       
       

  3. 9. Словник (інтерактивна функція)

     • при натисканні на будь-яке слово в уроці:

       • слово можна додати до персонального словника;

       • відображається переклад;

       • бажано: аудіо з вимовою.

     • словник зберігається в кабінеті учня.

  4. ---

     10. Дизайн

     • дизайн і структура сторінок — строго за макетами Figma, наданими замовником;

     • це стосується

       • уроків;

ответы програмиста на вопросы:

нужно же оплату отдельно брать за уровни. А уровней 8 шт (а1 а2 а2+ в1 в1+ в2 в2+ с1), после отплати - открывается только 1 уровень, который ученик выберет. Я же не смогу за 3 дня заполнить все уровни уроками. Мне нужно будет закрыть доступ к покупки пустых уровней, пока я не буду готов(пока не заполню).  Я потом сам смогу открыть доступ к уровню с оплатой? через админ панель. - Да, могу добавить чекбокс, скрывать ли курс на сайте, это не проблема

Где именно я буду работать: в PayloadCMS или в кастомной админке? - Админка будет построена на PayloadCMS и стилизована под Вас

Где будет храниться код? - у Вас на VPS

Админка - платная в год? - Нет, тоже будет лежать у вас на сервере

ссылка на пример уроков и тестов: https://www.figma.com/design/QzSeYepBLjHuGNxibMDDEC/Untitled?node-id=0-1&p=f&t=j8iJhCUiwt1l16zI-0

ссылка на прмер дизайна по сайту (вспомогательно) - https://www.figma.com/design/K1krkBTJYgJ1nOVesr3gOF/Untitled?node-id=0-1&p=f&t=Ata5rH65vcpAgeC5-0

также добавляю воросы на отпределения уровня

Вконце оказалось, что под ключ нереально оформить проект, 

Оплата проекта производится поэтапно.

Переход к следующему этапу и следующая оплата

осуществляются только после демонстрации

и принятия результата предыдущего этапа

• 20% — старт ($300)

• 30% — после Этапа 1 ($450)

• 30% — после Этапа 2 ($450)

• 20% — после Этапа 4 ($300)

Исходный код и доступы передаются заказчику

по завершении каждого этапа.