Редизайн главной страницы юридического сайта — Adobe XD в WordPress
Редизайн главной страницы из Adobe XD в WordPress для юридической практики из США — 10 задач, ~59 часов по двум смежным практикам, ~4 месяца календарного срока.
Скриншоты сделаны автоматическими инструментами — некоторые элементы могли не загрузиться полностью или перекрываться. Для наиболее точного представления открыть действующий сайт →
Разработать новую главную страницу по макетам Figma от агентства. Передать в виде черновика. Принять один раунд проверки принципалом. Запуск только после согласования.
Клиент (конечный пользователь): Rose Knows Law — юридическая практика в США
Формат сотрудничества: White-label разработка для маркетингового агентства из США
Сроки: ноябрь 2024 – март 2025 · ~4 месяца · ~59 часов по 10 задачам (две смежные юридические практики)
Подход к редизайну
Один макет в Adobe XD для главной страницы юридической практики из США, расширенный на две смежные практики под одним агентством — Dale Rose Law и Rose Knows Law — каждая на собственной тестовой среде WP Engine, каждая проверена и утверждена отдельно перед публикацией. В задачу входил редизайн главной страницы с последующей адаптацией цветовой палитры и шрифтов для всего сайта; ограничение по контенту на страницах услуг Dale Rose, привязанное к конкретному местоположению, было передано агентству — мы не стали перезаписывать его без согласования.
Краткий обзор
| Параметр | Значение |
|---|---|
| Отрасль клиента | Юридические услуги |
| Клиент | Rose Knows Law (юридическая практика в США) |
| Формат сотрудничества | White-label редизайн главной страницы и сопутствующая разработка для маркетингового агентства из США, специализирующегося на сайтах для локального бизнеса |
| Тип проекта | Редизайн главной страницы из Adobe XD в WordPress — сборка на тестовой среде, публикация после утверждения агентством; плюс изменения меню и доработки очереди задач для той же практики |
| Объём работ | 1 редизайн главной страницы — полный редизайн по макету Adobe XD агентства, сборка в WordPress на тестовой среде, запуск после утверждения агентством; плюс 9 сопутствующих задач: навигация меню, доработки очереди задач, контентные страницы и обновления WordPress для Rose Knows Law и смежной практики (Dale Rose Law) под тем же агентством |
| Срок | ~4 месяца (ноя 2024 – мар 2025), в ритме агентства |
| Затраты | ~59 часов — ~40 ч редизайн главной (Dale Rose Law) · ~13 ч изменения Rose Knows Law (меню, очередь задач, редизайн главной, дополнительные страницы) · ~6 ч управление и обновления |
| Команда | 5 специалистов (разработчик + QA + руководитель проекта) |
| Передача дизайна | Макет Adobe XD (собственность агентства; URL дизайна не раскрывается) — утверждённое ТЗ явно требовало применить новый дизайн к существующему сайту |
| Технологии | WordPress · Elementor · Gravity Forms · Rank Math SEO · WP Engine · Site Checker (xaverPRO QA плагин) |
| Режим сборки | Сборка на тестовой среде — новая главная страница собрана на тестовой среде WP Engine параллельно с работающим сайтом, без промежуточной публикации |
| Результат | Редизайн главной страницы сдан по спецификации, обновлена навигация меню, доработана очередь задач, добавлены контентные страницы, сайт опубликован на roseknowslaw.com |
| Раунды проверки | ≈8 раундов проверки за 120 дней |
| Затраты на задачу | 10 внутренних задач Redmine · медиана 4 ч / P75 5 ч на задачу |
Постановка задачи
Маркетинговое агентство из США, нанятое юридической практикой Rose Knows Law, искало партнёра-разработчика для редизайна главной страницы и выполнения ряда сопутствующих изменений. Задача поступила в двух потоках: редизайн главной страницы для смежной юридической практики (Dale Rose Law) на основе утверждённого макета Adobe XD и набор текущих изменений для самой Rose Knows Law — улучшения навигации меню, редизайн главной страницы, доработка очереди задач и дополнительные страницы.
Явные ограничения: редизайн главной страницы сначала собирается на тестовой среде и не публикуется до проверки и утверждения агентством; изменения навигации меню должны были корректно работать на большом экране и мобильных устройствах без нарушения существующей структуры сайта.
На смежной практике (Dale Rose Law) проявилось ограничение: старый контент страниц услуг был написан специально для одного местоположения (McKinney) и не мог быть автоматически адаптирован для отображения по нескольким регионам в рамках существующей архитектуры шаблонов — тексты старого сайта были привязаны к конкретному адресу на уровне содержимого страниц, а не таксономии. Мы передали архитектурное ограничение агентству, вместо того чтобы переписывать контент за рамками ТЗ.
Задача была сформулирована лаконично: воспроизвести Adobe XD в WordPress/Elementor; сдать сборку на тестовой среде; доработать очередь задач; обновить навигацию; добавить контентные страницы по запросу; не выходить на прямой контакт с конечным клиентом на всём протяжении проекта.
Контекст рисков. Главная страница юридической практики несёт более высокую цену ошибки, чем большинство сайтов локального бизнеса. Каждый визуальный элемент на экране — имена адвокатов, направления практики, контактные призывы к действию — соседствует с юридически чувствительным материалом. Редизайн никогда не публиковался до тех пор, пока агентство не проверило сборку на тестовой среде; в каждый момент разработки работающая главная страница была либо неизменённым оригиналом, либо полностью проверенной новой версией, но никогда — недоработанным гибридом.
Сборка на тестовой среде — не «красивый процесс ради галочки» на таком типе проектов; это операционный барьер, защищающий агентство от инцидента на работающем сайте юридического клиента.
Работа по смежной практике (Dale Rose Law) следовала той же модели сборки на тестовой среде: 40-часовой редизайн главной страницы на отдельной тестовой среде; агентство проверило сборку и опубликовало её только после утверждения. У обеих практик было одно агентство и одна команда разработки, но каждая имела собственную тестовую среду и собственный этап проверки.
Как мы это сделали
1. Из Adobe XD в WordPress, сборка на тестовой среде. Главная страница была полностью собрана в WordPress/Elementor по утверждённым макетам Adobe XD — hero, секции услуг, профили адвокатов, контактный блок, футер. Поскольку Elementor уже был установлен на сайте, сборка вписалась в существующую тему и глобальную систему стилей без внедрения нового конструктора страниц.
2. Сборка на тестовой среде, не в продакшене. Новая главная страница была развёрнута на тестовой среде WP Engine параллельно с существующей рабочей версией. Каждый цикл QA проводился на тестовой среде до запуска. Это операционная мера предосторожности, специально запрошенная агентством для данного типа проекта и отрасли клиента — юридическая практика не может позволить себе полусобранную главную страницу, попавшую в публичный доступ в середине QA.
Принцип здесь прост: при редизайне главной страницы юридического сайта команда разработки по умолчанию работает через тестовую среду. Сайт стоматологии или ресторана может позволить себе запуск без полной проверки; юридическая фирма — нет.
3. Редизайн навигации меню — большой экран и мобильные устройства. Отдельная задача была посвящена структуре навигации: увеличение размера текста на большом экране, внедрение выпадающих меню на мобильных устройствах и обеспечение практичности меню на обоих типах экранов.
Разработчик предложил всплывающее боковое меню вместо стандартной горизонтальной панели, поскольку набор юридических направлений охватывал несколько регионов и стандартный шаблон выходил за границы экрана; агентство подтвердило подход до реализации. Мобильное выпадающее меню было реализовано отдельно в виде переключателя, а не постоянной панели в стиле большого экрана — глубина навигации сайта делала стандартный подход непрактичным для маленького экрана.
4. Доработка очереди и контентные страницы. Агентство передало нам список вопросов в Google Sheets для Rose Knows Law. Команда разобрала список, провела триаж и закрыла каждый пункт через отслеживаемые задачи Redmine. Отдельной задачей была добавлена страница биографии адвоката для смежной практики, используя существующие изображения сайта и предоставленные тексты.
5. Внутренний QA перед передачей агентству. QA проводился на больших и мобильных экранах, что позволило выявить типичные артефакты переноса из XD в Elementor (поведение отступов, цели ссылок, подключение форм, адаптивность меню). Затем агентство проверило сборку на тестовой среде и дало финальные замечания перед публикацией.
Старые тексты страниц услуг смежной практики были написаны для одного города — McKinney — и новый дизайн не устранял это ограничение автоматически. Мы передали структурное ограничение агентству, не переписывая контент за рамками ТЗ; визуальный редизайн был сдан в чистом виде, а решение по текстам осталось за агентством.
Контроль качества
Сборка главной страницы Dale Rose на тестовой среде WP Engine (задача #201) была переведена во внутренний статус «Проверено, на отправку» 26 февраля 2025 до того, как агентство увидело сборку; работающая главная страница оставалась нетронутой на всём протяжении работ, и задача была закрыта только после подтверждения агентством.
Предварительный QA проводился через Site Checker — см. наш подход к QA по категориям и принципу нулевых ошибок. Собственный QA агентства — их инструменты, их процессы — выполнялся после передачи и фиксировал замечания в общую очередь задач для нашего цикла исправлений до момента утверждения.
Результаты
| Метрика | Результат |
|---|---|
| Редизайн главной страницы | Сдан — Adobe XD реализован в Elementor, заменив предыдущую главную страницу (Dale Rose Law) |
| Редизайн главной страницы (Rose Knows Law) | Сдан — главная страница переработана по ТЗ агентства |
| Режим сборки | Сборка на тестовой среде — новая главная страница собрана на тестовой среде WP Engine параллельно с работающим сайтом, без промежуточной публикации |
| Навигация меню | Переработана — увеличен размер текста на большом экране, реализованы мобильные выпадающие списки, применён шаблон меню для большого количества пунктов |
| Доработка очереди | Список вопросов из Google Sheets разобран и закрыт через отслеживаемые задачи Redmine |
| Контентные страницы | Добавлена 1 страница биографии адвоката (Adam Rose) для смежной практики |
| Обновления WordPress | 2 задачи обновлений закрыты |
| Срок | ~4 месяца (ноя 2024 – мар 2025), сдано в темпе агентства |
| Затраты | ~59 часов — ~40 ч редизайн главной · ~13 ч изменения Rose Knows Law · ~6 ч управление и обновления |
| Команда | 4 специалиста — без отдельного аналитика, без дизайн-лида (дизайн на стороне агентства), без SEO-лида (миграция не требовалась) |
| Статус сайта | Работает, открывается по адресу https://roseknowslaw.com/ — проверено в апреле 2026. |
Результат, если кратко: макет агентства в Adobe XD был реализован в Elementor на тестовой среде, прошёл внутреннюю проверку и проверку агентства, и был опубликован — вместе с обновлением навигации меню, доработкой очереди задач и добавлением контентных страниц — за ~4 месяца и около 59 часов работы.
Процесс
| Этап | Длительность | Результат |
|---|---|---|
| ТЗ и оценка | ~1 неделя | Adobe XD проанализирован, Elementor подтверждён, согласована модель сборки на тестовой среде |
| Сборка главной (тестовая среда) | ~3 недели | Полная главная страница реализована в Elementor на тестовой среде WP Engine (Dale Rose Law) |
| Изменения Rose Knows Law | ~6 недель | Обновлена навигация меню, доработана очередь задач, выполнен редизайн главной, добавлены страницы |
| Внутренний QA | ~1 неделя | Проверка на больших и мобильных экранах; мелкие дефекты найдены и исправлены |
| Запуск | ~1 неделя | Страницы опубликованы; выполнена проверка после запуска |
Этапы пересекаются — изменения Rose Knows Law велись параллельно со сборкой главной Dale Rose Law, а доработка очереди задач шла одновременно с редизайном навигации. Это характерно для многопоточного проекта, где цикл QA идёт непрерывно, а не строго последовательными фазами.
Команда
Команда проекта
- Никита Тумашевич — сборка главной страницы в Elementor по Adobe XD; редизайн навигации меню
- Павел Сажин — управление проектом и QA-итерации
- Анна Полунина — поддержка реализации и QA
- Владимир Козлов — доработка очереди задач и дополнительные страницы для Rose Knows Law
- Антон Херсун, xaverPRO — руководитель проекта (оценка, коммуникация с агентством, утверждение, координация QA)
Управление проектом со стороны агентства, дизайн и коммуникация с клиентом оставались за партнёрским агентством на всём протяжении работ. Наша команда была невидима для конечного клиента.
Агентствам, заказывающим редизайн WordPress
Редизайн сайта юридической практики несёт риск потери доверия и позиций — каждая страница включает юридически значимые данные, которые не должны измениться. У одной практики — персональные страницы адвокатов с фотографиями; у других — справочный портал с разделами практик и фильтрацией. Неаккуратный редизайн приведёт к тому, что новые раскладки сломают карточки, слаги изменятся без редиректов, а контактные сайдбары на архивных страницах останутся в старой теме.
Подрядчику стоит задавать не вопрос «переделаете ли главную?», а вопрос «как именно вы сохраните URL-структуру и индексацию при замене визуальных компонентов?»
Пришлите макеты ключевых страниц или текущий перечень URL. Мы проверим каждый URL на совместимость с новыми компонентами, найдём расхождения и вернём фиксированную смету в часах. Аудит без оплаты, ответ в течение рабочего дня.
У вас ещё нет ТЗ? Пришлите описание в один абзац — мы вернёмся с вопросами, которые стоит задать. Прислать описание →
черновик страницы
Этот кейс — одностраничный. Та же методология масштабируется на многостраничный редизайн.
Редизайн главной страницы и многостраничный редизайн используют одну и ту же базовую методологию — Figma-led, соответствие инструментальной среде, сначала черновик. Масштаб различается; методология — нет.