Кейс компании WeJET по клиенту Продуктовые лендинги для премиальных БАД от МираксБиоФарма
Продуктовые лендинги для «МираксБиоФарма»
О клиенте МираксБиоФарма
Задача
Ситуация на старте
Ранее мы успешно сотрудничали с МБФ по другим проектам. Клиент захотел вернуться. На этот раз компания заказала два отдельных решения для премиального и массового клиентского сегмента биодобавок.
МираксБиоФарма пришли с детальными брифами по продуктовым линейкам, описанием целевой аудитории и готовыми текстами для лендингов. Отдельно они прислали визуальные референсы с чётким разбором, какие элементы нравятся и почему: тип композиции, характер анимаций, плотность текста, стиль иллюстраций. Редкий случай, когда заказчик принёс полноценный анализ ожиданий.
Обе линейки относятся к категории БАДов и позиционируются как научно обоснованные продукты. Это наложило требования к дизайну и UX: отсутствие агрессивного визуала, точная работа с цветом, медицинский характер оформления и строгий верифицируемый контент. Для фармпродуктов важны корректность информации, аккуратный стиль и отсутствие элементов, которые вызывают ассоциации с псевдонаукой.
Два лендинга должны сохранять фирменный стиль компании и обеспечивать единое восприятие бренда.
В первую очередь, важно было учесть разный ценовой сегмент, аудиторию и сохранить единое представление бренда. Сроки работы были ограничены — у нас ушло не более 3 недель на каждый лендинг с минимальным объемом правок.
Два продукта — две аудиторииединый визуальный язык бренда
Что нужно было сделать
Бренд ЭнтернаВита
- создать сдержанный премиальный дизайн для аудитории с доходом 500 000+;
- передать научную строгость и премиальную эстетику, избегая визуальных приёмов, ассоциирующихся с псевдонаучными проектами;
- подчеркнуть цену и статус продукта без агрессивных маркетинговых элементов.
Бренд Фитоавиа
- сохранить общее визуальное оформление, адаптировав стиль лендинга под более широкую аудиторию;
- передать ощущение медицинской экспертности;
- сделать подачу информации о продукте дружелюбной и лёгкой.
Технические требования
- разработать две версии каждого лендинга: полноценную — с магазином, оформлением через менеджера, информационную — для рекламы;
- обеспечить адаптивы на все типы экранов;
- уложиться в сроки без потери качества и с минимальными правками.
Похожая задача стоит и перед вашей компанией?
Расскажите о проекте — предложим решение, опираясь на наш опыт и реализованные кейсы
От концепции к запускудизайн и разработка двух продуктовых лендингов
Что сделали мы на подготовительном этапе
- переработали нарративы под структуру лендингов: ввели логику прохождения пользователя от смысла к действию;
- собрали схему блоков для ЦА, сохранив стиль бренда;
- трансформировали требования из брифов и референсов в чистый дизайн — минимализм, читаемость, экспертность.
Дизайн ЭнтернаВита
Продукт Энтеравита предназначен для сегмента, в котором пользователь привык платить за качество. Это аудитория с доходом 500000 +, премиальные путешественники, люди, покупающие дорогое медицинское сопровождение. Такой пользователь не реагирует на “яркие фантики”, а считывает серьёзность бренда по сдержанности и чистоте подачи. Дизайн продукта строился вокруг смыслов и чистоты исполнения.
Как мы работали с референсами
Клиент предоставил набор референсов и объяснил, что ему нравится. Композиция, глубина цвета, характер графики, степень научности. Мы выделили для себя общие принципы и перенесли их в собственную дизайн-систему, сохранив стиль бренда.
Что использовали:
- сдержанную цветовую гамму, передающую элитарность;
- акцент на контенте – легко читается, нет перегруженности графикой;
- минимализм в графике, как отсутствие ощущения стокового визуала;
- лаконичное меню с ключевыми разделами, чтобы не перегружать пользователя;
- интерактивные элементы и минимум анимаций для фокуса аудитории на главном.
Интерактивная схема
На лендинге разместили ключевой интерактив — схема “Механизмы действия компонентов ЭнтернаВиты”.
При наведении пользователь получает объяснение, как работает каждый элемент формулы. Это усиливает эффект экспертности: продукт выглядит не абстрактной таблеткой от всего, а научно обоснованным решением.
Дизайн Фитоавиа
Фитоавиа — продуктовая линейка, ориентированная на массовую аудиторию путешественников и людей, которые часто летают. Отсюда, возникает меньше премиального дистанцирования, и больше человечности в подаче.
Мы сохранили стиль ЭнтернаВита, чтобы продукты воспринимались как часть одной экосистемы клиента. На лендинг перенесли родственные блоки: «О компании», «Где купить». Также добавили научную секцию, фирменную типографику и общие композиционные решения. Это поддерживает узнаваемость и формирует единый язык бренда.
Дизайн стал мягче и ближе к неискушенному пользователю. Убрали выраженный “лабораторный” характер и сделали акценты дружелюбнее. Использовали более светлые оттенки, спокойные графические элементы, лёгкую ритмику блоков. Сохранили медицинскую аккуратность в подаче, но без чрезмерной строгости.
Ключевой UX-приём: динамический первый экран
Главный экран Фитоавиа удивляет пользователей, реагируя на время суток: изображение и подпись меняются автоматически. Утро, день, вечер или ночь — на каждом слоте своя фотография и микро-сообщение про разные уголки мира. До 4 вариантов на одно время. Это делает бренд ближе к миру целевой аудитории, показывает ей: я свой. И просто привлекает внимание к главной.
Пользователь может обновлять страницу и видеть разные состояния. Идея принадлежала клиенту, но техническую реализацию на Tilda выполнила наша команда. Результатом довольны все. :)
Мы совместили преемственность линейки с более доступным и лёгким пользовательским опытом.
Два разных лендинга — единая системаразная подача для разных сегментов аудитории
Реализация
Оба лендинга реализованы в no-code подходе: вся логика и визуал собраны на Tilda. Около 90% макетов выполнены на Zero Block.
Это удобно для нас и клиента:
- Zero Block дают свободу композиции и позволяют передать стилистику;
- Работа дороже и сложнее, чем сборка на шаблонных секциях, а результат выглядит на порядок аккуратнее;
- Лендинг перестаёт быть шаблонным и превращается в кастомный продукт.
Баланс ноукода и точечных доработок позволяет быстро запускать новые страницы при индивидуальном дизайне. Команда МБФ может самостоятельно обновлять контент, запускать акции и вносить изменения без привлечения программистов.
Технические решения
Для лёгких доработок интерфейса и динамического контента мы использовали кастомный код. Например, для смены изображений в зависимости от времени суток. В остальном логику реализовали средствами Tilda.
Оба сайта адаптивны: корректно отображаются на всех устройствах. Сетка и Zero Blocks были собраны вручную, без зависимости от шаблонов, что обеспечило предсказуемое поведение макета.
По запросу клиента мы разработали по две версии под каждый продукт:
- Основная — можно оформить заказ через менеджера (мини-магазин).
- Информационная — используется для продвижения, PR и рекламы.
Обе версии утверждены заказчиком и применяются параллельно.
Сроки и процесс
Разработка заняла около 3 недель.
Дизайн приняли почти с первой итерации:
- визуальных правок почти не было;
- корректировки касались фото и небольших технических деталей;
- запуск прошёл без задержек.
Быстрые сроки и минимальное число правок — это следствие чётких брифов со стороны клиента и точного попадания дизайнера в стилистику.
Разработка мокапов для упаковки
После запуска лендингов клиент вернулся с дополнительным запросом. Мы сделали мокапы для упаковки.
Дизайнеры WeJET подготовили 3D-мокапы упаковок для продуктов. У клиента были варианты, но они недостаточно отражали суть брендов. Мы создали новые мокапы, визуально выровняв их под стиль лендингов.
По просьбе клиента также разработали две презентации для ЭнтернаВита и Фитоавиа. Они оформлены в той же визуальной системе, что и сайты: аккуратная типографика, цветовые акценты, структурированная подача. Это визуально объединило представление брендов в рекламе, в презентациях партнерам и в продажах. Также усилило единый брендовый образ линеек.
Профессиональная
оценка проекта
- Интервью с ключевыми сотрудниками
- Составление карты бизнес-процессов «как есть»
- Диагностику текущих бизнес-процессов и ИТ систем
- Составление карты бизнес-процессов «как должно быть»
Получите бесплатную оценку от нашего эксперта
от дизайн-концепциидо реализации на Tilda
Результат
Индивидуальный подход к продвижению каждого продукта
Проект закрыл потребности клиента по двум ключевым направлениям: запуск лендингов и формирование визуальной системы для продуктовой линейки.
Оба лендинга приняты без существенных правок и используются в маркетинге. Разработаны 3D-мокапы упаковок и презентации для коммерческого использования.
Для линейки продуктов создан узнаваемый визуальный язык. Его легко масштабировать на будущие релизы: структура, типографика, цветовые решения и уровень минимализма как стандарт. Это ускоряет разработку сайтов и маркетинговых материалов.
Для ЭнтернаВита получился сдержанный премиальный лендинг. Он транслирует стоимость и серьёзность продукта через аккуратный дизайн, интерактивную схему и научное позиционирование.
Для Фитоавиа создан человечный и простой лендинг, но также экспертный. Динамический первый экран усилил вовлечённость и стал заметным UX-элементом.
В результате команда WeJET создала для клиента два отдельных сайта с единой логикой, которую можно воспроизводить для других линеек.
Остались
вопросы?
Погрузимся в вашу задачу, подберем формат работы и сделаем расчет стоимости.