Всем привет! Это веб-дизайнер Алина. Я разрабатываю не просто сайты, а инструменты бизнеса. И сегодня хочу рассказать, как я раскрыла смысл тренировок «между делом» в своём лендинге.
О проекте
Ко мне обратился тренер по пилатесу и постуральной гимнастике. Он создаёт и продвигает свои онлайн продукты. И один из них — онлайн-клуб тренировок для здоровья «Выпрямись!».
Идея клуба в том, что там есть как полноценные курсы и интенсивы (по 20-30 минут), так и короткие микро- и минитренировки (по 1,5-5 минут). Эти тренировки — авторская разработка заказчика, чтобы люди внедряли активность в повседневную жизнь и начинали тренироваться с малого.
Задача
Создать лендинг с ключевым действием — продажа абонементов в клуб. А также подключить оплату и рассылку доступа к личному кабинету на почту. Трафик на сайт будет идти с инстаграма, поэтому аудитория заочно знакома с продуктом. Также из-за этого нужно уделить большое внимание мобильной версии сайта.
Что было сделано?
- Анализ сайтов конкурентов;
- Анализ целевой аудитории через подписчиков в инстаграме;
- Написание текстов, так как у заказчика их не было;
- Разработка текстового прототипа;
- Создание уникальной дизайн-концепции;
- Вёрстка на Тильде и адаптация для мобильных устройств.
Аналитика
Я проанализировала другие сайты с онлайн-тренировками, посмотрела, какие тезисы они используют, какая структура сайтов, какие есть блоки. С сайтов конкурентов мы взяли себе некоторые идеи.
Далее я проанализировала целевую аудиторию: читала, что отмечают в отзывах и комментариях в инстаграме, за что благодарят, какие боли решают тренировки у людей, чтобы сделать на этом акцент на сайте. А также заходила на страницы людей в соц сетях и составляла портреты ЦА.
В ходе анализа аудитории было выявлено, что основная проблема людей — отсутствие времени на полноценные тренировки. В эту категорию входят люди с детьми или плотным графиком. Поэтому нужно было сделать большой акцент на том, что есть короткие тренировки. Но клуб также даёт возможность и полноценно заниматься, поэтому нужно было очень аккуратно балансировать между двумя этими крайностями, чтобы охватить всех.
Поэтому я сделала несколько блоков с разделением ЦА по потребностям
Тексты и прототип
На основе интервью с заказчиком и результатов аналитики я написала текст для сайта, так как у заказчика его не было. В тексте я сделала акцент на информативных заголовках, так как статистика показывает, что люди пролистывают весь контент, читая только заголовки. Поэтому моей задачей было — передать в заголовках все основные смыслы клуба, чтобы пользователь их уловил.
На основе текстов я составила структуру и прототип сайта:
Концепция
На брифинге мы с заказчиком обсудили, что важно передать на сайте:
- Подробно раскрыть принцип клуба, что есть как полноценные тренировки, так и короткие;
- Сделать сайт интуитивно понятным, так как ЦА в основном возрастная;
- вызвать ощущение заботы.
Дизайн
Основные пожелания заказчика:
Сайт должен быть дружелюбным, вызывать ощущение заботы. Предпочтительная цветовая гамма: синий, розовый, зелёный. Нравится интерфейсный стиль, плашки и крупные заголовки.
Цветовую гамму я оставила такую же как в пожеланиях заказчика, потому что синий цвет — фирменный и используется в логотипе, а розовый и зелёный его дополняют. При этом это не заезженное и достаточно нестандартное и смелое цветовое решение. Само сочетание достаточно сложное, поэтому нужно было подобрать подходящие оттенки.
Также я подобрала широкий и низкий шрифт, чтобы стиль был более неформальный, а также использовала выделение слов в заголовках, чтобы выделить ключевые слова.
Главная страница
Сайт не подразумевает большое использование фотографий, поэтому нужно было сделать дизайн, основываясь на типографике и графических элементах. Я выбрала популярный стиль с плашками, так как закруглённые края выглядят дружелюбно, сами плашки создают дополнительный объём на странице и добавляют порядка в элементы. Также плашки отсылают нас к интерфейсу приложений, что также подходит нам, потому что продукт — это онлайн-тренировки.
Также на сайте есть интерактивные элементы. Сайт получился большой, поэтому нужно заставить пользователя остаться на нём. Для этого мы предлагаем ему повзаимодействовать с контентом: выбрать уровень занятости, перевернуть карточки и прочитать их, нажать на проблемные зоны человечка. Для всех этих интерактивных элементов я использовала рукописные подсказки, которые позволяют пользователю понять, что именно нужно сделать, а также передают неформальное настроение, как будто с тобой общаются форматом письма.
Награды
Отзыв
Заказчик очень доволен результатом
Сайт можно посмотреть по ссылке: https://club.dimafivex.ru/ (сайт редактируется заказчиком, возможно изменение исходного дизайна)
Спасибо за просмотр!
Буду рада создать для вас уникальный проект. Напишите мне, если хотите заказать сайт.
