Кейс: разработка сайта для услуг эвакуатора "Автомаяк24"

2023-08-03 07:34:29 Время чтения 5 мин 110

Менее чем за месяц, мы разработали сайт automayak24.ru, пройдя все этапы - от аналитики и проектирования до верстки и программирования. Запустили контекстную рекламу и сейчас наблюдаем поведение пользователей. Здесь рассказываем о нашем подходе к разработке

Меня зовут Софья Гаева, я владелец веб-студии «Сеослон» и маркетолог. Суть моего бизнеса – давать заявки клиентам.

От аналитики до публикации

  1. Построить гипотезу и спроектировать опыт пользователей
  2. Разработать дизайн, который будет с высокой вероятностью закрывать потребности целевой аудитории
  3. Запрограммировать сайт, на основе согласованного дизайн-макета

Этап 1. Аналитика

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

Этап 2. Проектирование пользовательского опыта

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

Этап 3. Определение дизайн-концепции и дизайн-макет

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

Этап 4. Программирование и вёрстка

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

Этап 5. Подключение домена и передача доступов заказчику

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

Итоги

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