- Заказчик
- ТВК «ЮЖНЫЙ» – крупнейший торгово-выставочный центр сельхозтехники на Юге России. Занимается снабжением с.-х. предприятий Южного и Северо-Кавказского округов современной энергонасыщенной техникой.
- Задача
- Создать современный сайт с удобным пользовательским интерфейсом, который подчеркнет статус компании и станет эффективным инструментом для продажи сельскохозяйственной техники онлайн.
ТВК «ЮЖНЫЙ» занимается реализацией сельскохозяйственной техники и запасных частей в формате постоянно действующей выставки, а также сервисным обслуживанием и технической поддержкой оборудования.
ПОЖЕЛАНИЯ ЗАКАЗЧИКА
ТВК «ЮЖНЫЙ» обратились в нашу студию для разработки нового сайта. Существовавший на тот момент сайт имел устаревший дизайн, не был адаптирован под мобильные устройства, обладал рядом недостатков и в целом не соответствовал масштабам компании.
- Сложная навигация по каталогу.
- Отсутствие поиска, фильтров, сортировки товаров.
- Громоздкие карточки товаров.
- Невозможность оформить заказ онлайн.
Старый сайт заказчика
Опираясь на недостатки старого, заказчик обозначил свои пожелания по функционалу нового сайта:
- Максимально удобный для пользователей процесс выбора техники.
- Карточка товара, в компактной форме содержащая описание и подробные технические характеристики, а также фотогалерею, видео-обзоры и видео-отзывы.
- Возможность оставить онлайн-заявку на покупку техники и запчастей, на сервисное обслуживание.
- Информационные блоки компании, ее деятельности и предоставляемых услугах.
- Корректное отображение на любых мобильных устройствах.
Также заказчик сразу указал, что в дальнейшем планирует самостоятельно наполнять сайт информацией и актуализировать контент.
АНАЛИЗ
Чтобы создать не просто красивый, но полезный, решающий бизнес-задачи сайт, прежде чем приступить к разработке, мы проводим анализ рынка, конкурентной среды и целевой аудитории.
Составленный нами портрет ЦА выглядит следующим образом.
Мужчины в возрасте от 30 до 60 лет, семейные, с высшим или средне специальным образованием в аграрной или технической сфере, со стабильным высоким или средним доходом. Так или иначе они заняты в сельском хозяйстве: руководители разного уровня в аграрных компаниях или хозяйствах, фермеры, собственники земельных участков с/х назначения, механизаторы, инженеры, агрономы, предприниматели.
Соответственно, наш проект предназначен для взрослой аудитории с устоявшимися ценностями, которая свободно владеет специальной терминологией и отлично разбирается в сложных технических характеристиках.
Дизайн сайта должен быть лаконичным, максимально удобным и современным, подчеркивающим высокотехнологичность продаваемого оборудования.
Анализ конкурентов показал, что сайты данной тематики обладают недостатками, аналогичными тем, что указал наш заказчик: в карточках товаров нагромождение таблиц и различной технической информации, проблемы с адаптацией на экранах мобильных устройств, низкая скорость загрузки страниц; также в них мало индивидуальности, фирменного стиля, который формировал бы цельный образ компании и выделял ее на фоне конкурентов.
Таким образом, нашей задачей была разработка эффективного инструмента для продажи техники онлайн и информирования потенциальных клиентов о деятельности компании, который будет соответствовать современным требованиям как по дизайну, так и по исполнению, и выгодно выделит компанию на фоне конкурентов.
ПРОЕКТИРОВАНИЕ
Мы проработали возможные сценарии взаимодействия с сайтом и составили перечень необходимых функциональных модулей, которые будут решать задачи пользователя.
На основе этого составили структуру будущего сайта, отрисовали и согласовали с заказчиком прототипы основных страниц.
ЦВЕТОВОЕ РЕШЕНИЕ
Основными цветами сайта было решено сделать цвета логотипа компании:
- темно-пшеничный, цвет пшеницы, олицетворяющий цель и результат деятельности сх предприятий,
- красный, теплый, цвет благодатного южного солнца.
Дополнили, по согласованию с заказчиком, нейтральными, но контрастными черным и серым, которые в свою очередь вызывают ассоциации с плодородной почвой и непосредственно орудиями, техникой, производством.
С помощью такого набора цветов можно выгодно расставить акценты и подчеркнуть наиболее важные детали, не перегружая визуал сайта.
ДИЗАЙН
В дизайне сайта не должно быть случайностей. Мы продумали и расположили каждый элемент в соответствии с логикой страницы сайта, чтобы пользователю было просто и удобно получить нужную информацию.
UI элементы мы выполнили в сдержанном лаконичном стиле.
Чтобы не отвлекать пользователя от восприятия информации, было решено не перегружать визуал множеством динамичных элементов, а добавить плавное появление блоков по мере прокрутки экрана и смену состояний элементов при наведении.
ГЛАВНАЯ СТРАНИЦА
Один из вариантов сценария.
Пользователь планирует покупку сельхозтехники, ищет, где это можно сделать, в результате попадает на главную страницу сайта. Знакомится с компанией, убеждается в ее надежности, переходит в каталог для выбора товара.
Для того, чтобы вызвать доверие у пользователя и расположить его к дальнейшему взаимодействию с компанией, на главной странице мы разместили блоки, упрощающие навигацию по сайту:
- краткая справка-визитка компании,
- направления деятельности с переходом на соответствующий раздел сайта,
- действующие акции,
- актуальные события.
В главное меню мы вывели основные разделы каталога товаров, во вспомогательном боковом – информационные блоки о компании.
КАТАЛОГ ТОВАРОВ
Один из вариантов сценария.
С Главной страницы сайта, с поискового запроса или с контекстной рекламы пользователь заходит на страницу Каталога. Выбирает нужный раздел, применяет фильтры, подбирает нужный товар, сравнивает с аналогичными.
Чтобы сделать каталог товаров наглядным, но компактным, мы реализовали его в форме бложного списка.
Для упрощения процесса выбора техники добавили фильтры по различным параметрам и возможность сравнить товары по ключевым характеристикам.
КАРТОЧКА ТОВАРА
Один из вариантов сценария.
Пользователь планирует покупку техники, через поиск или каталог товаров переходит на карточку конкретного товара, изучает его спецификацию, смотрит видеообзор. Сомневается, изучает отзывы, сравнивает товар с аналогичными из блока рекомендуемых товаров, заказывает консультацию или принимает решение и оставляет заявку на покупку.
Продаваемый товар является сложным техническим устройством, со множеством характеристик и спецификаций, поэтому чтобы помочь пользователю сделать выбор, мы наполнили Карточку товара максимальным набором текстово-графической информации
- слайдер с фото и видео товара,
- подробное описание, технические характеристики, особенности и документацию,
- видеообзор,
- галерею видеоотзывов,
- а также блок с рекомендуемыми товарами.
Громоздкие текстовые и табличные блоки скрыты в аккордеоны, что позволяет раскрывать их при необходимости и делает карточку товара одновременно информативной и компактной.
Теперь у пользователя есть возможность в онлайн-формате заказать технику или запчасти, оформить сервисное обслуживание, записаться на демопоказ и получить консультацию.
АДАПТАЦИЯ ПОД МОБИЛЬНЫЕ УСТРОЙСТВА
Сайт адаптирован под мобильные устройства и корректно отображается на любом десктопном мониторе, планшетном компьютере или экране смартфона. При этом качество отображения не зависит ни от диагонали, ни от позиционирования экрана.
Мы реализовали логичное отображение его блоков на различных мобильных устройствах, добавили плавное появление элементов при прокрутке страницы.
Таким образом, независимо от размеров и ориентации экрана, пользователю будет комфортно взаимодействовать с сайтом, что обеспечивает одинаково высокую конверсию при загрузке на разных устройствах.
НАПОЛНЕНИЕ КОНТЕНТОМ
На завершающем этапе мы убедились в корректной работе функциональных блоков и пользовательских форм, проверили сайт на кроссбраузерность и кроссплатформенность, наполнили тестовым контентом.
Так как заказчик сразу указал, что будет наполнять сайт контентом самостоятельно, мы выбрали систему управления контентом WordPress, которая отличается простым и понятным интерфейсом и позволяет редактировать информацию на страницах сайта без специальных навыков программирования.
Мы предоставили заказчику все доступы к ресурсу, составили и передали инструкцию по наполнению сайта и дополнительно провели онлайн-консультацию по возникшим вопросам.
В РЕЗУЛЬТАТЕ
проделанной работы мы получили не только практичный в использовании сайт, но и визуально гармоничный, подчеркивающий высокий статус компании.