True Water: лендинг продукта от NL International

Ситуация

В 2020 году NL International выпустили на рынок новый продукт — портативную систему очистки и регуляции питьевой воды РН Balance Stones True Water. Продукт представляет собой спортивную бутылку с интегрированным минеральным картриджем. Он позволяет воссоздать естественный механизм обогащения воды горными минералами.

На момент обращения к нашей команде NL International уже разработали образ продукта, провели качественную фотосъемку, сформулировали тезисы для продвижения. Для полноценного запуска продукту не хватало запоминающейся промо-страницы.

Бизнес-требования

Рассказать про ценности и свойства продукта

Вызвать эмоциональный отклик визуальными решениями и анимацией

Сохранить узнаваемую стилистику продуктов NL International

Улучшить предложенную структуру для большего конверсионного потенциала

Решение

На старте проекта команда NL International предложила нам детальную структуру лендинга. Мы взяли ее как основу и предложили несколько интересных решений:

• – сочетать статичные элементы с динамичными фонами;
• – добавить реалистичную анимацию, имитирующую потоки воды;
• – смягчить яркие элементы айдентики нейтральными природными цветами;
• – сохранить приоритет чистого пространства.

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

Проектирование и дизайн

Проектирование лендинга было быстрым и живым. В процессе мы вместе с командой NL International переделывали, дорабатывали и адаптировали отдельные элементы, чтобы добиться лучшего результата.

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

При скроллинге меняется только цвет продукта. Он соотносится с определенной группой целевой аудитории и повторяет цвета на фото и в заголовках.

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

Раскрывая преимущества продукта, мы вынесли на блок краткие тезисы, а более подробное описание к каждому из них разместили во всплывающих окнах.

Добавили интерактивные блоки с объемными изображениями камней и капель воды. При скроллинге они уменьшаются и увеличиваются в размерах, меняют положение относительно соседних блоков и заголовков.

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

Для демонстрации механизма использования системы РН Balance Stones True Water лучшим решением было добавить блок с встроенным видео с канала NL International на YouTube.

Упрощенную инструкцию по применению дополнили инфографикой, стилизованной под элементы айдентики продукта. Добавили кнопку для перехода на канал с видеоинструкциями.

В структуру лендинга мы встроили несколько возможных сценариев перехода к заказу:

на первых баннерах — для тех, кто уже имеет представление о продукте и готов к покупке;

после описания свойств и выгод — для тех, кому для принятия решения требуется больше информации;

на заключительном баннере — для тех, кто интуитивно ищет кнопку «Заказать» в самом конце.

Мобильный интерфейс

В этом проекте было важно не перегрузить мобильную версию анимацией. Поэтому от части приемов, использованных в веб-версии, было решено отказаться. Для удобства навигации основные разделы лендинга разместили в бургер-меню.

Верстка и бэкенд

По первоначальному плану клиент был намерен выполнить с нами только проектирование и дизайн. В процессе было решено продолжить разработку с нами.

Результаты

Мы выдержали баланс креативной подачи и наглядного промо. Лендинг True Water интересно исследовать, спецэффекты не отвлекают от сути, продающая воронка работает.

от 250 000 руб.

бюджет подобного проекта

от 1,5 месяцев

срок разработки

Стек технологий

Язык, фреймворк

PHP 7.4

Bitrix

СУБД

MySQL