Самый сложный клиент: как мы в Darvin Digital сами себе обновляли сайт. Потратили 2500 часов и 7.5 миллионов рублей

1. Вводная задача от заказчика, проблематика, цели

У агентства были клиенты, кейсы и экспертная команда. Но сайт попал в бан и мы остались без лидов

Darvin Digital на рынке с 2008 года. За плечами сотни маркетинговых стратегий, успешных рекламных кампаний, SEO для eCommerce и сурового B2B, сайты разного уровня сложности, аудиты, дизайн, контент. Клиенты – B2B-компании, девелоперы, промышленные бренды, маркетплейсы, eCom и даже заводы.

До 2022 года агентство называлось иначе – Darvin Studio. Был другим и наш сайт: выглядел как типичное агентство из нулевых. Белый фон, размытые офферы, сложная структура, неактуальные кейсы.

В это же время для своих клиентов мы делали классные, современные сайты.

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

Редизайн назревал давно, его постоянно откладывали: в приоритете, как это обычно бывает у digital-агентств, стояли клиентские задачи. Но 2022 году Darvin Studio внезапно теряет поток лидов с сайта. Откладывать работу больше было нельзя. Сайт фактически выпал из выдачи: получил теневой бан по неизвестным причинам. Звонков и заявок почти не осталось. Лиды только по рекомендации. А, как известно, сарафан – отличный дополнительный канал трафика, но он не приносит заявки стабильно и прогнозируемо. Так началась история редизайна. И мы стали своим самым требовательным клиентом.

Наталья Головченко

арт-директор, Darvin Digital

«Заходя на сайт, создавалось ощущение, что у нас и сайт старый, и кейсы старые, и всё старое. И вообще мы находимся не на текущей позиции, а лет на 5 назад».

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Приняли сложное решение: сменить домен, название компании и обновить лого

Летом 2022 года Darvin Studio превратился в Darvin Digital. Ренейминг точнее отразил наш фокус на digital-среде. Сменили не только название, но и фирменный стиль. Обновили логотип: сделали новый – минималистичный, более современный, добавили фирменные дудлы. Именно тогда родилась общая концепция нового стиля – тёмная тема, лаконичный современный дизайн. Изменили и коммерческое предложение, которым активно пользовались менеджеры по продажам.

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

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

В 2023 году мы всё-таки решились. Редизайн. Задача сложная не только из-за масштаба, но и потому, что клиент самый требовательный из возможных – мы сами. Работали как всегда, между дедлайнами. Днём создавали и продвигали сайты клиентов, ближе к вечеру шли в Figma вносить правки по своему. В обед следующего дня спорили о цветах и формулировках.

Сайт больше не должен был быть визиткой. Мы хотели, чтобы он:

• демонстрировал экспертность, а не просто перечислял список услуг
• делил аудиторию по задачам и отраслям
• не отпугивал, эффективно работал на входящие трафик: органика, соцсети, статьи, партнёрские переходы.

Старый сайт не справлялся ни с одной из этих задач. Поэтому редизайн нельзя назвать просто визуальным обновлением. Это была полноценная продуктовая разработка, в которой участвовали аналитики, разработчики, маркетологи, дизайнеры и копирайтеры. Каждый этап был обязательным: ничего не пропускали, не ускоряли и не упрощали. В итоге всё уложилось в 6 больших блоков.

1. Аналитика

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

• проверили, как структурированы сайты других агентств, какие УТП они используют, как ведут клиента по воронке
• составили сценарии поведения пользователей: зачем люди приходят, что ищут, почему уходят
• собрали карту текущих страниц: какие работают, какие – мёртвый груз.

Типичная ошибка бизнеса на этом этапе – думать, что и так понятно, чего хочет клиент. Нет. Если делаете системный маркетинг и сайт на годы, всё надо проверять фактами.

2. UX-дизайн

На этом этапе проектировали сайт не как набор страниц, а как последовательность решений пользователя: от входа до заявки.

Что делали:

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

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

3. Контент

Тексты – важнейший инструмент продаж, он передаёт аудитории ваши смыслы. Но в начале анализ, потом тексты. Поэтому контент начали писать, когда структура сайта уже была готова.

Что делали:

• переписали тексты для всех страниц под голос бренда – экспертный, но открытый и доброжелательный, где Darvin Digital – надёжный партнёр, а не подрядчик
• продумали заголовки, офферы и CTA.

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

4. UI-дизайн

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

Начали с концепции. Нужно было определить, как будет выглядеть наш сайт – легко, сдержанно или дерзко? Вариантов было много: от светлой до тёмной темы, десятки разных подходов к первому экрану. Даже попробовали гибридный вариант: часть блоков светлых, часть – тёмных. Когда определились с тёмной концепцией, отрисовали Главную. Но даже после этого в команде остались сомнения: не будет ли перегружен интерфейс, не станет ли сайт визуально тяжёлым? Сделали светлый вариант, чтобы сравнить восприятие.

