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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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