Студия лазерной эпиляции - LaserStudio

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

Наша задача исследовать ца и понять мотивы, проанализировать конкурентов и сделать посадочную страницу, которая позволит привлекать клиентов.

Мы проанализировали рынок, изучили текущих конкурентов и разработали структуру посадочной страницы.

Разработали дизайн и качественно сверстали с анамацией появления блоков.

Настроили формы и готовимся к продвижению.

Для начала мы устроили брифинг и поняли реальные задачи клиента и его осведомленность в нише.

Провели базовое исследование по выделению сегментов ЦА, получили несколько сегментов Ж и несколько сегментов М.

Инсайт: К нашему удивлению местные студии не работают с мужчинами(М). Хотя спрос на услуги есть. 

Изучили как себя позиционируют конкуренты. Сделали несколько тайных покупателей и выявили сильные и слабые стороны.

На основе этой информации мы проработали структуру посадочной страницы.

Сделали сайт удобным для каждого из устройств.

Проработали уникальную стилистику. Спасибо производителю оборудования за качественные фото с моделями.

Особенности верстки:

Верстка была выполнена на стеке: webpack, scss, handlebars. Так-же использовался BEM, с организацией файловой структуры.

handlebars — это шаблонизатор для html

scss — это препроцессор для css

BEM — это компонентный подход к веб-разработке.

webpack — это сборщик модулей JavaScript с открытым исходным кодом, который настроен в данном проекте на сборку handlebars, scss, js

Связка handlebars + scss + BEM - позволяет создавать компоненты такого вида: header.hbs + header.scss. И подключать их на страницу в виде: {{>header}}. Что упрощает читаемость и качество html.

Так как все BEM блоки вынесены в отдельные файлы (Компоненты), то при изменении компонента он сразу меняется по всему проекту.

С этим сайтом мы получили несколько наград на международных премиях и конкурсах:

Awwwards - почетное упоминание

Awwwards - мобильное совершенство

CSSWiner - сайт дня

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