В ноябре 2023 года к нам обратилась Марина Сергеева — руководитель маркетингового агентства «Кейнекс» с заказом на разработку сайта с помощью блочного конструктора Tilda.
Марина планировала принять участие в премии «Человек года - 2023» в номинации «Амбассадоры бренда», и сайт ей нужен был для презентации. Эта номинация предназначена для предпринимателей с сильным личным брендом — тех, кто сам стал лицом своего бизнеса, кто смело транслирует свои ценности и является, в некотором смысле, ролевой моделью. Соответственно, сайт должен был отражать не только интересы бизнеса, но и индивидуальность его владелицы.
На момент обращения к нам у агентства «Кейнекс» уже был действующий сайт-лендинг, но он изрядно устарел. Два года назад основным направлением деятельности агентства являлся email-маркетинг. На сайте, в основном, был представлен именно этот инструмент. С того времени спектр услуг компании серьезно расширился, но на сайте это не отразилось. Конверсия была небольшой, равно как и поток лидов.
В качестве платформы для разработки была выбрана Tilda, так как у клиента уже был положительный опыт работы с этим сервисом.
Целью №1 было создание интернет-ресурса для презентации на премии «Человек года - 2023», до которой оставалось меньше месяца! Сайт должен был ярко и точно рассказать о позиционировании агентства, его миссии, ценностях и продуктах. Долгосрочной целью служила, конечно же, лидогенерация, однако, конкретных KPI перед нами не ставили.
1. Разработка структуры сайта
Во время единственной установочной сессии проектный менеджер получил всю необходимую информацию, после чего была разработана и быстро согласована структура сайта.
- В шапке сайта разместили якорные ссылки на блоки страницы: кейсы, контакты, услуги, мероприятия и «мы в СМИ», добавили логотип, номер телефона, кнопку, ведущую в чат WhatsApp, и кнопку «Заказать звонок». По клику на кнопку открывается всплывающее окно с формой обратной связи.
- На первом экране представили УТП в необычном, анимированном виде. Первая строчка «Задаем новый уровень» остается постоянной, а вторая периодически меняется, имитируя набор текста. Агентство предлагает задать новый уровень в продвижении на рынке, узнаваемости бренда, в стратегии развития, в партнерстве с клиентами, в финансовых результатах и эффективности бизнес-процессов.
- Список услуг представили в виде карточек в следующем блоке, а также продублировали его в виде вертикального меню справа на главном экране. CTA-кнопка: «Получить консультацию эксперта».
- Главный экран отделен от следующих блоков «бегущей строкой» с логотипами ключевых клиентов агентства.
- Карточки услуг включают в себя инфографику и название. При наведении на карточку появляется детализация услуги. Например, в карточке «Digital-стратегия» появляются подпункты: коммуникационная стратегия, продуктовая стратегия, сегментация ЦА и составление CJM, стратегический консалтинг, анализ рыночных трендов, конкурентов, аудитории.
- Следующий блок рассказывает о том, что ждет клиента на пробной консультации — специалисты агентства поделятся экспертизой по конкретному проекту, обозначат примерную стоимость и сроки выполнения и вышлют детализированное коммерческое предложение. СТА-кнопка: «Отправить заявку».
- Блок «Эффекты применения Digital-инструментов в бизнесе» содержит 4 цифры — рост конверсии, снижение числа ошибок, увеличение числа кликов, снижение оттока клиентов. При прокрутке до блока включается анимация «Счетчик» на всех цифрах блока.
- Блок «Почему мы?» раскрывает три преимущества компании. Четвертое преимущество визуализировано в виде временной шкалы. Средний срок работы с клиентом — 830 календарных дней представлен так, чтобы было понятно, что это 2 года и 100 дней.
- Следующие блоки рассказывают о руководителе компании и о членах команды. Ниже расположены слайдеры с кейсами и публикациями в СМИ. При наведении на карточку кейса или публикации ее содержимое увеличивается. По клику на карточку кейс или статья открывается в новой вкладке.
- В блоке «Мероприятия» представлены события, которые организует агентство «Кейнекс», либо в которых принимает участие в качестве гостя или партнера. Изначально карточка представлена в фирменных цветах, при наведении цветной фильтр пропадает и карточка отображается в натуральном цвете.
Под карточками мероприятия расположена СТА-кнопка «Приглашаем к партнерству». По клику на кнопку появляется всплывающее окно с одноименной формой.
- Предпоследний блок — еще одна форма обратной связи, побуждающая задать дополнительные вопросы на консультации. Для этого можно либо воспользоваться кнопкой «Оставить заявку», либо связаться с агентством через WhatsApp, Telegram или email, используя соответствующие иконки.
- В «подвале» традиционно размещен логотип, якорные ссылки, контактная информация, ссылки на социальные сети и мессенджеры.
2. Создание и согласование прототипа
Этот этап занял больше времени, чем планировалось, прототип выверялся очень тщательно и долго.
3. Дизайн и разработка
После утверждения прототипа команда смогла перейти к дизайну. И снова заказчик был очень требовательным и строгим, согласование на этом этапе потребовало трех итераций. На разработку, в итоге, осталось времени меньше, чем хотелось бы — более 40 часов работы разработчика нужно было уложить в трехдневный срок! При этом большое количество ховер-эффектов и анимации, предусмотренное техническим заданием, требовало дополнительного согласования и проверки. Сайт полностью состоит из zero block’ов — мы не пользовались шаблонными решениями Tilda, а создали уникальный персонализированный дизайн.
После разработки сайта на нем были проблемы с отображением векторных изображений на ios. С этим мы столкнулись впервые, и было решено большую часть векторных изображений заменить на растровые, используя сервис https://squoosh.app/. Изображения были сжаты без потери качества и снижения скорости загрузки.
Марина Сергеева обратилась к нам 13 ноября 2023 года, а уже 7 декабря того же года сайт был полностью готов. Наше сотрудничество продлилось чуть меньше месяца, но оказалось крайне плодотворным.
Мы успели точно в срок подготовить красивый рабочий лендинг, который прекрасно выглядел в качестве презентации компании на премии «Человек года». А после того как торжество отгремело, разработанный нами сайт продолжил приводить в агентство новых заказчиков.
На сайте было установлено большое количество сторонних скриптов, анимации, настроены якорные ссылки, ховер-эффекты, всплывающие (pop-up) окна и формы обратной связи. Все эти элементы лаконично сочетаются между собой, рассказывая о бизнесе «Кейнекс» максимально убедительно и ярко.
