Мы сделали корпоративный сайт для одного из лидеров рынка инжиниринга в России

Первый экран главной страницы
Первый экран главной страницы

Старый сайт не решал задачи компании «МодЭнС Групп», поэтому обратились к нам за редизайном. Мы освежили дизайн сайта и провели работу над смыслами. Что из этого вышло, читайте дальше в статье.

Видео с главным экраном нового сайта

Всем привет! На связи маркетинговое агентство «Эталон». В прошлом году к нам пришел клиент с запросом на редизайн старого сайта для их компании «МодЭнС Групп». Компания оказывает разного рода услуги: инвест. сопровождение, ценовой мониторинг и так далее. Также помогает с ценообразованием, проектированием. Одним словом, работают в сфере инжиниринга.

Пожелания клиента

Перед началом работы мы изучили ТЗ, которое нам отправил клиент. Если всё свести к одному предложению, то задача стояла следующая: разработать актуальный сайт для компании «МодЭнС Групп» на Tilda. Сайт должен выглядеть современным.

Разрабатывали сайт на основе аналитики

Первое, чем мы занялись, — это анализ целевой аудитории. Данные по основным сегментам ЦА были в ТЗ, поэтому его досконально изучили. Всю целевую аудиторию можно свести к 2 сегментам: электросетевые организации и генподрядчики электросетевых организаций. Под последними подразумеваются строители, генпроектировщики и промышленные предприятия.

Второй этап — это изучение анализа конкурентов. Часть аналитики лежала на стороне клиента. Поэтому для лучшего понимания рынке и конкурентов мы изучили сравнительную таблицу, которую нам отправил маркетолог «МодЭнС Групп».

Анализ конкурентов 
Анализ конкурентов 

Скелет сайта. Как мы создавали структуру

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

Структура сайта по страницам
Структура сайта по страницам

Работа над смыслами и текстом

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

Одна из главных задач при написании текста — формирование оффера. Мы долго думали, как можно коротко описать предложение компании и выделиться на фоне конкурентов. При изучении материалов компании заметили, что при работе по одной услуге клиент получает добавленную ценность от других направлений. Компания имеет экспертизу в разных направлениях: IT, инвестпрограммы, ценообразование, планирование и проектирование. За счёт этого клиент получает выгоду. Это по-настоящему уникальное преимущество мы вынесли в оффер на главной странице.

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

Разработка дизайн-макета сайта

После написания текста мы принялись за разработку дизайна. Работа над дизайном была непростым этапом. Мы реализовывали 3 разных варианта дизайна для заказчика.

Изначально придерживались строгого минималистичного дизайна. Но со стороны заказчика была критика, поэтому мы пересмотрели наш дизайн. В конечном итоге скорректировали цветовую палитру, сменили композиционные решения и изменили функционал блоков. Вторая версия дизайна заказчику сайта понравилась намного больше, но от 3D-графики настаивали отказаться. Тогда мы предложили 3 вариант дизайна с использованием фотографий. Последний вариант дизайна быстро согласовали.

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

Вёрстка сайта на Тильде и подготовка сайта к запуску

После согласования дизайна мы приступили к вёрстке сайта.

При разработке сайтов мы не останавливаемся на вёрстке. Следующие этапы — это тестирование, настройка SEO-оптимизации, настройка Битрикс24 для передачи заявок. Давайте по порядку разберём первые 2 этапа:

  • Тестирование сайта. Сайт мы тестировали в Google Chrome, Apple Safari, Microsoft Edge, Mozilla Firefox, Opera, Яндекс.Браузере. Также изучали сайт на различных устройствах: десктопах и мобильных устройствах от Apple и Android.
  • На этапе брифинга клиент рассказал, что сайт нужно подготовить под продвижение в поисковых системах. Поэтому с нашей стороны мы настроили для сайта SEO-оптимизацию. А конкретно: реализовали страницу 404, настроили фавиконы, настроили заголовки H1-H3, добавили alt-теги, написали мета-теги, составили ключевые слова для страниц, сделали редирект на единую версию (HTTPS+ без WWW), оптимизировали скорость загрузки.

Что в итоге

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

👉 Если вы планируете разработать сайт для своей компании, то смело пишите в телеграм

1
Начать дискуссию