Кейс · Фитнес и обучение тренировкамGetCourse · Оформление

Оформление GetCourse Академии Антипова

Оформил каталог тренингов, курс «Ягодицы» и его 15 уроков. Перенёс в учебные страницы светлый фон, коралловые акценты и шрифт из готового гайдлайна Академии Артёма Антипова.

Моя работа: CSS для существующих страниц GetCourse, тема курса, оформление видео и заданий, адаптация под телефон.

Каталог тренингов

Каталог Академии Антипова: заголовок «Твоё обучение», светлые карточки четырёх тренингов и коралловая линия в шапке. — Реальный каталог после подключения оформления. Сохранены четыре тренинга, их названия, описания и ссылки. Скриншоты сняты в аккаунте администратора, поэтому на них видны служебные кнопки GetCourse.

Задача

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

Что сделал

Подготовил CSS под фактическую разметку GetCourse. Каталог оформил отдельно, а для курса «Ягодицы» подключил собственную тему. Она применяется к содержанию курса и всем его 15 урокам; другим тренингам эту тему не назначал.

Что изменил в оформлении

Карточки тренингов

Настроил светлые карточки с крупными названиями, отступами и скруглениями. В шапке появился заголовок «Твоё обучение», для акцентов использован коралловый цвет из гайдлайна.

Содержание курса

Уроки Дня 0–Дня 14 оформлены отдельными строками. Сохранены переходы, порядок уроков и отметки о наличии задания. Расписание и доступы оформление не меняет.

Видео и навигация

Оформил название курса, шапку урока, переход к следующему занятию и рамки плееров. Видео и тексты остались в штатных учебных блоках GetCourse.

Задания и ответы

Настроил вид блока задания, поля ответа, прикрепления файлов и комментариев. Сохранены штатные формы платформы; вместо них не добавлялись декоративные поля.

Все 15 уроков

Полный список курса «Ягодицы»: пятнадцать карточек от Дня 0 до Дня 14 с переходами и отметками задания. — Содержание курса целиком. Все уроки используют одну тему оформления. Скриншот можно увеличить.

Каталог на телефоне

Мобильная версия каталога: четыре тренинга в одной колонке, названия и описания переносятся по ширине экрана. — Браузерная мобильная версия. Карточки и текст перестраиваются по ширине экрана, каталог показан целиком.

Страница урока

Верхняя часть вводного урока: название курса, День 0, переход к следующему уроку и целый видеоплеер в коралловой рамке. — Верхняя часть вводного урока с навигацией и полным плеером. Ответы учеников и их персональные данные в скриншот не включены.

Как подключено

Общий каталог использует отдельный CSS. Курс и уроки используют тему GetCourse: изменения стилей применяются сразу к страницам выбранного курса. Подключение проверял по фактической версии CSS на странице.

Результат

Каталог и выбранный курс оформлены в палитре Академии. Учебные материалы, ссылки и структура сохранены. Для изменения оформления уроков не нужно править каждую страницу отдельно: стили собраны в теме курса.