Шагай дома
Дизайн-ведение онлайн-проекта аэробных тренировок
Редизайн сайта для онлайн-клуба тренировок, создание общего визуального кода компании, дизайн-сопровождение в течение 2 лет.
*сайт редактируется заказчиком, возможно изменение исходного дизайна
Команда проекта
- Алина ЛапинаСтарший дизайнер
Задача
Сделать редизайн текущего сайта компании и сопутствующих материалов, заниматься техническим обслуживанием
Что было сделано
- Разработала дизайн-код компании на основе только одного логотипа
- Оформила все точки контакта с аудиторией: дизайн рассылок, визуал для социальных сетей (оформление группы Вконтакте и визуал для Инстаграма), креативы под рекламу, дизайн подарочного сертификата, оформление личного кабинета пользователя на GetCourse
- Провела исследование конкурентов и целевой аудитории, составила структуру сайта, написала тексты, сделала дизайн и сверстала на Tilda
- Занималась техническим обслуживанием сайта: добавляла новые страницы, вносила правки
- Собирала UI-киты
- Работала в связке с проджект-менеджером, отделом маркетинга и отделом SMM, помогала команде во внедрении нового дизайна, обучала использованию сайта
- Тестировала гипотезы по увеличению конверсии в связке с отделом маркетинга
О проекте
Шагай дома — это онлайн-клуб аэробных тренировок. Клуб действует на основе ежемесячной подписки. Основная идея клуба — привлечь как можно больше людей к активному образу жизни. Тренировки разработаны таким образом, что у них нет противопоказаний по здоровью и они по силам каждому. Поэтому в клубе состоят участники от 30 до 90 лет.
С чем пришел клиент
Вот так выглядел сайт и социальные сети:
Сайт
Работу начала с сайта, так как это ключевой этап воронки, конвертирующий лида в покупателя.
Я проанализировала сайты конкурентов, в основном клиент ориентировался на компанию FitStars, взяла идеи по структуре и формулировкам. Далее проанализировала целевую аудиторию на основе отзывов, комментариев и вопросов в тех поддержку. Узнала боли и потребности, чтобы закрыть их на сайте.
Составила вайрфрейм, проработала структуру сайта, побуждающую пользователя к покупке. Написала тексты, бьющие в боль, а также добавила эмоций и побудительных действий. Заголовки сделала информативными, чтобы сразу доносить ценности или закрывать потребности, такие как: «Тренировки подойдут всем», «Ходьба — самый безопасный вид физической активности» и другое. Также в заголовках есть много призывов к действию, что побуждает записаться в клуб и передает энергию движения.
Я проанализировала сайты конкурентов, в основном клиент ориентировался на компанию FitStars, взяла идеи по структуре и формулировкам. Далее проанализировала целевую аудиторию на основе отзывов, комментариев и вопросов в тех поддержку. Узнала боли и потребности, чтобы закрыть их на сайте.
Составила вайрфрейм, проработала структуру сайта, побуждающую пользователя к покупке. Написала тексты, бьющие в боль, а также добавила эмоций и побудительных действий. Заголовки сделала информативными, чтобы сразу доносить ценности или закрывать потребности, такие как: «Тренировки подойдут всем», «Ходьба — самый безопасный вид физической активности» и другое. Также в заголовках есть много призывов к действию, что побуждает записаться в клуб и передает энергию движения.
По дизайну основными пожеланиями заказчика были — много динамики, крупные кнопки, фирменный красный цвет, чтобы сайт вызывал энергию и позитив.
Общая дизайн концепция разрабатывалась так, чтобы без труда можно было переложить ее на другие материалы компании. Я подобрала яркую палитру, которая включает в себя красный, оранжевый и желтый цвета, что передает нужные эмоции и делает сайт запоминающимся.
Также подобрала массивный и динамичный шрифт, с которым проект сразу заиграл.
Для дизайна я выбрала интерфейсный стиль. Он выглядит дружелюбно, а также отсылает к интерфейсу приложений, что подходит, так как это онлайн-продукт. Добавила динамику за счет видео, двухцветных заголовков и графических элементов.
Общая дизайн концепция разрабатывалась так, чтобы без труда можно было переложить ее на другие материалы компании. Я подобрала яркую палитру, которая включает в себя красный, оранжевый и желтый цвета, что передает нужные эмоции и делает сайт запоминающимся.
Также подобрала массивный и динамичный шрифт, с которым проект сразу заиграл.
Для дизайна я выбрала интерфейсный стиль. Он выглядит дружелюбно, а также отсылает к интерфейсу приложений, что подходит, так как это онлайн-продукт. Добавила динамику за счет видео, двухцветных заголовков и графических элементов.
Далее я регулярно сопровождала сайт, вносила корректировки, совместно с отделом маркетинга тестировали гипотезы по увеличению конверсии. Через год работы сайт трансформировался, стал проще и удобнее.
Также в процессе работы были разработаны дополнительные страницы:
- страница блога
- лид-магнит бесплатной тренировки
- отдельный лендинг для марафона по похудению
- страница по каждой программе тренировок
Дизайн-сопровождение
На основе разработанной дизайн-концепции были оформлены также другие материалы компании:
- дизайн почтовых рассылок
- дизайн платформы GetCourse
- оформление социальных сетей
- создание шаблонов для постов и сторис
- креативы для рекламы
- аватарки для чатов
Результат
- Сайт попал в подборку лучших сайтов на Тильде #madeontilda
- Конверсия сайта выросла с 3% до 7%
- Полученный опыт и навыки:
- работа в команде
- ведение компании и поддержка визуального стиля
Обратная связь
“
Пришел с запросом по созданию сайта для своего проекта. Был приятно удивлен четкостью и прозрачностью всех процессов разработки. Результатом оказался очень доволен. Поэтому потом пришел со втором проектом. Сейчас продолжаем сотрудничать в формате дизайн-сопровождения. Все четко, быстро, без потери качества.
“
Сильные стороны: открытость к обсуждению задачи, гибкий подход, отличное знание Tilda и Figma, понимание концепции и основ дизайна. Нравится в работе: оперативность, качество результата, понимание задач и их деталей (включая правильные уточнения для достижения лучшего результата), позитивное общение и шутки)
Посмотрите другие проекты