Редизайн главной страницы для юридической фирмы — Figma в Elementor Pro
Редизайн главной страницы юридической фирмы: черновик до публикации, Figma в Elementor Pro, 2 раунда QA плюс проверка руководителя агентства, 31 день.
Скриншоты сделаны автоматическими инструментами — некоторые элементы могли не загрузиться полностью или перекрываться. Для наиболее точного представления открыть действующий сайт →
Разработать новую главную страницу по макетам Figma от агентства. Передать в виде черновика. Принять один раунд проверки принципалом. Запуск только после согласования.
Клиент (конечный пользователь): The Stein Law Group — юридическая практика по делам о личном ущербе, обслуживающая NY metro (NYC, Long Island, Westchester, Nassau, Rockland, Northern NJ)
Формат сотрудничества: White-label разработка для маркетингового агентства из США
Сроки: ноябрь – декабрь 2025 · 31 день · ~15 ч на разработку, QA и один раунд после проверки
Подход к редизайну
Редизайн главной страницы из Figma в Elementor Pro на сайте с WPBakery — создан в черновике, а не выводился в продакшен до согласования руководителем агентства. Бриф был однозначен: Elementor Pro, разработка в черновике. Напряжение возникло, когда новый глобальный хедер и футер Elementor были применены ко всему сайту: Elementor подавил стили WPBakery и ненадолго положил сайт. Резервная копия была восстановлена, конфликт устранён, и глобальные хедер и футер были распространены корректно — до проверки агентством.
Краткий обзор
| Поле | Значение |
|---|---|
| Отрасль конечного клиента | Юридические услуги — личный ущерб |
| Конечный клиент | The Stein Law Group (юридическая практика по делам о личном ущербе, NY metro) |
| Формат сотрудничества | White-label редизайн главной страницы для маркетингового агентства из США, специализирующегося на сайтах для локального бизнеса |
| Тип проекта | Редизайн главной страницы Figma в Elementor Pro — создан в черновике, выпущен после проверки руководителем агентства |
| Объём работ | 1 главная страница — полный редизайн по Figma агентства, создан в WordPress-черновике, запущен после раунда проверки руководителем агентства |
| Сроки | 31 день (20 ноя – 20 дек 2025), по графику |
| Трудозатраты | ~15 ч — ~7,7 ч разработка · ~7,7 ч QA в 2 раунда · остаток на реализацию после проверки |
| Команда | 4 специалиста (разработка + QA + руководитель проекта) |
| Передача дизайна | макет в Figma (принадлежит агентству; URL дизайна не публикуется) — в согласованном брифе явно требовались Elementor Pro и доставка в черновике |
| Технологический стек | WordPress · Elementor Pro · существующий WordPress-хостинг агентства · Site Checker (QA-плагин xaverPRO) |
| Режим разработки | Сначала черновик — новая главная страница создавалась как WordPress-черновик параллельно с продакшеном, без публичного показа в процессе |
| Выполнено | Редизайн главной страницы передан по спецификации, один раунд замечаний руководителя агентства реализован и запущен, сайт работает на thesteinlawgroup.com |
| Раунды проверки | ≈3 раунда проверки за 31 календарный день |
| Трудозатраты на задачу | 13 внутренних задач Redmine · медиана 22 мин / P75 1,2 ч на задачу |
Постановка задачи
Маркетинговое агентство из США, работающее с The Stein Law Group — юридической практикой по делам о личном ущербе в NY metro — передало нам новый дизайн главной страницы в Figma с двумя явными ограничениями: реализация должна быть в Elementor Pro (уже установлен на сайте клиента), а разработка должна выполняться в черновике, а не на рабочей главной странице.
Обоснование было прямым. Юридические фирмы крайне чувствительны к изменениям в продакшене — непреднамеренные правки в формулировках исков, описании результатов дел или юридических дисклеймерах могут создать юридические риски и репутационный ущерб, с которыми стоматологическая практика не сталкивается. Агентство хотело, чтобы дизайн был создан параллельно с продакшеном, проверен внутри, а затем ещё раз проверен руководителем агентства — прежде чем произойдёт какой-либо переход в продакшен.
Задача была чёткой: воспроизвести Figma в Elementor Pro, передать черновик, принять раунд замечаний от руководителя агентства по итогам финальной проверки, выпустить страницу только после её подписания. Оставаться вне прямого контакта с конечным клиентом на протяжении всего проекта.
Контекст рисков. На главной странице юридической фирмы цена каждого пикселя необычно высока. Каждое утверждение на экране — описание результатов дел, язык юрисдикции, дисклеймеры о рекламе адвокатских услуг — несёт юридическую нагрузку.
Редизайн ни разу не выводился в продакшен, пока руководитель агентства не проверил и не подписал его; в каждый момент во время разработки на действующем сайте была либо неизменённая оригинальная версия, либо полностью проверенная новая — никогда наполовину готовый гибрид. Доставка в черновике — не процессная условность в данном типе проекта, а контрактно значимый шлюз, защищающий агентство от инцидента в продакшене постоянного юридического клиента.
Как мы это сделали
1. Figma в Elementor Pro, сначала черновик. Главная страница была полностью создана в Elementor Pro по утверждённым макетам Figma — hero-блок, разделы услуг, отзывы, призыв к действию с контактами, футер. Поскольку Elementor Pro уже был установлен на сайте, разработка встроилась в существующую тему и систему глобальных стилей без добавления нового конструктора страниц.
2. В черновике, не в продакшене. Новая главная страница была размещена как WordPress-черновик параллельно с действующей главной страницей. Каждый QA-проход выполнялся против черновика до момента запуска. Это операционная защитная мера, специально запрошенная агентством для данного типа проекта и данной отрасли клиента — юридическая практика не может позволить себе, чтобы наполовину готовая главная страница вышла в эфир в середине QA.
Принцип прост: при редизайне главной страницы юридической фирмы команда разработки по умолчанию работает через черновик. Стоматологический или ресторанный сайт терпит деплой без полной проверки; юридическая фирма — нет.
3. Два внутренних раунда QA до передачи агентству. QA провели трое разработчиков — Павел, Тимур и Антон — против большого экрана и мобильных устройств, поймав обычные артефакты перевода Figma в Elementor (Elementor Pro отображает некоторые отступы иначе, чем автоматическая компоновка Figma; целевые страницы ссылок требовали проверки; блок формы требовал подключения Gravity Forms).
4. Раунд после проверки — замечания руководителя, затем запуск. После проверки со стороны агентства руководитель передала конкретный набор замечаний по черновику. Эти замечания были реализованы в отслеживаемой задаче-продолжении («Implement Linda’s Comment & Launch Page») и страница была опубликована в продакшене после финального согласования с агентством. Дополнительный раунд QA с тремя разработчиками проверил состояние после запуска.
Главным источником напряжения был конфликт конструкторов страниц: применение нового глобального хедера и футера Elementor Pro ко всему сайту подавило стили WPBakery и ненадолго положило продакшен. Резервная копия была немедленно восстановлена, конфликт устранён в изоляции, и распространение запущено повторно — на этот раз корректно. Поскольку новая главная страница ни разу не находилась в состоянии черновика на наполовину работающем сайте, инцидент был разрешён до того, как агентство его увидело.
Контроль качества
QA перед передачей выявил, что черновик новой главной страницы был случайно опубликован — нарушение явного требования брифа держать страницу в WordPress-черновике и закрытой для индексирования — и страница была немедленно возвращена в статус черновика до проверки агентством; виджет отзывов Trustindex также сломал вёрстку страницы в процессе разработки и был исправлен в том же QA-проходе.
QA перед передачей выполнялся через Site Checker — категории и принцип нулевого допуска по сбоям описаны в нашей QA-методике. QA-слой агентства — их инструменты, их процесс — запускался после передачи и вносил оставшиеся вопросы в общую очередь задач для нашего цикла исправлений вплоть до согласования с агентством.
Результаты
| Метрика | Итог |
|---|---|
| Редизайн главной страницы | Выполнен — Figma реализована в Elementor Pro, заменив предыдущую главную страницу |
| Режим разработки | Сначала черновик — новая главная страница создана как WordPress-черновик параллельно с продакшеном, без публичного показа в процессе |
| Раунды QA | 2 внутренних + 1 после запуска — Павел, Тимур и Антон прошли большой экран + мобильные устройства в каждом раунде |
| Проверка после сдачи | 1 раунд — замечания руководителя реализованы в задаче «Implement Linda’s Comment & Launch Page»; запущено после согласования с агентством |
| Сроки | 31 день (20 ноя – 20 дек 2025), выполнено по графику |
| Трудозатраты | ~15 ч — примерно поровну разработка и QA, характерный профиль для редизайна одной страницы |
| Команда | 4 специалиста — без отдельного аналитика, без дизайн-лида (принадлежит агентству), без SEO-лида (объём миграции отсутствует) |
| Статус сайта | Работает, открывается по адресу https://thesteinlawgroup.com/ — проверено в апреле 2026. |
Итог, без лишних слов: Figma агентства реализована в Elementor Pro в черновике, проверена дважды внутренней командой, доработана один раз по замечаниям руководителя агентства и выпущена в продакшен — всё это за 31 календарный день и около 15 часов работы.
Процесс
| Фаза | Продолжительность | Результат |
|---|---|---|
| Бриф и оценка | ~2 дня | Figma проверена, Elementor Pro подтверждён, модель доставки в черновике согласована |
| Разработка главной страницы (черновик) | ~1 неделя | Полная главная страница реализована в Elementor Pro в WordPress-черновике |
| Внутренний раунд QA 1 | ~2 дня | Павел + Тимур + Антон против большого экрана + мобильных устройств; артефакты зафиксированы |
| Проверка после сдачи — замечания руководителя | ~1 неделя | Замечания руководителя агентства зафиксированы; задача на реализацию открыта и закрыта |
| Запуск + раунд QA 2 | ~1 неделя | Страница опубликована в продакшене; QA после запуска с тремя разработчиками закрыт |
Фазы пересекаются — QA начался до того, как черновик был функционально завершён, а раунд проверки после сдачи был открыт в тот же день, когда закрылся первый внутренний QA. Это характерно для небольших редизайнов, где QA-цикл работает непрерывно, а не в отдельной фазе.
Команда
Команда проекта
- Никита Тумашевич — разработка главной страницы в Elementor Pro по Figma
- Павел Сажин — QA в обоих раундах и поддержка реализации после проверки
- Тимур Арбаев — QA в обоих раундах и поддержка реализации после проверки
- Антон Херсун, xaverPRO — руководитель проекта (оценка, коммуникация с агентством, координация после проверки, согласование)
Управление проектом, дизайн и коммуникация с клиентом со стороны агентства оставались за партнёрским агентством на протяжении всего проекта. Наша команда оставалась невидимой для конечного клиента. Замечания руководителя агентства по итогам проверки были переданы нам, реализованы и возвращены на её подписание.
Агентствам, заказывающим редизайн WordPress
При редизайне сайта юридической фирмы по личным травмам каждый абзац — это рекламное утверждение, поднадзорное профильной ассоциации. У этой практики — исходы конкретных дел с дисклеймерами; у других — перечень практик и контакты. Риски для агентства-заказчика: длинные дисклеймеры разорвут новую раскладку. URL-слаги кейсов сменятся без редиректа. Отзывы потеряют структурированную разметку, отдававшую расширенные результаты в поиске.
Подрядчику стоит задавать не вопрос «обновят ли интерфейс вовремя?», а вопрос «как именно сдадут каждую страницу в черновике, сохранив URL и разметку?»
Пришлите макеты или текущий перечень URL. Мы сопоставим дизайн с реальным контентом: подсветим места, где длинные дисклеймеры разорвут сетку, найдём слаги, потеряющиеся без редиректа, и проверим, доедет ли структурированная разметка. Вернём фиксированную смету в часах. Аудит без оплаты, ответ в течение рабочего дня.
У вас ещё нет ТЗ? Пришлите описание в один абзац — мы вернёмся с вопросами, которые стоит задать. Прислать описание →
черновик страницы
Этот кейс — одностраничный. Та же методология масштабируется на многостраничный редизайн.
Редизайн главной страницы и многостраничный редизайн используют одну и ту же базовую методологию — Figma-led, соответствие инструментальной среде, сначала черновик. Масштаб различается; методология — нет.