Lead creation of a new design system

Illustration system to accompany articlesIllustration system to accompany articles

Identification of Opportunity

At Osborne Clarke, repetitive tasks around interface components were causing inefficiencies and time wasted on mundane elements across their website ecosystem. An opportunity emerged to standardize design and development workflows through a cohesive design system.

Responsive typography systemResponsive typography system

Definition of Problem

My research identified key areas the existing website experience struggled with - a lack of engaging visuals to effectively market services across varied sectors, static content presentations that failed to bring information to life, and a lack of responsive typography optimized for the many users visiting on mobile phones. A robust design system could solve these issues while simultaneously reducing rework for developers.

Mobile views of the siteMobile views of the site
Desktop view of the 'Insights' homepageDesktop view of the 'Insights' homepage

Iteration to Solution

I led the ideation and proposal for Osborne Clarke's design system. Central to my vision was an engaging illustration system that could flexibly visualize concepts for different practice areas and industries. The system also pioneered interactive content components that transformed dry informational modules into intuitive, animated experiences. Additionally, I introduced a responsive typography scale to ensure heading hierarchies and body text remained readable and accessible across all device sizes, especially phones.

Interaction for the 'Sectors landing page'

Impact

Implementing this design system provided a dual impact:

  • It gave the Osborne Clarke brand a refreshed, dynamic, and differentiated visual identity perfectly suited to simplify marketing efforts across verticals.
  • Standardized reusable components, content models, and responsive typography substantially reduced frontend development time by minimizing rework on common UI patterns.

Overall, this system boosted brand cohesion, engagement, and mobile usability while unlocking significant time savings. My approach balanced top-line marketing needs with bottom-line development efficiencies.