Illustration Refresh, Coinbase

Credits
Illustrator: Maryanne N, Jeremy B, Terran W
Manager: Dom F
Eng: Jennifer L
UXR: Cat D

Year
2021


Problem and Opportunity
By 2021, Coinbase’s existing illustration style felt inconsistent and outdated, making it difficult to clearly convey product concepts across touchpoints. The style lacked alignment with the newly evolved Coinbase brand, and user research revealed that illustrations were sometimes perceived as unclear or overly generic—especially by new users seeking guidance and by power users who valued precision and trust.


Refreshing the illustration style presented a chance to create a cohesive, modern system that reflected Coinbase’s new brand values of clarity, trust, and accessibility. Through multiple UXRs with both new and experienced users, the team could craft visuals that improved comprehension, built brand consistency, and enhanced the overall user experience across marketing, onboarding, and product surfaces.

My focus during the Illustration Refresh was the design lead for the UXRs around illustration comprehension, co-illustrating hero illustrations with Terran W, writing Illustration Guidelines, design partner for the Illustration Component (Figma and design component).

 

Existing style: very blue, clinical, pale, lots of gradients.

Updated style: inviting more brand colors, playfulness, geometric, bold, interesting overlapping colors.

We partnered in-house and with the talented agency Gunner to explore multiple creative directions for Coinbase’s product illustration style. Together, we produced a range of styles and visual approaches, experimenting with different levels of abstraction, color treatments, and narrative elements. This exploration allowed us to evaluate how each direction supported clarity, trust, and brand alignment before selecting and refining the final system.

I worked closely with Cat D. from UXR to understand how users interpreted and engaged with our visuals—what drew their attention, what helped them navigate the product, and what caused confusion. Early explorations often leaned too abstract, leading to misunderstandings and missing the mark on clarity. These insights were critical in steering the style toward a more grounded, approachable direction that better aligned with user needs and Coinbase’s brand.

In a later round of UXR, we refined the style into something more literal, layering in Coinbase’s brand elements to create visuals that felt more familiar, clear, and hopeful.

Coinbase already had an existing illustration library, but it was outdated and visually inconsistent with the new brand direction. Once we defined the refreshed style through my work with UXR, the Illustration Team collaborated (divide and conquer!) to systematically redraw and replace the entire library. This ensured every asset from onboarding visuals to product diagrams, aligned with the new style, improving clarity, consistency, and brand cohesion across all user touchpoints.

I co-illustrated (with Terran W) the hero illustrations, and I was leading the work for Coinbase’s first-ever illustration guidelines. These outlined best practices for creating and applying illustrations, defined usage rules, and documented component and pattern standards in collaboration with our Design System team. This framework ensured that support hero visuals—and all future illustrations—were consistent, accessible, and scalable across Coinbase’s products and platforms.

Jeremy B. and Terran W. led the work on Spot Illustrations and Pictograms. Their contributions helped round out the rest of the library, ensuring we had a complete, versatile set of assets that could flex across product, marketing, and support surfaces while staying true to the refreshed style and brand.

I had the opportunity to work with Jennifer L., my engineering partner from the Iconography Guidelines project, to create Coinbase’s first-ever Illustration Component. This was a huge cross-functional effort aimed at stopping the ad-hoc addition of individual SVGs by engineers. Instead, all illustrations were implemented through the Illustration Component, ensuring every asset pulled directly from the approved library. This not only streamlined workflow and improved consistency, but also established a scalable foundation for maintaining the quality and integrity of our illustrations across the entire product ecosystem.

I had the opportunity to work with Jennifer L., my engineering partner from the Iconography Guidelines project, to create Coinbase’s first-ever Illustration Component. This was a huge cross-functional effort aimed at stopping the ad-hoc addition of individual SVGs by engineers. Instead, all illustrations were implemented through the Illustration Component, ensuring every asset pulled directly from the approved library.

Before rolling out the refreshed style, we ran an initial test using the older style illustrations to validate the component’s functionality and gather early feedback from engineers and designers. Once the style was finalized, Jennifer and I refined the component’s props—defining types, supporting light/dark mode, setting standard sizes, integrating color tokens, and optimizing performance. These considerations made it easy for teams to use illustrations consistently while keeping implementation simple and efficient across the product ecosystem.

As a group, we took dedicated time to plan for dark mode, knowing it was a key part of the Coinbase trading platform experience. Without outlines or container shapes sitting in the background, we anticipated that dark mode would be a tricky challenge for maintaining clarity and contrast. Through multiple rounds of color testing, we refined our approach and ultimately aligned on a standard that preserved visual integrity, accessibility, and brand consistency across both light and dark environments.

I partnered with the Design Systems team to add dedicated options for illustrations within commonly used components: specifically cards and modal dialogs, where illustrations frequently appear. This integration made it seamless for designers and engineers to connect directly to our illustration library, ensuring consistent usage, faster implementation, and stronger alignment with the refreshed visual system across the product.

I documented Coinbase’s first set of formal illustration guidelines. While the long-term plan was to publish these on the Design System website, I began with an initial Google Doc to capture best practices, usage rules, component standards, and pattern guidance. This early documentation served as a living resource for the team, helping maintain consistency and quality across all illustration work until the guidelines could be fully integrated into the design system.