Кейс. Сайт для маркетингового-агентства. По структуре от ТОПов digital-индустрии

Всем привет! Это Виталий Радченко СЕО Web-do.ru и основатель таск-трекера для digital-агентств Otask.ru. Сегодня поделюсь кейсом о том, как мы разрабатывали сайт для наших коллег — маркетингового digital-агентства Capsula. Статья получилась длинная, но богатая на детали процесса, поэтому наливайте чайку/кофейку и погнали! 🙌🏼

Задача: создать сайт для маркетингового digital-агентства Capsula.

Цели:

Начали, традиционно, со структуры будущего сайта

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

По этой же структуре определили список макетов к отрисовке, получилось:

Если интересно — вот ссылки на соцсети ребят:

Рекомендую изучить😉

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

Порядок блоков, который мы использовали получился следующий:

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

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

Здесь предлагаем предлагаем ознакомится с результатами клиентов агентства с возможностью перейти к прочтению полной версии кейса.

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

Здесь расположили основные дынные о компании и в стиле капсулы сделали коллаж с фотографиями руководителя агентства.

Здесь отдельно хочется отметить насколько сильно контент, который предоставляет заказчик влияет на конечный результат. В данном случае нам предоставили качественные фото, поэтому получился такой интересный вариант.

При наведении на каждого участника можно посмотреть цветную альтернативную фотографию.

Так как одна из целей сайта это привлечение партнеров, то мы специально выделили блок на главной странице об этом.

В самом низу предлагаем пользователю CTA из нескольких вариантов - рассчитать стоимость, написать в WhatsApp или в Telegram.

Подвал традиционно собрал ссылки на все разделы сайта + кнопки всех целевых действий, социальных сетей. А также отдельно выделили членство агентства в ассоциациях digital-агентств - для целевой аудитории это важное подтверждение экспертности и заинтересованности в развитии.

Для каждой из услуг создали отдельную посадочную страницу с:

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

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

Конечно, мы не забыли и про страницу Спасибо, куда пользователь попадает сразу после того, как оставляет заявку. Здесь самое время предложить пользователю подписаться на Telegram канал, ведь он уже заочно доверяет агентству, а если еще и увидит "внутреннюю кухню" в канале, то прогреется еще лучше.

А также остальные разделы и модальные окна.

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

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

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

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

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

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

Еще из невидимых, но немаловажных работ - интеграции, чтобы заявки с сайта попадали напрямую в отдел продаж, а именно:

Итог работы - инструмент для привлечения клиентов, демонстрации результатов работы.

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

После запуска клиент стал активно развивать

Это был первый кейс, который мы решили описать настолько подробно. Надеюсь, такой формат интересен к прочтению и мы будем делиться подобными историями чаще 😎

Спасибо что дочитали до конца🤗

💻 Заказать разработку сайта или приложения — Web Do

✅ Таск-трекер и учет финансов для digital-команд и не только — O!task

✈ Telegram канал про развитие агентства Web Do и продукта O!task — Подписывайся