A component-driven design system and production workflow for HPE.com's global relaunch
HPE.com needed to relaunch across the company's entire brand and corporate ecosystem in ten months. Hundreds of pages had to migrate across 44 countries and 9 languages, with no realistic path to designing an individual comp for every page — and no shared source of truth for how those pages should look once someone else built them.
As Design Lead at Publicis Sapient's San Francisco office, I managed the design production process and workflow, translating the emerging HPE Design System into a governed production pipeline that let a distributed team of designers, developers, and offshore CMS authors build pages consistently without comping each one.
HPE was fundamentally about building a production system fast enough to match an aggressive timeline, without sacrificing consistency across an enormous multi-country, multi-language site.
Role: Lead Designer
Collaborators: Client Partner, Executive Creative Director, Creative Director, Project Manager, Developers, 8 Designers, 12 Offshore CMS Authors
The relaunch had to span HPE's entire brand and corporate ecosystem on a fixed ten-month timeline, with the team split across strategy, creative, development, and offshore production.
Systems challenge
At the outset:
Hundreds of pages needed to migrate, far more than the design team could comp individually
No shared, accessible source of truth existed for visual and content rules
Developers and CMS authors had no reliable way to know what an uncomped page should look like
Production was distributed across onshore designers and a 10-person offshore authoring team
Every page had to hold up across 44 countries and 9 languages simultaneously
The team needed a system that could:
Serve as a single, evolving source of truth for the whole project
Define components tightly enough to be built consistently without a comp
Let design anticipate exactly how an uncomped page would render before it was built
Scale to hundreds of pages inside the timeline without a proportional increase in design hours
Hand off cleanly to an offshore authoring team working from documentation alone
Design system & component library
The design team began by creating an internal, entirely online style guide with the visual and content rules the whole team could work from — accessible to everyone on the project and able to evolve as the site grew.
Given the volume of pages, individual components inside the CMS had to be tightly governed rather than comped page by page. I worked closely with the development team to make sure the rules established in the design system could be implemented simply and consistently, and had to anticipate exactly how an uncomped page would look before a CMS author or developer built it, to keep the project on schedule.
The system included:
An online styleguide covering typography, color, buttons, links, forms, and iconography
A documented component library with large and small breakpoint specifications for every component
Usage rules defining which components belonged to which page templates
Structured image naming conventions for handoff to the page authoring team
Automated image resizing across breakpoints, driven by those naming conventions
A DAM serving as the site's photo archive, referenced directly by the live site
Fixed aspect ratios for images to keep responsive behavior predictable
Production workflow & handoff
The Project Manager and I used Jira to organize the team and assign pages to individual designers, who created marquee images and other visually impactful elements along with any needed photo or illustration selections.
For each page I produced simple hand-drawn wireframes and a customized copy deck — specifying component types, content, and links to image assets on the DAM — and handed these off to the offshore authoring team. Pages were then completed and moved to live staging for creative direction and client review without a single design comp being created.
This kept design effort concentrated on the components and the assets that carried real visual weight, while routine page assembly moved through documentation rather than through the design team.
Results
Launched hundreds of pages across 44 countries in 9 languages simultaneously
57,000 unique visitors within one day of launch
6,600 video views and 1,700 asset downloads on day one
Average visit duration of 4 minutes
Delivered a full design system and production workflow within a 10-month timeline
Established a component library and production pipeline the team could keep building on after launch