How we mapped a decade of pages onto a component library, then migrated section by section while the marketing team kept publishing.
Northbay came to us with a site nobody wanted to touch: eleven years of pages, four generations of page builders, and a marketing team publishing twice a week. Stopping releases for a rebuild was never an option.
Starting with an audit, not a design
We exported every URL and grouped pages by the template they actually used, not by the menu they lived under. Nine hundred pages collapsed into thirty-one real layouts, and eleven of those accounted for 92% of traffic. That number decided the whole project: we only had to design eleven things well.
The rest were one-off landing pages from old campaigns. Half of them had not been visited in a year, so we archived them rather than migrating them.
Blocks with constraints built in
Every block ships with a fixed set of options: two spacing steps, three background tones, one image ratio. Editors cannot enter arbitrary values, which sounds restrictive until you see what eleven years of free-form padding does to a brand.
- Spacing and colour come from tokens, never from the editor.
- Images are cropped server-side to the ratio the block declares.
- Every block has a documented empty state, so a half-filled page still looks deliberate.
Constraints are documentation that cannot be ignored. A block that only allows the right answer needs no style guide.
Migrating section by section
The new templates went live behind a per-section flag. Each week we moved one branch of the site over, watched the numbers for three days, and either kept going or rolled back that branch alone. Publishing never stopped, and no release window was ever required.
Two rollbacks happened. Both were caused by legacy shortcodes inside body copy, which we then handled with a compatibility layer rather than editing 400 pages by hand.
What we would do again
Audit before design, archive without sentiment, and ship behind flags. The unglamorous part of the project — counting templates — is what made the rest predictable.