Кейс: создание сайта с каталогом товаров

В конце апреля опубликовали сайт завода “Синтез-Кировец”. В рамках проекта выполнили проектирование и осуществили полную переработку сайта. Ядром сайта является каталог продукции — ему уделили особое внимание. Сделали его удобным для поиска заказа и отправки заявки. Не забыли про SEO, и сайт уже сейчас неплохо ищется по узким запросам.

Наше первое знакомство с представителям клиентов состоялось еще в 2017 году, после чего проект был поставлен на паузу. Компания вернулась к этому вопросу в сентябре 2020 года. После недолгих согласований мы преступили к работе.

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

Каталог — состояние на начало работы

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

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

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

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

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

Далее провели анализ сайтов конкурентов, который показал, что у них:

• плохая подача информации;
• нет возможности заказа товара с сайта;
• большой уровень вложения страниц и сложная навигация, из-за этого — неудобство в использовании.

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

Модель согласовали с клиентами и перешли к написанию текстов и проработке прототипа сайта. Поскольку основная целевая аудитория сайта будет просматривать его на стационарных компьютерах, прототип делали именно в такой версии.

Дизайн

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

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

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

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

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

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

Каталог — решения и идеи

В ходе создания сайта с каталогом товаров по просьбе заказчиков мы отказались от использования фильтров. Вместо этого в шапку каталога добавили поиск с предзаполнением — он начинает показывать возможные совпадения продукции еще во время написания запроса. Логика тут простая — большую часть продукции ищут по названию, в которое включены цифровые обозначения. Например, “Резиновая смесь бутадиеннитрильная и хлоропреновая 7-26-391”. А искать будут по коду “7-26-391” — именно эту особенность мы учли.

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

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

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

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

Еще одним предложением, от которого клиенты отказались, было добавление посадочных страниц, на которые можно было вывести отдельные наименования продукции с привязкой их к определенной отрасли или более общему запросу. Производимая продукция может искаться не только по коду и названию (Амортизатор 155-34-412), есть более общие запросы, например, “амортизатор для тракторов”. Так у клиентов была бы возможность самостоятельно формировать страницы под необходимые запросы и размещать на них требуемую продукцию.

Сложности

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

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

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

Под капотом

Сайт с каталогом товаров работает под управлением CMS Umbraco 8. На ней мы делаем почти все сайты. И любим ее за удобство для сопровождения сайта клиентами и за надежность. Даже без постоянного обновления системы управления контентом сайт надежно защищен.

SEO

Используемая для управления сайтом CMS Umbraco была доработана нами и учитывает основные потребности для дальнейшего продвижения сайта. 

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

Заполнение

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

Кому будет полезен кейс 

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