Скольжения нет, а повышение конверсии есть! Сайт для производителя состава против скольжения

ЗаказчикПредставительство федеральной компании по производству и продаже противоскользящих покрытий «Скольжения нет«ЗадачаДонесение информации о продукте до потребителя через интернет, достижение максимальной конверсии на сайте

Плитка, особенно мокрая — источник опасности. На скользкой поверхности легко потерять равновесие, упасть и даже повредить себе что-то. Но этот материал прочный, износостойкий и эстетичный. Его используют на тротуарах, в интерьере и в экстерьере. Общественные и производственные помещения, ванная и коридоры — плитку можно встретить везде. Спрос на материал растет с каждым годом. Особенно, если его регулярно перекладывать!

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

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

Компания, которая производит такое средство, обратилась к нам. Они пришли за сайтом с уникальным дизайном для узнаваемости и увеличения количества заказов.  

Что было сделано?

  1. Дизайн
  2. Разработка
  3. Поддержка 

1) Дизайн

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

Желтый символизирует опасность, он используется в предупреждающих знаках. Это один из фирменных цветов компании «Скольжения.нет». Он самый яркий из существующих и отлично привлекает внимание. Восприятие цвета совпадает с тем, чем занимается компания. 

b21ceed3ffbe6feaa6e73b68670f1491.png

Для дизайна сайта логично бы было использовать как раз эти 2 цвета. Но по такому пути уже пошли другие компании с аналогичными товарами. Чтобы повысить узнаваемость, мы добавили серый, красный и бирюзовый. Серый цвет — ахромат. Как и белый, он сочетается со всеми другими цветами. Серый успокаивает и оттеняет желтый. Это сочетание настолько гармонично, что институт Pantone выбрал серый и желтый цветами 2021 года. На сайте мы использовали серые подложки для спецпредложений: акции и бестселлеры. Красным выделили кнопки и акцию с счетчиком. Этот цвет привлекает внимание и побуждает к действию. 

f06e8341e2227db381f0dc754b110379.png

Использовали бирюзовый. Это нестандартное решение для выделения на фоне конкурентов. Бирюзовым сделали фон главного экрана, текст и кнопки для перехода в разделы «Отзывы» и «Статьи». Этот цвет означает баланс и доверие, приносит гармонию. Он подчеркивает оптимистичность и энергию желтого, хорошо смотрится на белом фоне. Логотип адаптировали под веб-дизайн для просмотра с разных устройств. Уникальный продающий дизайн демонстрирует преимущества и особенности продукта. 

6eb23441861d6eaa10bd4564db27f900.png3f5cabcd9ec7d6aa5a0c42b0e30f9ec2.png  

2) Разработка 

Собрали проект сайта. На первый взгляд он похож на одностраничник, но на деле это полноценный сайт. Он состоит из разделов «О компании», «Акции», «Каталог», «Блог», «Контакты». На первом экране поместили информацию об акции с счетчиком. На «подумать» клиенту дается 1 день. Ограничение времени хорошо работает, так как побуждает принять решение быстро. Здесь же находится форма обратной связи для заказа. Пришел, увидел и купил. 

1e382064ebe332dd2ae22336ca5c6241.png

На следующем экране разместили частые вопросы и преимущества. Раздел выгодно представляет товар и снимает возражения клиента. Информацию о доставке в любой регион России поместили сюда же. Сократили путь клиента вместо того, чтобы посылать его на поиски информации в другом месте. Поэтому сразу под ответами на вопросы есть кнопка заказа. Она сделана желтой и выделяется на белом фоне.

ab4ef1c246b170b1b9a3e3d5a8361dfe.png

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

ce24cadb41952c0ae4bc88e6269d5997.png

Ниже расположен экран с social proof — отзывами покупателей. С отзывами указали имена авторов с фото и название компаний, для которых они заказывали состав. Если пользователь нажимает кнопку «Смотреть всех клиентов», то переходит в раздел с клиентами. В нем длинный список из известных компаний, которые пользуются составом. Это повышает доверие посетителей сайта, дает чувство причастности к популярным брендам. 

