Как мы сделали редизайн и изменили CMS сайта для лидера российского яхтенного рынка

Влияет ли внешний вид сайта на позиционирование бренда? Мы столкнулись с задачей переделать сайт, который бы отражал статус компании и уровень услуг, для одного из лидеров российского яхтенного рынка. Давайте же посмотрим, что из этого получилось. Let’s go! Ой, нет. Полный вперед!

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

Основные задачи проекта:

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

Как правило, на этом этапе начинают всплывать подводные камни, и этот кейс — не исключение. Мы столкнулись с тем, что сайт создан на сложном конструкторе, который доставил бы неудобство и нам, и обладателям сайта в будущем. Поэтому первым делом мы решили перенести сайт с WordPress на Bitrix.

2 этап — дизайн

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

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

Что мы сделали?

Мы практически полностью переработали главную страницу, раздел «Каталог», а также отдельные страницы яхт.

Для того, чтобы передать основную суть бренда и то, что компания — один из лидеров рынка, мы использовали:

У нас были очень ограниченные сроки, так как клиент хотел успеть к началу яхтенного сезона.

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

Killer-feature

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

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

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

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

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

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

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

Данный проект стал уникальным для INPRO.digital с точки зрения уровня взаимодействия и коммуникации с клиентом.

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

Итог: