Party с родителями: креативный промосайт для алкогольного завода NIVA со 100% выполнением ТЗ

Когда наш UI-дизайнер под бой курантов судорожно взбалтывал, но не смешивал пепел с шампанским и мечтательно шептал «Сайт для известного алкогольного бренда», он даже не догадывался, куда приведет этот запрос во Вселенную. Но! Кто не рискует – тот игристое не употребляет.

Заказчик – лидер рынка, крупнейший в России ликеро-водочный завод NIVA. Команда выпускает на рынок новый продукт для дерзкого импортозамещения ушедших мировых брендов – линейку уникальных ликеров из 18 вкусов для сегмента HoReCa и домашнего бара. Мощная презентация требует не просто промосайт, но громкого релиза сочного «барного меню»: ощущение бокала в руке, приятное покалывание на кончике языка и настоящий взрыв вкуса, задевающий осколками конкурентов.

Сформировать незабываемый визуальный образ алкогольного продукта в онлайне? Звучит интригующе! На низком старте рвемся в бой, но есть нюанс: фантомный пинтерест в голове заказчика, который с безупречной точностью должен быть перенесен в реальность.

Итак, заказ. Минималистичный и яркий промосайт с качественными реалистичными иллюстрациями, который воздействует на все органы чувств от зрения до обоняния, тем самым создавая прочную эмоциональную связь с брендом. Сайт должен за доли секунд переносить на гламурную тусовку и позволять:

Ингредиенты взрывного диджитал продукта:

1. Команда Ninen – зумеры. Устраивают громкую вечеринку с амбициями взорвать все светские Telegram-каналы.

2. Заказчик – ответственный родитель. Контролирует каждый шаг и хочет «как лучше».

Как при таких вводных создать идеальный коктейль из креативного диджитал продукта, строгих требований и рефов? Открывайте заметки и записывайте рецепт!

Нашему PMу не нужно входить в ресурсное состояние и пить кофе с корицей по четвергам, чтобы сходу разбить задачу на этапы и выдать ЦЭУ каждому специалисту с точными граммовками дедлайнами. Принимать литры правок, параллелить заказы процессы, поддерживать скорость работы команды и контролировать кассовые операции помогает не кофе, а безупречные hard и soft skills, замиксованные с внутренней системой менеджмента, основанной на Ninen-инструментах и методологии проверки результата. Think about it.

Стабильная эмоциональная связь пользователя с образом бренда формируется не только благодаря запоминающемуся визуальному характеру, но и за счет интеграции в процесс разработки маркетинг-майнд подхода с data-driven технологиями. Поэтому первым за барной стойкой экспериментирует маркетолог. В лучших бартендер-традициях, мы тонко комбинируем эмпирические и экспериментальные маркетинговые тулы, чтобы достичь идеального соприкосновения бренда с клиентом и его психологическими триггерами и создать у юзера ощущение доверительного «общения» с сайтом one to one.

В поисках понимания отправляемся на завод: общаемся с сотрудниками, наблюдаем за процессом производства – от выбора сырья до розлива по бутылкам, дегустируем ликеры (исключительно в профессиональных целях!)

Чтобы создать новый напиток, нужно понимать, что в коктейльной карте у топов индустрии. Скрупулезно анализируем сайты прямых и косвенных конкурентов: офферы, позиционирование, структура, лингвистические и стилистические фишки. Формируем подробную Mind Map c проверенными рецептами и новаторскими идеями.

Исследуем ЦА. Неплохой Лонг-Айленд могут смешать везде, а вот создать нужный гостям вайб – искусство. Изучаем соцсети, пишем комменты, общаемся с топовыми барменами и частыми гостями модных тусовок, чтобы собрать боли и возражения. Оказываемся в закрытых списках лучших вечеринок города (да, у нашего маркетолога есть связи на все случаи жизни), растворяемся в энергетике, становимся частью ядра ЦА и начинаем мыслить как они.

В шейкер отправляются:

Маркетинговая стратегия готова! Пробуем. Отличная база, которой самое время добавить пикантности.

Можно мне Кровавую Мэри без томатного сока, пожалуйста? Примерно так копирайтер воспринимает ТЗ «Яркий промосайт с минимумом текста». Вспоминаем вечное «Если судьба преподносит тебе лимон, сделай из него лимонад», и заставляем любые ограничения работать на себя. Идеально выверенные фразы без букв ради букв, незамутненное послевкусие каждого предложения – отличная отстройка от конкурентов.

Ну и какая домашняя вечеринка без приготовления коктейлей by yourself? Проектируем отдельный блок и простые фильтры для экспериментов с ликерами NIVA. Спойлер: блок имеет самый высокий коэффициент вовлеченности без просадок. А интеграция сайта с CMS – чит-код для регулярного обновления коктейльных сетов в несколько кликов и реального повода добавить сайт в закладки.

