[ Case study ]
WSJ Homepage Replatform & Section Fronts
The WSJ homepage and section fronts were re-platformed onto a modern, component-driven foundation. I defined the front-page composition system, turning hand-tuned editorial layouts into reusable modules and story-card compositions that snap together and carry their own responsive behaviour from desktop to mobile. Each module encodes WSJ's density and hierarchy, so editors compose within guardrails and editorial freedom cannot break the brand.
- Client
- Dow Jones - The Wall Street Journal
- Role
- UX Architect
- Year
- 2023
- Disciplines
- Design Systems, UX Design
2
Replatformed: homepage and section fronts
[ Information architecture ]
Homepage
- Lead story
- Modules
Section fronts
- Markets
- Opinion
- Business
Components
- Story cards
- Lists
- Media
Confidentiality notice
This work spans active platform strategy, shared AI capabilities, and multiple product surfaces. To respect that, this case study stays intentionally high-level, focusing on the cross-brand design problem, platform principles, and reusable outcomes rather than brand-specific implementation details.
Re-platforming the WSJ homepage and section fronts onto a modern, component-driven composition system across desktop and mobile.
A front page is a system, not a layout. Give editors freedom without breaking the WSJ brand.
Overview
The WSJ homepage and section fronts were being re-platformed onto a modern, component-driven foundation. The design challenge was to turn a hand-tuned editorial front page into a flexible system of reusable compositions, one that editors could arrange freely while preserving the hierarchy, density, and authority readers expect from the Journal.
I contributed across UX architecture and UX design, defining the front-page composition system and producing handoff for desktop and mobile, including the next-generation section fronts.
The project
Replatform the homepage and section fronts onto a reusable composition system that is responsive by default, consistent across the homepage and every section, and flexible enough for daily editorial control.
I worked across UXA and UXD to define the front-page modules and story-card compositions, specify their responsive behaviour, and hand off desktop and mobile fronts including the next-generation section fronts.
A composition library that replaces bespoke layouts with reusable, responsive modules, giving editors freedom while keeping every front coherent and on-brand.
The challenge of a flagship front
Designing a composition library
A set of front-page modules and story-card compositions that snap together predictably, replacing bespoke layouts with reusable parts.
Each module encodes WSJ's density and emphasis, so editorial freedom cannot break the brand. The system carries the hierarchy rather than relying on every editor to recreate it.
Modules carry their own responsive behaviour, so a front built once adapts from desktop to mobile, and the same building blocks power the homepage and every section front.
Delivery and handoff
Section fronts were brought onto the same system and pushed forward in a next-generation design, then specified for engineering, covering module behaviour, responsive rules, and editorial composition patterns.
The composition library was framed so editors compose within guardrails, keeping fronts coherent at scale rather than drifting over time.
A system that lasts
Re-platforming a flagship front page is as much governance as visual design. The lasting value was not a prettier homepage, it was a system that lets editors move fast for years while keeping every front unmistakably WSJ.
[ Protected layer ]
The full case study is available on request.
High-fidelity screens, information architecture and the detailed process for this enterprise project are shared under NDA. Enter the access password, or request access and I will share the full walkthrough.