Запустили сайт и рекламу для производителя спецкрепежа

Краткое описание проекта

Реализовали амбициозную задачу
Помогли производителю нестандартного крепежа сегментировать бизнес и запустили успешные рекламные кампании в интернете, чтобы привлечь клиентов

Придумали понятную навигацию

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

О проекте

Сплав78 — масштабный проект в миниатюре сайта.  Заказчик — поставщик и производитель специального крепежа.

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

Клиентам заказчика нужны метизы, но заказать сложно: крупные производства работают теперь с оборонным комплексом, другие — изготавливают крепёж слишком долго, а поставки из-за рубежа прекратились.

Мы провели экспертное интервью, углубились в исследование рынка и выяснили:

• заказчик хочет как можно быстрее выйти на рынок как отечественный производитель нестандартного спецкрепежа по индивидуальным чертежам
• клиент заказчика — менеджер производственной компании. У него есть чёткие сроки и чертёж необходимой детали. Экономит время и хочет как можно больше конкретики от производителя, к которому готов обратиться.

Задача: отразить экспертность производителя через простой и понятный дизайн и с помощью активных рекламных кампаний привлечь клиентов

Структура сайта

По результатам исследования рынка решили сделать сайт с акцентом на навигацию. Каждый блок несёт ценность для клиента и решает задачи заказчика.

В «шапке» сайта разместили все самое необходимое для пользователя: номер телефона для связи и кнопку оформления заявки. Крупно отразили электронный адрес и продублировали его в других блоках, потому что узнали — в этой нише рынка 90% заявок приходят через email. Спасибо исследованиям, которые мы проводим прежде, чем приступить к разработке.

На первом экране сразу обозначили сроки изготовления, показали, что производим изделия как по точным чертежам, так и по наброскам, и указали возможные размеры изготавливаемых деталей — это то, что чаще всего волнует клиента. Заголовок крупный, формулировка простая и понятная. Фоновой иллюстрацией создали визуальную ассоциацию с процессом производства метизов.

Блок «Изделия» — важный структурный элемент сайта. В нем мы говорим об уникальности продукции производителя и делаем акцент на том, что она изготавливается под запрос клиента.

Также разместили примеры чертежей и рассказали о подходе к изготовлению. Дали полную информацию по видам металла и включили визуальный ряд — фотографии с производства и примеры изделий. Это про доверие, про прозрачность подхода и про наглядность.

Сроки изготовления очень важны для клиентов нашего заказчика. В отдельном блоке показали подход к исполнению заказов — за какой срок будет рассчитана конечная стоимость изготовления и сколько времени уйдёт на производство деталей.

Блок «Рассчитать стоимость» — это про общение клиента с компанией. Пользователь часто не готов сразу сделать заказ: он ищет лучшие условия. Тут он может описать свой запрос и продолжить коммуникацию с профессиональным менеджером. В результате мы получаем контакты потенциального клиента, а менеджеры — возможность показать экспертность компании.

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

Дизайн сайта

Каждое визуальное решение формирует доверие к компании и основывается на подтвержденных гипотезах.

На этапе анализа конкурентов отметили, что большинство сайтов тематики имеют устаревший дизайн и непродуманные интерфейсы. Зная основную аудиторию сайта, мы понимали: сложные визуальные элементы и суперсовременный дизайн не нужны — это может сбить пользователя с толку. Нам нужно было сделать аккуратно и понятно, но сильно не выделяться в креативе.

Выстроили дизайн вокруг минимализма: простые формулировки, крупные акцентные заголовки, чуть-чуть графики. Путём ассоциаций пришли к эффективному визуальному решению — «скруглить формы», чтобы компенсировать брутальность типографики и создать дружелюбный человечный дизайн.

Сделали акцент на доступности форм и средств в дизайне, поэтому подобрали два шрифтовых решения — Inter и Noto Sans — лаконичный гротеск, легко читаемый и ненавязчивый.

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

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

разработка

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

Исходя из цели запуститься в ограниченные сроки, решили использовать библиотеку ReactJS с компонентным подходом — так проще развивать сайт в будущем. 

Отправку формы обратной связи реализовали через протокол SMTP. Он отслеживает весь путь заявки — от момента отправки до доставки, — сообщает об ошибках и успешно закрытых задачах. В самих формах настроили защиту от спама и фишинга.

Для отслеживания действий посетителей сайта (да-да, мы следим за каждым) настроили JavaScript-события: копирование телефона и email, отправка формы, — и регулярно анализируем трафик, чтобы быть уверенными, что у пользователя не возникает сложностей при оформлении заявки.

Реклама

Продумали стратегию и настроили сбор статистики: установили систему аналитики и определили цели. Отслеживали все, что можно отследить. 

Рекламный кабинет:

• Чтобы запустить рекламу на поиске, через сервис Wordstat собрали ключевые слова, по которым пользователи ищут нужную им услугу. После разделили их на смысловые группы — крепёж, метизы, болты, станочные болты, спецкрепеж, гайки. Не забыли изучить рекламные кампании конкурентов в поисковой выдаче: с помощью сервиса SpyWords собрали их лучшие решения.
• В объявлениях делали акцент на изготовлении нестандартных изделий, добавили динамические заголовки, которые подстраиваются под ключевые запросы пользователя. Если пользователю нужен болт м72, то ему покажется заголовок именно с этим изделием.
• После тестовых запусков и анализа трафика оптимизировали запросы: добавили новые ключевые слова и минус фразы. Так мы исключили слово «купить», которое в большинстве рекламных кампаний приводит целевой трафик. В нашем случае оно не сработало: компания нашего заказчика — изготовитель, а клиенты по запросу «купить» ищут уже готовый товар. Да, это было не просто смело, а очень смело!

Стратегия рекламных кампаний:

• Основной клиент — сотрудник производственных компаний, поэтому ограничили время показов: только по будням, с 9 до 18.
• Сразу стали придерживаться стратегии ручных ставок. Это позволяет полностью контролировать рекламный трафик и исключает переобучение алгоритмов Яндекса при остановке рекламы.
• Разделили рекламные кампании по регионам: восточные и западные. Это дало возможность перенаправлять рекламный бюджет на кампании, которые приносят больше заказов и прибыли. Довольный заказчик, довольные мы.

10 причин успеха

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

Объясняем, почему у нас все получилось.

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

Провели большое исследование
Каждое решение принимали, опираясь на его уместность — действительно ли оно необходимо пользователю нашего сайта.

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

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

Оптимизировали скорость работы
Быстро разработали сайт благодаря выбору библиотеки ReactJS с компонентным подходом. Настроили сжатие файлов и изображений, настроили защиту от ботов и взлома. В результате — быстрый запуск сайта, высокая скорость загрузки, безопасность пользователя и заказчика.

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

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

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

Добились высокой конверсии
Средняя конверсия сайта на текущий момент — 10,6% — при очень низкой цене заявки — ниже средней по рынку. Каждый 3-й пользователь проводит на сайте дольше трёх минут.

На самом деле…
Ключевых пунктов всего 9, но мы написали 10-й, чтобы заголовок выглядел максимально привлекательно 🙂

команда проекта