Context

Esurance was in the middle of transitioning from an incomplete rebranding effort by an outside agency. Version 1 of the design system existed in Sketch, but the company was moving to Figma. My task was to help bridge the gap between an unfinished brand direction and the practical needs of a functioning design system.

Role & Objectives

I joined as the Visual Designer supporting a team of 4 UX designers and 3 UX researchers.
My main objectives were to:

• Build a working Figma-based design system starting from an existing rough component library and branding guidelines

• Expand and refine components without altering any preexisting assets

• Provide Marketing and Engineering teams with production-ready deliverables

Constraints

• Could not modify existing components; could only add new ones

• Branding guidelines were incomplete and no longer supported by the original agency

• Transition from Sketch to Figma meant starting much of the system from scratch

• Expanded grayscale and accent color palettes; introduced a warning orange

• Extended typographic scale and created lockup components with usage rules

• Revised and expanded wayfinding and UI icon sets; delivered SVGs to Marketing & Engineering

• Expanded alert logic and introduced new patterns such as a page stepper and calendars

• Clarified button, selector, and control logic

• Expanded states for text fields, dropdowns, and text areas; designed a date picker

• Established spacing rules for consistent layout

Impact

This work created a more cohesive, scalable design system foundation in Figma, enabling both the design and engineering teams to work faster and with greater consistency. It also smoothed the path for Version 3, which further matured the brand and component set.