321

Дизайн геткурса для школы BlaBlaInvest

Описание задачи

К нам обратилась школа BlaBla за оформлением личного кабинета Геткурс. Была необычная задача — сделать дизайн сказочным и в стиле мультфильма «Алиса в стране чудес». У клиента было изображений, шрифты, дизайн лендинга. Это хороший набор материалов для старта оформления.

Задача

Сделать новый дизайн для школы на Getcourse в волшебном стиле.

Зачем, цель

Клиент мечтал о новом дизайне геткурса. Это всегда была его боль. Сделав новый дизайн мы решаем юзабилити-проблемы текущего дизайна Getcourse. Кроме этого мы связязываем все площадки клиента. .

Бизнес-требования к продукту

  • создать уникальный стиль, которого не будет ни у одной школы
  • пользователи должны иметь тот же функционал, но в новом дизайне
  • найти моменты, который можно улучшить в стандартном дизайне Getcourse
  • создать вау-эффект через волшебный стиль
  • сделать механики геткурса интереснее

Отзыв клиента

Результат клиента — x2 в заявках

До оформления заявок в лист предзаписи было 500−600, после анонса оформления — 1200

Дизайн до упаковки

Дизайн геткурса для школы BlaBlaInvest 1
Страница курса
Дизайн геткурса для школы BlaBlaInvest 2
Страница модуля
Дизайн геткурса для школы BlaBlaInvest 3
Страница урока

Процесс

Это необычная задача, потому что обычно надо в фирменном стиле оформить удобно в привычном стиле.

А здесь нужно было создать волшебство какое-то. ячфвафывфы

Обновленный дизайн

В новом дизайне нам надо было показать волшебство. Мы добились этого через необычные формы в боковой панели, шрифта, иллюстраций.

Страница курса, когда пользователь не оплатил курс

Когда пользователь еще не купил курс, ему доступен только первый модуль. Чтобы получить доступ к другим модулям — он должен купить их.

Мы показываем недоступность через создание ч/б эффекта на фото и отделением кнопокой «Провалится глубже в страну знаний»

Дизайн геткурса для школы BlaBlaInvest 4

Страница курса, когда пользователь оплатил курс

Когда пользователь оплатил курс, другие модули курса становятся доступыными. Мы показываем это через удаление ч/б эффекта с фото.

Дизайн геткурса для школы BlaBlaInvest 5

Страница модуля с уроками

Картинки и фон каждого модуля мы из списка модулей передаем в шапку. Чтобы у пользователя оставался фокус и он понимал, куда он попал.

В списке уроков мы используем тематические изображения, которые отражают название урока.

Дизайн геткурса для школы BlaBlaInvest 6

Дизайн элементов страницы урока

Я разрабатываю для страницы уроков набор элементов, из которых можно собирать все остальные страницы.

Дизайн геткурса для школы BlaBlaInvest 7

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

После разработки всех элементов страницы урока я взял одну страницу из уроков клиента и стилизовал ее с новыми элементами.

Дизайн геткурса для школы BlaBlaInvest 8

Блог тестирование, дизайн разных состояний

Цель дизайна — повышать вовлечение. В блоке с заданием я повышал вовлечение с помощью изображения портала.

Я зазываю пользователя в красивый портал срелками. Кликая на него, пользователь начинает отвечать на вопросы.

Если он ответил неправильно, портал становится красноватым, показывая, что входа нет.

Когда пользователь ответил правильно, портал загорается ярке, показывая, что можно пройти.

Дизайн геткурса для школы BlaBlaInvest 9

Заказать крутой дизайн
Поделиться
Отправить
Линкануть
Вотсапнуть
← К списку проектов