Детский стоматологический редизайн — 3 страницы, через черновик
Редизайн трёх страниц для детской стоматологии — 43 часа, 87 дней, поставка через черновик на Divi. Итеративная работа 5 специалистов для клиники в Seguin, TX.
Скриншоты сделаны автоматическими инструментами — некоторые элементы могли не загрузиться полностью или перекрываться. Для наиболее точного представления открыть действующий сайт →
Редизайн нескольких страниц по макетам Figma от агентства. Сначала черновик; финальная проверка принципалом; запуск только после согласования.
Клиент (конечный пользователь): Guadalupe Kids Dental — детская стоматологическая клиника, Seguin, TX
Формат сотрудничества: White-label разработка для маркетингового агентства из США
Сроки: февраль – май 2025 · ~87 дней · ~43 часа · редизайн трёх страниц по макетам Figma в продакшене
Подход к редизайну
Продакшен на Divi, три страницы перерисовываются через черновик — и на первом же проходе главной страницы изменение стиля распространяется в общий глобальный хедер, ломая все страницы на рабочем домене. Сайт откатили на предыдущий день в течение 15 минут; каждая последующая страница разрабатывалась в клонированном тестовом окружении. Работа через черновик была требованием агентства; работа в тестовой среде стала нашим — продиктованное тем, как глобальная область видимости Divi ведёт себя в продакшене детской стоматологии.
Краткий обзор
| Поле | Значение |
|---|---|
| Индустрия клиента | Медицина — Детская стоматология |
| Конечный клиент | Guadalupe Kids Dental (детская стоматологическая клиника, Seguin, TX) |
| Формат сотрудничества | White-label многостраничный редизайн для маркетингового агентства из США, специализирующегося на сайтах для локального бизнеса |
| Тип проекта | Многостраничный редизайн с переносом дизайна из Figma в Divi — сборка через черновик, публикация страницы после проверки агентства |
| Объём работ | 3 страницы — Главная, New Patients (/new-patients/), Special Needs (/special-kids/) |
| Сроки | ~87 дней (февраль – май 2025) |
| Трудозатраты | ~43 часа на все страницы и QA — сборка по дизайну · раунды QA · обновление URL и метаданных |
| Команда | 5 специалистов (разработчик · разработчик+QA · QA · PM) |
| Передача дизайна | Брифы Figma на каждую страницу (собственность агентства; URL дизайнов не раскрыты) |
| Конструктор страниц | Divi (Elegant Themes) — существующий конструктор сайта; замена не производилась |
| Технический стек | WordPress · Divi · Site Checker (xaverPRO плагин QA) |
| Режим сборки | Через черновик — каждая страница создавалась как черновик WordPress, публиковалась на целевой URL после проверки агентства |
| Сдано | Три страницы на целевых URL — / (главная), /new-patients/, /special-kids/ — проверка агентства пройдена перед каждой публикацией |
| Раунды проверки | ≈4 раунда проверки за 87 календарных дней |
| Трудозатраты по задачам | 7 внутренних задач Redmine · медиана 4 ч / P75 12 ч на задачу |
Постановка задачи
Маркетинговое агентство из США, ведущее проект Guadalupe Kids Dental — детской стоматологической клиники в Seguin, TX — привлекло нас для обновления дизайна трёх страниц по макетам Figma, которые передавались итеративно. Сайт клиники работал на Divi, и агентство чётко обозначило, что работа ведётся в его рамках, без внедрения новой зависимости от другого конструктора.
Пациенты детской стоматологии — дети; родители, записывающие их на приём, взаимодействуют с сайтом целенаправленно и по делу — запись на регулярные чистки, изучение вариантов седации, поиск страницы Special Needs для ребёнка с особыми потребностями. Каждая из перерабатываемых страниц была точкой входа для одного из этих сценариев.
Модель работы агентства на этом проекте была итеративной: сначала главная, затем New Patients, затем Special Needs — каждая сдавалась последовательно, по своему макету Figma, и утверждалась независимо перед публикацией. Работа через черновик была ожидаемой моделью поставки на всём протяжении. Сайт был в работе и принимал записи; ни одна страница не должна была публиковаться в процессе сборки, и ни одно изменение не должно было затрагивать общие глобальные компоненты — хедер, футер или глобальные стили темы — без явного подтверждения.
Задача на каждой странице была одинаковой: точно воспроизвести Figma в Divi, собрать в черновике, провести внутреннее QA на большом экране и мобильных устройствах, передать на проверку агентству и опубликовать только после утверждения. Оставаться вне контура коммуникации с конечным клиентом на всём протяжении.
Контекст рисков. Divi — это page builder с глобальной областью видимости: его настройки темы и система глобальных модулей означают, что стиль, применённый при редактировании страницы, может незаметно унаследоваться в хедер или футер сайта — на всех страницах рабочего домена. В отличие от архитектуры Elementor с областью виджетов, глобальные контейнеры Divi всегда соседствуют с холстом страницы. На первом проходе сборки главной страницы правило стиля неожиданно распространилось в общий хедер, вызвав поломку вёрстки на всём сайте.
Команда заметила это до передачи агентству, откатила сайт на бекап предыдущего дня и пересобрала главную страницу в клонированном тестовом окружении. Все последующие редизайны страниц на этом проекте выполнялись сначала на тестовом клоне, с проверкой глобальной области видимости до того, как какие-либо изменения касались основного сайта. Гибкость Divi реальна; так же реальна и поверхность атаки, которую она открывает, когда дисциплина сборки не откалибрована под неё.
Как мы это сделали
1. Пересборка главной страницы на клонированном тестовом окружении после инцидента с глобальной областью видимости. Первый проход сборки обновлённой главной страницы выполнялся непосредственно в продакшене через Divi. В ходе этого прохода изменение стиля модуля Divi распространилось в общий глобальный хедер — затронув все страницы рабочего домена, а не только перерабатываемую главную.
Сайт был откачен на подтверждённо чистый бекап. С этого момента сборка главной страницы продолжилась на клонированном тестовом окружении, а продакшен оставался нетронутым до полной проверки редизайна в изоляции. Готовый черновик главной страницы затем был перенесён в продакшен и опубликован только после того, как проверка агентства подтвердила его чистоту.
Это была не мелкая корректировка процесса — она определила подход к оставшимся двум страницам. Каждая задача редизайна на этом проекте выполнялась по принципу сборки на тестовой среде, с глобальной областью видимости Divi, рассматриваемой как ограничение, а не допущение.
2. Страница New Patients — сборка черновика по Figma, адаптивная вёрстка без мобильных макетов. Страница New Patients (/new-patients/) была второй задачей редизайна со своим собственным брифом Figma. В брифе не было макетов для мобильных устройств; адаптивная вёрстка выполнялась по стандартным контрольным точкам Divi и стандартам агентства для мобильных макетов.
Страница создавалась как черновик WordPress и была доступна только вошедшим администраторам в процессе разработки. QA на большом экране и планшете выявило несколько корректировок вёрстки — масштаб заголовков, размер кнопок и обработку контрольной точки 1024 px — до передачи страницы на проверку агентству. Агентство проверило черновик и утвердило его к публикации с небольшими финальными правками перед запуском.
3. Страница Special Needs — итеративная сборка с изоляцией черновика и дисциплиной публикации URL. Редизайн страницы Special Needs имел особое ограничение: у клиники уже была живая страница по другому slug (/special-needs-new/ в процессе разработки, заменяющая живую /special-kids/). Черновик разработки хранился на отдельном slug на всём протяжении сборки и QA — это намеренный шаблон изоляции черновика, чтобы переработанная страница и существующая живая страница могли сосуществовать без нарушения работы последней.
После прохождения QA задача публикации включала установку URL новой страницы как /special-kids/, перевод старой страницы в статус черновика и подтверждение соответствия Title, Description и slug спецификации. Попытка обновления Divi Builder в ходе этой задачи наткнулась на шлюз аутентификации Elegant Themes — двухфакторная аутентификация для новых устройств заблокировала обновление, потребовав разрешения внешними средствами. Страница была опубликована после подтверждения корректности URL и метаданных.
4. Координированное QA на разных форматах экрана конструктора страниц и мобильных устройств. Для каждой страницы создавалась отдельная задача QA (отдельно от задачи сборки), назначенная на Павел Сажин. QA охватывало форматы большого экрана и мобильных устройств, рендеринг модулей Divi на стандартных контрольных точках, а также функциональность форм и загружаемых ресурсов — страница Special Needs содержала загружаемые формы, перенесённые с предыдущей версии страницы.
Рендеринг для мобильных устройств получил дополнительное внимание на каждой странице, учитывая, что родители, записывающие детей к стоматологу, активно пользуются мобильными устройствами. Для каждой страницы раунды QA проводились до передачи агентству; правки после проверки агентства отслеживались через задачу сборки.
Сборка главной страницы в продакшене привела к тому, что общий хедер впитал стили с холста новой страницы — все страницы домена сломались. У нас было 15 минут, мы откатились на предыдущий день и пересобрали в клонированном окружении. Протокол работы в тестовой среде, который покрывал все последующие страницы на этом проекте, появился именно из-за этого инцидента.
Контроль качества
Проход сборки главной страницы на этом проекте выявил регрессию в продакшене до того, как хотя бы одна страница дошла до агентства — изменение стиля модуля Divi распространилось в общий глобальный хедер, загрязнив все страницы рабочего домена; сайт был откачен на бекап предыдущего дня, и все последующие сборки выполнялись в клонированном тестовом окружении для сдерживания глобальной области видимости Divi.
QA перед передачей проводилось через Site Checker — см. наш подход к QA по категориям и принципу нулевых ошибок. Собственный слой QA агентства — их инструменты, их процесс — выполнялся после передачи и фиксировал замечания в общую очередь для нашего цикла исправлений до их согласования.
Результаты
| Метрика | Результат |
|---|---|
| Страниц переработано | 3 — Главная, New Patients (/new-patients/), Special Needs (/special-kids/) |
| Режим сборки | Через черновик — каждая страница создавалась как черновик WordPress, публиковалась только после проверки агентства |
| Инцидент глобальной области видимости | Поломка хедера на всём сайте обнаружена до передачи; сайт откачен; последующая работа — в тестовой среде |
| Дисциплина публикации URL | URL /special-kids/ и метаданные подтверждены перед публикацией; старая страница переведена в черновик |
| Покрытие QA | Большой экран + мобильные форматы экрана на всех трёх страницах; планшетная контрольная точка (1024 px) отдельно проработана на New Patients |
| Сроки | ~87 дней (февраль – май 2025) — итеративный, постраничный ритм поставки |
| Трудозатраты | ~43 часа на сборку, QA и задачи по URL/метаданным |
| Команда | 5 специалистов — без отдельного аналитика, без лида по дизайну (собственность агентства) |
| Статус сайта, проверено 2026-04 | seguinkidsdental.com жив, HTTP 200 |
Процесс
| Этап | Длительность | Результат |
|---|---|---|
| Получение Figma-брифа главной + оценка | ~1 неделя (фев 2025) | Дизайн рассмотрен; Divi подтверждён как существующий конструктор; ограничения глобальной области видимости отмечены |
| Сборка главной — пересборка в тестовом окружении | ~2 недели (фев–мар 2025) | Главная собрана на тестовом клоне после инцидента с глобальной областью видимости; выкачена в продакшен после отката; проверка агентства в ожидании |
| Сборка New Patients + QA | ~2 недели (апр 2025) | New Patients собрана как черновик, адаптивное QA завершено, передано агентству; незначительные правки; опубликована |
| Сборка Special Needs + QA | ~2 недели (апр–май 2025) | Special Needs собрана как черновик на отдельном slug, QA завершено; проблема аутентификации Divi решена внешними средствами |
| Публикация URL + финальные метаданные | ~1 неделя (май 2025) | URL /special-kids/ назначен, старая страница переведена в черновик, Title/Description подтверждены; проект закрыт |
Этапы на этом проекте последовательны — каждая страница завершалась и утверждалась до начала следующей. Итеративный ритм был явным предпочтением агентства для этого клиента.
Команда
Команда проекта
- Никита Тумашевич — сборка главной страницы (Divi, пересборка в тестовом окружении), сборка New Patients, сборка Special Needs
- Павел Сажин — QA всех трёх страниц (большой экран и мобильные, рендеринг модулей Divi, функциональность форм)
- Анна Полунина — поддержка реализации и QA
- Людмила Травкина — реализация редизайна главной (первый проход и пересборка); адаптивная вёрстка New Patients
- Антон Херсун, xaverPRO — руководитель проекта (оценка, коммуникация с агентством, координация аутентификации Divi, финальное подписание публикации)
Управление проектом, дизайн и коммуникация с клиентом оставались на стороне агентства-партнёра на всём протяжении. Наша команда была невидима для конечного клиента. Все дизайн-решения — макеты Figma, контент страниц, загружаемые ресурсы на странице Special Needs — были ответственностью агентства. Мы получали бриф Figma, реализовывали его в Divi и возвращали черновик на проверку.
Агентствам, заказывающим редизайн WordPress
Редизайн сайта детской стоматологической сети — не смена оформления: он меняет визуальное лицо услуг, по которым родители выбирают клинику. У этой сети — несколько филиалов с единым порталом; у других — одна клиника с индивидуальным подходом. Скрытые риски для агентства: новые макеты не соответствуют реальной длине описаний — карточки услуг разъедутся на сетке. Если подрядчик не пропишет редиректы, старые URL начнут отдавать 404. Страницы акций останутся в старых шаблонах — сайт будет выглядеть недоработанным.
Задавайте подрядчику не вопрос «перерисуете ли все страницы?», а вопрос «как именно вы сохраните URL-структуру и позиции, когда дизайн уже сменился?»
Пришлите текущий перечень URL и макеты. Мы пройдёмся по новому каркасу, проверим, не порождает ли дизайн скрытых разрывов, сверим контентные блоки и вернём фиксированную смету в часах. Аудит без оплаты, ответ в течение рабочего дня.
У вас ещё нет ТЗ? Пришлите описание в один абзац — мы вернёмся с вопросами, которые стоит задать. Прислать описание →
черновик страницы
Этот кейс — многостраничный. Та же методология применима к одностраничному редизайну.
Редизайн главной страницы и многостраничный редизайн используют одну и ту же базовую методологию — Figma-led, соответствие инструментальной среде, сначала черновик. Масштаб различается; методология — нет.