«Это вам не сосиски в супермаркеты возить». Как мы делали сайт для транспортной компании, перевозящей опасные грузы
Что вы представляете при фразе «сайт для транспортной компании»? Стоковые картинки с машинами и длинные блоки с текстами, где половина слов — это непонятные термины. Поэтому, когда к нам в NAJES обратилась транспортная компания «Эверест», мы решили разбить эти стереотипы. Рассказываем, как сделали стильный сайт для логистического бизнеса.
На связи команда веб-студии NAJES! За сайтом к нам обратилась транспортная компания «Эверест». Ребята занимались не только обычной перевозкой товаров и материалов, но и работали с опасными грузами. Мы решили не делать стандартный сайт с большой фотографией грузовика на первом экране, как у большинства подобных компаний. Погрузились всей командой в эту сложную отрасль, провели полноценное исследование и… сейчас расскажем, что из этого вышло.
С чего все начиналось?
Сначала было все просто — к нам постучался проектный маркетолог от компании «Эверест». Нужно было сделать лендинг для транспортной компании… но затем превратить его в многостраничник.
У компании уже был сайт на WordPress. Правда, он уже давно устарел. Да и изменения они не могли вносить сами — контакты человека, который верстал его, давно уже потеряли.
Поэтому было решено сделать абсолютно новый сайт. Но сначала предстояло разобраться во всей этой «транспортной истории». И начали мы с главной страницы.
Провели маркетинговые исследования, чтобы выделиться из кучи транспортных компаний, которые «на одно лицо»
Обычно, когда мы договариваемся с заказчиком, то отталкиваемся от задач проекта и предлагаем ему несколько вариантов работы. Все варианты сотрудничества перечислять не будем. Грубо говоря, выбор такой:
- сайт с прототипом, дизайном и версткой
- маркетинговые исследования продукта, рынка, целевой аудитории (ЦА) и конкурентов + сайт с прототипом, дизайном и версткой
Конечно, это не значит, что в первом случае мы не смотрим, что делают другие компании, и «забиваем» на боли клиентов заказчика. Изучаем рынок в любом случае. Просто во втором варианте мы еще собираем майнд-карту и таблицу с анализом конкурентов и упаковываем в отчет о маркетинговых исследования с результатами и рекомендациями, которые остаются у заказчика.
Анализ конкурентов: одинаковый визуал, расплывчатое позиционирование и калькуляторы на сайтах
Когда маркетолог провел первое интервью с заказчиком, то отправился изучать рынок, инфополе, прямых и косвенных конкурентов. Мы понимаем, что у клиента может быть свое представление о рынке — оно не всегда совпадает с реальностью. Поэтому информацию собираем на этом этапе максимально непредвзято:
Мониторим по ключевым запросам компании из поисковой выдачи. По сути, повторяем путь потенциального покупателя
Отбираем для анализа только тех, кто предлагает такой же продукт, как и наш заказчик. В данном случае это была перевозка опасных грузов. Перевозчики мяса и сосисок в «Магнит» нас не интересуют
Выбираем общие и «нишевые» критерии, по которым будем их сравнивать. Кроме позиционирования, цен и дизайна сайта, в транспортной отрасли это еще и тарифы на перевозку, наличие автопарка, гарантии, сроки и т.д.
Собираем информацию по каждому из критериев и составляем сравнительную таблицу. Она индивидуальна для каждой компании. Все зависит от «нишевых» критериев, по которым покупатели сравнивают компании в отрасли
Выделяем сильные стороны каждого конкурента. Отдельно выносим моменты по каждой компании, которые понадобятся для создания позиционирования.
Анализ целевой аудитории: крупные клиенты, которым важны сроки, цена и безопасность
Со стороны кажется, что у всех транспортных компаний одна ЦА. Но если углубиться в анализ, то становится понятно — это не так. Опасные грузы вряд ли интересуют маленькие фирмы и стартапы. Чтобы понять, кто же такие клиенты «Эвереста» и чего они хотят, мы:
Проанализировали описание ЦА от заказчика. Узнали, с какими компаниями сейчас работает «Эверест».
Провели анализ ключевых запросов через Wordstat. Выяснили, что интересует клиентов, которые заказывают перевозку опасных грузов, какие вопросы и ожидания у них есть.
Промониторили отзывы о нашем заказчике и его конкурентах. Узнали, кто заказывает услугу, на что они чаще всего обращают внимание.
Общались с целевой аудиторией на тематических форумах. Маркетолог, который работал над исследованиями, участвовал в обсуждениях, задавал вопросы, «провоцировал» беседу. Все это помогло также лучше узнать целевую аудиторию
Взяли боли целевой аудитории и «переложили их» на прототип будущего сайта
Когда мы закончили исследование и отдали результаты заказчику, настало время переходить к прототипу сайта. Поскольку целевая аудитория получилась достаточно узкой, то и на сайте нельзя было тратить место под миллион преимуществ и достоинств, которые по сути мало интересуют потенциальных покупателей. Мы решили через каждый блок на сайте закрыть конкретное пожелание, страх и боль ЦА:
Предложили графический дизайн-концепт вместо стоковых фотографий и бесконечных полотен текста
Одна из главных сложностей, с которой мы столкнулись на этапе дизайна — полное отсутствие визуального контента у «Эвереста». Не было никаких фотографий, которые можно использовать на сайте. У прямых конкурентов практически не было удачных решений — все те же стоковые фотографии грузовиков. Тогда в качестве референсов мы попробовали взять сайты компаний, которые занимали смежные ниши. И вот здесь уже удалось найти интересные решения.
🚩Хотелось выделиться из кучи одинаковых сайтов. Поэтому в качестве главной идеи мы предложили графику. Выбрали для фона бежевый цвет, а шрифт сделали черный. Получился хорошо читаемый текст, а на нейтральном фоне четко видна графика.
🚩 Сделали изометрические иллюстрации. Даже запчасти стали выглядеть намного привлекательнее. И вновь — никаких стоковых фото, где те же шины и краны выглядели бы серо и мрачно:
🚩 Важно — расположить всю информацию не полотном текста, а отдельными блоками. Так посетителю сайта легче ориентироваться в информации — он быстро найдет то, что ему нужно.
🚩 Чтобы сканы сертификатов и разрешений не портили внешний вид страницы, мы закрыли их такими лаконичными изображениями. Чтобы посмотреть их, достаточно нажать кнопку «Смотреть», и перед пользователем откроется скан документа
Уход маркетолога, проблемы с прототипом и «переделка по второму кругу»: как мы заказчику дополнительные страницы к сайту делали
Главную страницу мы закончили. Она уже работала как полноценный лендинг, поэтому мы запустили в работу сайт уже в таком виде. А дальше надо было добавить дополнительные страницы с услугами. И здесь что-то пошло не так.
Наш маркетолог, который работал с главной страницей, как раз уволился. На его место уже пришел другой человек. Заново знакомиться с заказчиком, вникать в работу и решения — это слишком долго. Поэтому мы попросили бывшего маркетолога помочь закрыть проект. А дальше звезды сошлись не так, как надо:
➡ заказчики уже полностью доверились нам, поэтому особо не проверяли прототипы страниц
➡ бывший маркетолог уже не особо парился по поводу работы
И вот мы сделали прототипы страниц, даже сверстали дизайн, и тут выяснилось… что все не то и не так.
❌ мы заполнили 9 карточек для запчастей на страничке — выяснилось, что их должно было быть 49
❌ сделали разделы и написали тексты для разных услуг — оказалось, что часть из них неактуальна
❌ две страницы были сверстаны для русской версии, а их нужно было делать для английской
Это только часть проблем, которые всплыли. По факту их было гораздо больше. Ну и что делать? По идее надо было возвращаться к прототипу, менять все, согласовывать, а затем менять дизайн. Мы даже начали так делать, но в какой-то момент осознали — это еще больше затянет работу и раздует бюджет заказчика.
Наша команда сделала глубокий вдох, а затем решила пойти другим путем. Мы собрали досконально все правки от заказчика, поняли, что делать и сразу начали править это в дизайне. Попотеть пришлось нормально — однако заказчику это не показывали. В конце концов, разобрались со страницами и завершили многостраничник.
Клиент даже не заметил наших внутренних разладов. Да и зачем его было напрягать? Главное — сделать крутой сайт, а не жаловаться на бывшего маркетолога и оправдывать свои косяки.
Что получили в итоге?
Сайт получился действительно необычным. Вместо стандартных решений, которые выбирают транспортные компании, мы сделали ставку на графику и удобные блоки со всей необходимой информацией. Заказчик принял сайт, и занялся его администрированием сам, поэтому мы даем две ссылки, где вы можете посмотреть результат работы:)
Здесь можно посмотреть, как выглядел финальный вариант сайта на момент завершения проекта. - Behance
Зачет! Среди кучи стоковых однотипных сайтов действительно выделяется. Но креатив в меру. А желтый отсылает к цвету опасности, но мягко и аккуратно. Я бы как заказчик был рад :)
Но что лучше сработает на аудиторию - вот это вопрос. Этот стилёк или колхозное, но такое близкое духу Иван Петроича, которому нужон перевозчик.
Как с хомяком в твиттере.
Тут всё же целевая аудитория не Петровичи для перевозки мяса с оптовой базы🤣
Плюс, задача была именно с уклоном на имидж сделать сайт, как визитка больше, для присутствия в интернетах.
С хомяка в твиттере посмеялся)
Да уж, совсем не стоковые и однотипные иллюстрации))) Тут даже цвет не потрудились поменять)
А мы разве где-то указывали, что сами отрисовывали иллюстрации?)
Мы их брали со стока и дорабатывали под этот проект.
Классный сайт, анимация движения фуры понравилась))
Спасибо, в целом одна из задач была сделать что-то залипательное)
Добавьте блок "танчики". Провели фуру по препятствиям.
Очень много труда вложили в этот сайт, молодцы!
Спасибо)
Жаль только сейчас уже не мы сопровождаем сайт и на нем всплывают порой косяки в верстке или в контенте...
Поддерживаю
Топчик
Спасибо)
сочетание цветов удачное и техническая часть сайта сделана удобно и понятно для пользователя
Анализ конкурентов, подбор референсов и полное доверие от заказчика позволили нам создать такой проект)
Разрешение на перевозку по установленному маршруту и Сертификат на продукцию – ссылок на изображения нет.
Увы, администрированием сайта сейчас уже занимаемся не мы, там уже достаточно много изменилось с момента релиза. Для этого и приложили две ссылки. чтобы можно было увидеть это и сравнить)
Прекрасный кейс! Спасибо за грамотную статью с полезными "подводными камнями"))
Спасибо!)
В целом норм, но гипотетически желтый цвет зае*бет, лучшим решением было бы сделать отдельные элементы с этим беспонтовым желтым цветом, если очень хочется. Типа карточек, иконок и т.д. Лучше выбирать безопасное решение, которое покроет большинство пользователей, чем радикально-креативное. Ну или как уже сказал упаковывать в маркетинговые артефакты типа баннером и тд. 6 из 10
А чем он может за*бать?
Почему считаете, что ваши предложения будут лучшим решением?
Из кучи стоковых сайтов возможно вы выделились, отрасль не изучал. Но и предложенные решения ни чем удивительным не блещут.
А какие решения вы считаете удивительными? Как вы это трактуете? Разве сайт должен удивлять чем-то?)
Мы говорим о сайте или о каком-то подарке или безделушке, которая должна УДИВЛЯТь?)
Что вы закладываете вообще в слово "удивительное" в этом контексте?
Пробудить желание к покупке, а у вас стандатный информационный сайт, причем информация базовая, нет ни каких преимуществ над конкурентами. Как клиент должен выбрать Вас? Только за то что вы чуть чуть более стильные, чем другие?
А вы материал читали?
Да
Тут без изучения отрасли понятно, что сайт не должен удивлять. Сайт должен показать, что компания способна решить задачи клиента.
Что по скорости загрузки на мобильных пейджспид показывает?
Ориентируемся на сервис loading express, пейдж спид особо тильду не жалует да и не только ее. По лоадингу сайт в желтой зоне
Если заказчик сам не в состоянии определить,сколько услуг у него актуализированы, то о каком ответственном подходе речь?
На этапе разработки всякое бывает
Это сплошь и рядом на самом деле и это даже не только у малого бизнеса)
а я не понял, ради чего это было. какого эффекта достигли? измеряли хоть какие-то метрики? чем это лучше стоковых фото с грузовиками? тема не раскрыта
Задача больше была визитка/промо, а не лидген, у них основная услуга это перевозка опасных грузов, очень узкая ниша, с учётом того что они только по дальнему Востоку и Китаю работают.
Хороший кейс. Напишите во сколько обошелся такой сайт заказчику вместе со всей доп работой ?
Более 400, конкретных написать не могу
Может у меня нет вкуса , но я увидел одно сплошное желто- серо- черное пятно.
Ну если опираться на вкусовые предпочтения в этом плане, то ладно)
Надеюсь, что если вдруг вы будете заказчиком какой-либо работы дизайнера вы так не будете давать обратную связь ему)
Если бы я был заказчиком , то предварительно прислал бы несколько вариантов сайтов , которые мне нравятся . Вашего сайта в моем списке не будет 😀.
Ну, ладно, не будет так не будет:)
Дизайн вещь субъективная :)