Оформление Геткурс
для проекта PODGORNAYA BROWS

Задача:Разработать новый дизайн для личного кабинета ученика и перенести его на на платформу GetCourse
Дизайн и верстка готовы:
- Страница входа
- Боковая панель
- Главная страница тренингов
- Страница курса
- Списки уроков / подтренингов
- Шаблон уроков
- Шаблоны писем
Процесс работы
Начало сотрудничества
Обычно перед тем, как взять заказ в работу, я созваниваюсь с клиентом обсудить все нюансы предстоящей работы. Мне важно посмотреть Геткурс, структуру курсов, которые собираемся оформлять.
Но в этом проекте мы созвон заменили на записанный клиентом скринкаст, в котором он подробно рассказал, что уже у них есть, что им не нравится в старом дизайне, на что нужно обратить внимание.
Также клиент прислал референсы дизайнов, которые им нравятся и которые НЕ нравятся.
Изучив все, я отправила клиенту смету, он оплатил предоплату и мы приступили к преображению Геткурса.

РАЗРАБОТКА ДИЗАЙНА
Подбор шрифтов, цветовой палтиры, иконок....

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


Главная страница курса

Подтренинги в основном обучении

Список уроков

шаблон урока

страница входа

шаблоны писем

Верстка
Перенос макета из фигмы на платформу Геткурс. Верстка была реализована кодом (html, css, js)
Инструкции для клиента
После завершения работы над проектом я отсняла видеоинструкции, в которых рассказала, как пользоваться новым оформлением.



Оксана Иванова
веб-дизайнер, верстальщик