Вы можете настроить код формы, которая вызывается при оформлении заказа
Оформление GetCourse
для курса «PRO ONLINE»
Екатерины SVL
Адаптивная верстка страницы главной страницы курса и списка уроков.
Разработка и внедрение блоков "Календарь" и "Доступ по покупке".
Задача
Что было до
-
Стандартный интерфейс GetCourse
Платформа использовалась в типовом виде — без кастомизации и дополнительных функций.
-
Отсутствие визуализации прогресса
Ученики не видели, какие модули и уроки уже пройдены, а какие закрыты.
-
Нет дополнительных инструментов
Отсутствовали календарь, доска почета, новостной канал и другие мотивационные блоки.
-
Не было информации о доступе
Ученики не знали, сколько дней осталось до окончания доступа к курсу.
-
Отсутствие блока техподдержки
Не было возможности быстро связаться с поддержкой или узнать график ее работы.
Что нужно было сделать
- Сверстать главную страницу курса с кастомным отображением модулей
- Сверстать страницы модулей со списком уроков
- Реализовать блокировку закрытых модулей с иконкой замка и блюр-эффектом
- Внедрить систему отметки просмотра модулей и уроков
- Вынести в правую колонку: календарь, новостной канал, доску почета, продление доступа
- Добавить блок техподдержки с графиком работы и кнопкой связи
- Интегрировать блок доступа к тренингу с обратным отсчетом дней
- Настроить календарь с датами открытия уроков и дополнительными событиями
- Добавить пометки об экспертах на уроках приглашенных спикеров
- Разместить блок результата модуля с описанием, чему научится ученик
Что было сделано
Главная страница курса
Создал главную страницу с кастомным отображением модулей и дополнительными блоками в правой колонке.
- Список модулей: каждый модуль отображается с уникальным фоном и статусом
- Закрытые модули: заблюрены и помечены иконкой замка
- Просмотренные модули: автоматически помечаются на основе прогресса уроков внутри
Страницы модулей
Сверстал страницы модулей с детальным списком уроков и дополнительной информацией.
- Список уроков: каждый урок помечается статусом просмотра
- Пометка «Эксперт»: уроки приглашенных спикеров имеют специальную метку
- Блок результата модуля: описание, чему научится ученик после прохождения
Правая колонка (общие блоки)
Вынес в правую колонку все дополнительные инструменты и блоки.
- Календарь: даты открытия уроков + дополнительные события (мастер-классы)
- Новостной канал: кнопка для перехода в ТГ-канал эксперта
- Доска почета: кнопка для перехода к списку лучших учеников
- Продлить обучение: кнопка для продления доступа к курсу
- Техподдержка: график работы + кнопка для связи
- Доступ к тренингу: отображение оставшихся дней доступа
Результат
Главная страница курса
Список уроков
Видео-обзор
Отзыв клиента
«Оформление для меня важная составляющая продаж, которая отражает качество и подход обучения. Поэтому при создании нового продукта нужно было сделать дизайн платформы для учеников. Результат работы отличный, все корректно работало и визуально конечно же это шикарно выглядит 🔥».