4af2ca1a75d5333e2f6822b00435c815.png

Следующий экран — «Лучшие предложения из каталога». Помимо специального состава от скольжения компания продает и другие изделия. Они тоже выполняют функцию защиты от скольжения. Это ковровые покрытия, алюминиевые уголки и другое. Товары показаны в виде слайдера с фото с красной кнопкой «Заказать». Красный цвет привлекает внимание и побуждает к действию. Рядом с кнопкой заказа есть менее заметная, но тоже важная — «Узнать больше». Крупная красная кнопка «Смотреть весь каталог» убедительно приглашает перейти в соответствующий раздел. В нем посетитель видит то, за чем пришел. Ассортимент средств от скольжения настолько большой, что содержит даже спрей против скольжения лап для домашних животных. Из каталога можно перейти в карточки товаров с фото, описанием и стоимостью. В описании товаров представлены все выгоды и цены. Если стоимость зависит от объема, приведена таблица ее расчета. 

00659adcea93a351d8b2fc7fdc7cea82.png

3dcddb0659d6cf0f5b1843bf7d007d5e.png

18fb7b43d602f7e7db833520900dbb25.png

Ниже экран с информацией о монтаже противоскользящих покрытий. Желтый блок выделяется на фоне серого и белого. Кнопка заказа крупная и красная, она заметна на желтом фоне. Услугу монтажа предоставляют не все компании, поэтому при заказе у конкурентов клиенту пришлось бы вести поиски самостоятельно. Монтаж от продавца — самый простой и удобный вариант. Специалисты фирмы знают особенности своей продукции и все тонкости работы с ней. 

2497d834f2dc709d0da82b319a31aaf5.png

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

d933f9d6358138623ed187d9f88d894c.png

Внизу указаны контакты с картой и чат-бот. Разные способы связи охватывают клиентов с разными привычками и предпочтениями. Люди постарше, например, предпочитают звонить. Поколение миллениалов (1982–2004 г.р.) выбирает переписку, так как 75% из них считают телефонные разговоры пустой тратой времени. А 81% испытывает тревогу, кода нужно кому-то позвонить (данные исследования Bankmycall). Зато они с легкостью напишут в чат-бот, который увидят сразу. Его видно сразу, так как окошко для сообщений красного цвета. 

496ab0c7fbc1667bfa05b733bda13442.png

3) Поддержка 

После запуска провели мониторинг поведения посетителей. На его основе внесли изменения на сайте. Делали крупнее кнопки, которые пропускались посетителями. Мигающие кнопки и меняющиеся цифры на счетчике привлекают внимание пользователей и уменьшают количество отказов.   

338c4332b622da876bd307673e3eeb03.gif 

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

6f8f59bd9c4fae590e34f190b143fd40.png

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

В дополнение к сайту разработали обложку для группы ВКонтакте. Качественно сделанная уникальная обложка запоминается и выделяет сообщество среди конкурентов. Она выполнена в едином стиле с сайтом. Это позволяет намного быстрее создать узнаваемость компании. К тому же визуальный образ убеждает эффективнее любых других способов.    

1d17f5ebc07cbfefbbae409699230232.png

Эти меры позволили улучшить поведенческий фактор. Поэтому мы смогли уменьшить количество отказов и достичь максимальной конверсии.   

Чего достигли?

  • На 16% уменьшение процента отказов
  • В 2,3 раза увеличение конверсии
  • Увеличение средней продолжительности визита и вовлечённости пользователей
  • Универсальное представление продукта, расширяющее целевую аудиторию (прежний сайт был узконаправленным)
  • Быстрое реагирование на поведение пользователей сайта существенно увеличивает процент конверсии
  • Изменение оформления во время официальных праздников для увеличения лояльности аудитории

Перейти на сайт

Полный текст статьи читайте на CMS Magazine