Вы собираетесь на вечеринку, а мама говорит, что в этой футболке из дома не выпустит. Знакомо? Примерно такие юношеские флэшбэки ловил наш UI-боец, пока работал над визуалом.

Чтобы однозначно отстроиться от визуальных образов конкурентов и получить реальное представление о ситуации на рынке, выполняем полноценное UI-исследование: под лупой рассматриваем все стилистические приемы конкурентов, изучаем ЦА с точки зрения визуальных предпочтений и пользовательского опыта, определяем вектор. Но не забываем, что у заказчика есть картинки в голове, как должно быть. Пытаемся приблизиться к воображаемому референсу – выходит не то.

Не отчаиваемся и приступаем к разработке 6 подробных мудбордов с принципиально разными стилеобразующими элементами, стилистическими приемами и настроением. Подключаем к работе лид-дизайнера, проводим многочасовые дискуссии в зуме, учитываем позицию заказчика, приводим результаты аналитики и подкрепленные данными аргументы и… Cheers! Ловим общий вайб и начинаем разговаривать с заказчиком на одном визуальном языке.

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

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

Заказчик выбирает концепцию, на смену Мохито приходит Пина Колада, и дизайнер берется… нет, не за кисти, а за изучение законодательства. Тематика 18+, есть ограничения по визуалу: например, изображения людей, употребляющих алкоголь, (да даже просто руки с эстетичными бокалами) на сайтах алкогольных брендов строго запрещены. Внимательно изучаем статьи закона и консультируемся с юристами, чтобы учесть все нюансы и случайно не отправить сайт в блок.

Вспоминаем ТЗ: яркий промосайт с сочными иллюстрациями. Но где взять эффектные фото, достойные визуальной концепции в голове? Наш дизайнер оказывается счастливым исключением из правил, которому выдают полный карт-бланш на создание кастомного контента! Результат говорит сам за себя: картинки пьянят, погружают в атмосферу вечеринки, заставляют активно работать все органы чувств. Насыщенные цвета инстинктивно воздействуют на вкусовые рецепторы и создают тот самый взрыв вкуса во рту. Для точечного воздействия на психологические триггеры и усиления продуктового отклика — внедрили экологичные маркетинговые инструменты.

Отрисовываем второстепенные элементы в общей стилистике сайта: модальные окна, фавикон, виджет, поп-ап, скрытые блоки, UI-кит. Тестим UX на потенциальных пользователях, чтобы убедиться: даже на утро после вечеринки разобраться с фильтрами и найти нужные коктейли можно на изи. Завариваем кофе с корицей (дизайнер в этом смысле не солидарен с PMом) и готовим ТЗ на верстку: логика, анимация всех элементов, скрытые тексты, дополнительные требования и адаптивная версия первого экрана.

Финишная прямая! Верстальщик приступает к работе в лучших традициях Pixel Perfect. И тут новый вызов: дизайнер отстаивает каждый пиксель роскошных Full HD картинок, а верстальщик топит за производительность. Не поддаемся на провокации и держим тонкий баланс между визуальными и техническими требованиями. Добиваемся идеального качества изображений, сохраняем все цвета и оттенки, а сайт все равно летает! У верстальщика дергается глаз, но оно того стоило.

В это время PM уже ставит задачку на тест. Проводим комплексное QA QC тестирование на разных устройствах и разрешениях экранов с учетом пользовательского опыта ЦА, и обязательно в браузерах последних версий. Проверяем соответствие анимации и функциональности всех элементов подготовленному ТЗ, замеряем скорость загрузки, оптимизируем скрипты и изображения.

На несколько часов сами становимся адептами home parties и тестим сайт как ядро ЦА. Тестировщик оформляет заказ на сайте, а дизайнер играет с фильтрами, чтобы составить идеальную коктейльную карту для вечеринки в субботу. PM довольно качает ножкой и создает таск «Интеграция сайта с CMS».

Разрабатываем архитектуру и компоненты проекта, выполняем интеграцию блоков верстки с CMS, создаем и подключаем функциональные шаблоны и модули. Выполняем базовое тестирование. Готовим понятный гайд, чтобы вносить правки было не сложнее, чем завернуть в спираль цедру лимона для Веспера.

Презентуем результат. Вместо головной боли от правок и игры со шрифтами – приятное послевкусие от выполнения каждого поинта по ТЗ и искренний восторг заказчика. Несмотря на все ограничения, нам удалось создать небанальный и сочный промосайт, задействующий все органы чувств. Enjoy!