Закажите сайт по телефону 8-800-5555-864

Корпоративный сайт как отражение компании: надежность и технологичность GUS-Trans

Заказчик: GUS-Trans
Разработчик: Red Collar
Редакция: Corporate + модуль «Каталог»
Сайт: gus-trans.ru

О клиенте

GUS-Trans — международная транспортная компания, существующая с 2009 года. Занимается грузоперевозками, растаможкой, выполняет сложные логистические проекты и оказывает сопутствующие услуги. Компания имеет огромный опыт и возможности по грузоперевозкам, осуществляет их с высоким уровнем качества и ответственности. Компания обладает транспортом под любую задачу: авто, морской и ж/д. Работает в Восточной, Западной Европе и СНГ.

Разработанный сайт презентует компанию и ее услуги

Задача

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

Заказчику требовался корпоративный сайт с имиджевыми целями. Строгий, технологичный, запоминающийся — получившийся проект заслужил международную награду «Сайт дня» на конкурсе CSS Design Awards.

Решение

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

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

Red Collar разработали нестандартный дизайн сайта

Платформа сайта

«

Сайт GUS-Trans мультиязычный: здесь четыре языковые версии (русская, английская, немецкая и голландская), расположенные на четырех разных доменах. Мы выбрали платформу UMI.CMS, поскольку она позволяет быстро создавать такие мультиязычные сайты и легко управлять ими из общего административного интерфейса.

»

Богдан Лотарев,

backend разработчик
Red Collar
Богдан Лотарев,
backend разработчик
Red Collar.

Структура и контент

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

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

Страница Контакты на сайте GUS-Trans

Услуги. Один из самых сложных разделов с точки зрения backend разработки. У каждой услуги есть своя отдельная страница, а в ней контент скомпонован из блоков. Все такие страницы ― комбинированные, поэтому контентная часть заполняется при помощи подстраниц. И несмотря на структурную сложность, UMI.CMS позволяет это делать с минимальными затратами ресурсов и разработчика, и администратора сайта.

Каталог услуг

Новости. Важный раздел для сервисной компании. Здесь можно показать на примерах, насколько хорошо команда знает свое дело ― например, представить кейсы о том, как везли дорогие хрустальные люстры через полмира или антикварную мебель по морю. Эти истории подтверждают, что компании можно доверять. Кейсы и новости с легкостью публикуются владельцем сайта самостоятельно при помощи UMI.CMS.


Дизайн

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

Для этого разработчики сделали интерактивный слайдер с горизонтальным перемещением ― круг, который перетаскивается мышкой влево или вправо. Эта фишка олицетворяет саму суть компании: перевозку грузов, перемещение вещей в пространстве. Red Collar подробно рассказали об этом решении в своей группе в facebook.

Интерактивный слайдер

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

Автоматический слайдер на главной странице

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

Движение ― вот ключевая черта образа компании, транслируемая через дизайн сайта.

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

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

Иконки

Карта. Стремясь к максимальной скорости работы сайта, разработчики сделали легкой и быстрой для загрузки даже такую деталь, как карту. Но с точки зрения разработки путь был не самым простым.

Когда вы открываете страницу «О компании», исходное изображение карты анализируется на уровне пикселей и программа просчитывает его по сетке: где есть точки, из которых состоит рисунок, а где их нет. Затем карту на Canvas рисует сам сайт, повторяя её с SVG-файлов и проявляя с приятным анимированным эффектом за доли секунды. Благодаря этому решению элемент облегчает и ускоряет работу сайта.

Анимированная карта на сайте GUS-Trans на UMI.CMS

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

Адаптив

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

Адаптивный дизайн сайта GUS-Trans на UMI.CMS

Контакт с пользователем

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

Кроме того, направление на возможность связи дублируется в слайдере с преимуществами: после знакомства с компетенциями компаниями идет предложение связаться с представителем GUS-Trans.

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

Форма обратной связи на UMI.CMS

Результаты

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

Сайт получил престижную международную награду — «Сайт дня» на конкурсе CSS Design Awards. Жюри высоко оценило сайт за удобство использовании, дизайн и инновационные решения.

Диплом CSS Design Awards

Слово клиенту

«

Мы обратились в Red Collar, чтобы вдохнуть свежее веяние в образ компании и стряхнуть пыль со стилистики бренда — сделать чистый, современный и технологичный сайт, который бы качественно презентовал услуги и формировал верный образ нашей компании.  Концепция понравилась сразу. То, что мы и хотели — лаконичный и изящный стиль с интересными запоминающимися решениями, что полностью соответствует европейскому уровню. В процессе работы были свои нюансы и спорные моменты, но в одном случае продюсер смог грамотно убедить в позиции агентства, а в другом оперативно отреагировать на недочеты. Но обязательно хочу отметить тот подход в общении с клиентом, которому придерживаются ребята: личный контакт на протяжении всего проекта, оперативность в решениях, профессиональные и обоснованные ответы на все сомнения или вопросы, которые возникали, что говорит только об одном — ребята из Red Collar по праву заслуживают абсолютное доверие.

»

Юлия Корнелиссен,

маркетинг менеджер
GUS-Trans
Julia Cornelissen. Marketing Manager GUS-Trans