КЕЙС
Настройка и оформление курса
ФАКУЛЬТЕТ РЕГРЕССИВНОЙ ПСИХОЛОГИИ
Технические настройки курса
1
Модификация структуры курса
Перед тем как начать оформление этого проекта, требовалось выполнить ряд технических настроек.
Прежде всего, необходимо было изменить структуру курса. В данном проекте насчитывается более 85 уроков, которые изначально представляли собой простой список, без разделения по темам.
Для улучшения восприятия материала были созданы 14 модулей, и уроки были распределены по соответствующим темам.
Прежде всего, необходимо было изменить структуру курса. В данном проекте насчитывается более 85 уроков, которые изначально представляли собой простой список, без разделения по темам.
Для улучшения восприятия материала были созданы 14 модулей, и уроки были распределены по соответствующим темам.
2
Настройка последовательного доступа к модулям
После разделения уроков на модули, необходимо было сделать так, чтобы модули не открывались все сразу и не зависели от расписания уроков.
Для этого в каждом модуле сделаны все необходимые настройки для последовательного доступа к модулям после прохождения предыдущего. То есть, чтобы приступить к новому уровню, ученикам нужно будет завершить все домашние задания предшествующего модуля.
Для этого в каждом модуле сделаны все необходимые настройки для последовательного доступа к модулям после прохождения предыдущего. То есть, чтобы приступить к новому уровню, ученикам нужно будет завершить все домашние задания предшествующего модуля.
Устали от технических сложностей?
Закажите услуги по настройке Геткурс и запускайте курсы с уверенностью!
Оформление курса
Оформление главной страницы курса
“Факультет регрессивной психологии”
С адаптацией под все планшетные и мобильные устройства
А также сделана адаптация в Chatium (приложении Геткурса)
А также сделана адаптация в Chatium (приложении Геткурса)
Оформление главной страницы курса “Обучение по методу регрессивной психологии”
1
Установка и оформление главного баннера + баннер с изображением диплома.
Шапка-баннер на главной странице курса
Дополнительный баннер на главной странице курса
2
Установка, настройка и оформление блока “Последний просмотренный урок”
- для корректной работы данного блока произведены все необходимые настройки в каждом уроке с применением JavaScript кода;
- сделана анимация кнопки и иконки внутри блока.
Блок "Последний просмотренный урок"
3
Установка, настройка и оформление блока “Ваши данные”
- отображение данных ученика, которые он может изменить, нажав на кнопку;
- сделана анимация кнопки и иконки внутри блока.
Блок "Ваши данные"
4
Установка, настройка и оформление блока “Режим работы службы заботы”
- нажав на кнопку, ученик переходит на страницу обратной связи. Здесь можно поставить любую другую ссылку для обратной связи;
- сделана анимация кнопки и иконки внутри блока.
Блок “Режим работы службы заботы”
5
Оформление списка модулей
- для каждого модуля создана и установлена тематическая иконка;
- модули оформлены прямоугольными плашками;
- при наведении сделана анимация, то есть модули меняют цвет с плавным перемещением на несколько пикселей вправо.
Оформление списка модулей
Дайте своей онлайн-школе новое дыхание!
Закажите оформление и сделайте обучение еще более увлекательным!
Оформление всех модулей со списком уроков
Оформление списка уроков
- Установка и оформление баннера с названием модуля и логотипом школы.
- Установка и оформление кнопки “Вернуться к списку модулей”.
- Установка блока “Режим работы службы заботы”.
- Оформление списка уроков:
- уроки оформлены прямоугольными плашками с автоматическим отображением установленных тематических картинок;
- при наведении на урок сделана анимация;
- проработаны все виды уроков - “нет задания”, “есть задание”, “задание выполнено”, “задание на проверке”, необходимо выполнить задание”, “урок не доступен”;
- установлены соответствующие иконки на каждый вид урока.
Сделана адаптация оформленных страниц под все устройства различных форматов
Адаптация списка уроков
Оформление всех уроков курса
- Оформление шапки урока под общий стиль курса.
- Установка соответствующих иконок в шапке.
- Анимация при наведении на кнопки “предыдущий урок” и “следующий урок”
- Проработка всех возможных блоков урока:
- текстовый блок;
- домашнее задание;
- блок с комментариями;
- блок с анкетой;
- блок с тестом;
- блок с прикрепленными файлами;
- блок с ссылками.
Стилизация боковой панели меню
Стандартный дизайн главного меню совсем не вписывается в новое оформление курса. И, конечно же, для визуального восприятия будет уместно оформить боковую панель в едином стиле всего курса.
Оформление боковой панели меню
С помощью CSS code я сделала меню более уникальным и привлекательным:
- Изменила цвет фона для меню и его элементов.
- Заменила иконки для всех пунктов меню.
- Изменила стиль кнопок меню и добавила плавную анимацию при наведении.
- Изменила стили для активного и выделенного состояния кнопок.
- Изменила стили виджета в мобильной версии.
- Изменила стили текста и фона выпадающего меню.
- Установила цвет и плавную анимацию при наведении на пункты подменю.