Но финальную точку поставил опрос. Сравнили восприятие светлой и тёмной темы внутри команды и у клиентов. Тёмная победила.

Затем собрали UI-kit. Это системный набор – заголовки, отступы, кнопки, карточки, цвета и иконки. Он нужен, чтобы сохранить визуальную логику при любом дополнении на сайте в будущем. Без UI-kitа доработки всегда идут хаотично: одна страница в одном стиле, другая внезапно может оказаться в другом. Поэтому сначала правила, потом – страницы.

После этого – внутренние страницы. Под каждую отрасль (eCom, производства, услуги, мероприятия) мы сделали свои посадочные.

Не просто описали услугу-1 и услугу-2, а подробно расписали что конкретно мы предлагаем для каждой отрасли – выводим в ТОП поисковых систем Яндекс и Google, результаты работы.

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

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

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

Такие элементы называются микроинтеракциями. Они делают сайт понятным: видно, что где происходит, приятным в использовании и живым – всё откликается на действия, сайт ощущается интерактивным, а не как картинка.

Помимо этого, позаботились о том, чтобы обновлённый фирменный стиль внедрить повсеместно. Мы адаптировали под свежий стиль все носители: визитки, шаблоны документов, презентации, графику для соцсетей. Даже заказали мерч для команды – футболки, стикеры, чтобы ощущать сопричастность к новому образу и закрепить новое лицо Darvin Digital во всех точках контакта с аудиторией.

5. Разработка

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

• не начнёт ли сайт тормозить, падать или выдавать ошибки, если трафик на нём резко вырастет
• будет загружаться ваша посадочная за 2 секунды или 22. Каждая дополнительная секунда забирает от конверсии до 4,42%.
• как часто вы будете сталкиваться со взломами сайта: воровством данных, отключениями, спамом и фишингом
• SEO. Понравится ли поисковым системам техничка сайта: нет ли ошибок в HTML/CSS, правильно ли сайт отображается на всех устройствах, есть ли логика в навигации и разметка страниц, понятна ли она поисковым роботам
• насколько быстро и легко можно менять структуру сайта, тексты, блоки, формы, кнопки, запускать A/B-тесты, пробовать новые офферы.

Дешёвая разработка почти всегда приводит к переделке. А это – двойные траты: времени, денег и нервов. Поэтому мы не делали свой сайт на коленке просто красивым. Фронтенд писали с нуля: всё, что видит и с чем взаимодействует пользователь разрабатывали вручную без использования готовых шаблонов или конструкторов.

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

Работали на собственной Darvin CMS. Особое внимание уделили интерактиву. Добавили калькулятор расчёта стоимости. Пользователь вводит параметры, сразу получает ориентир и может отправить заявку. Сейчас это один из самым кликабельных блоков.

Сделали формы под разные сценарии: от «обратного звонка» до скачивания лид-магнитов. И, конечно, тестировали. Проверяли всё: от поведения форм до работы калькулятора, от навигации до отображения кейсов. Искали не только баги, а что можно улучшить.

Сайт получился удобным не только для пользователя. В Darvin Digital – это рабочий инструмент, с которым постоянно взаимодействует команда: маркетологи, копирайтеры, оптимизаторы. Поэтому уже на этапе разработки мы заложили важные «плюшки» для своих, чтобы после запуска не приходилось лезть в код ради правки блока или добавления новой услуги.

Таких решений оказалось три и каждое экономит время команде:

1. Редактирование страниц без кода. Управление всеми ключевыми элементами происходит через визуальный интерфейс. Т.е. если нужно поправить заголовок, изменить оффер или новый лендинг, разработчику не нужно менять код. Это может сделать оптимизатор. Особенно полезно для А/Б-тестов и обновлений.

2. Гибкое управление модулями. Тарифы, кейсы, формы – всё собрано в админке как самостоятельные блоки. Например, если добавляется новый тариф на SEO-продвижение, специалист просто заполняет поля, и он появляется на сайте. Без вмешательства разработчиков.

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

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

6. Запуск

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

Параллельно отслеживали и продолжаем отслеживать:

• загрузку страниц
• переходы по меню и по кейсам
• клики по калькулятору и отправку форм
• источники переходов: органика, соцсети, статьи, партнёрские ссылки
• длину сеанса и отказные страницы.

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

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

3. Результаты сотрудничества

Что у нас получилось: усилили имидж, увеличили интерес аудитории и количество лидов

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

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

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

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

Да, на обновление мы потратили 2500 часов и почти 7.5 миллионов рублей – беспрецедентный шаг, но мы осознанно пошли на него и даже спустя 3 месяца видим отдачу.

Наталья Головченко

арт-директор, Darvin Digital

«Это настолько большое изменение, что можно сказать, от прошлого Darvin Studio вообще ничего не осталось».