/

Glue Design System

Glue, the first Design System in πŸ‡ΈπŸ‡»

Leadership

Design Strategy

Design Systems

Fintech industry

In 2021, the Salvadoran startup teip launched its first product to democratize access to financial solutions in Central America, moving fast to find PMF. At the first signs of potential quality trade-offs, I was tasked with optimizing the product development process without losing the brand's essence.

Could a Design System enable scalability to disrupt a market?

Role

Research, creative direction, implementation alongside another designer, and education of everyone involved in the product development.

The problem

Create a Design System from scratch with a small team new to the practice, and ultimately increase velocity and scalability.

The company

Salvadoran Pre-Seed Fintech, with a platform that facilitates access to digitally-native financial services for people and SMEs.

Users

One Product Designer + Two Mkt Designers + Engineering team of one front-end, one iOS, and two Android engineers.

It all started because I had been evangelizing about Design Systems in the Salvadoran dev community since 2018, speaking at conferences and leading multiple initiatives to build one.

I became the "Design Systems expert", which led to the conversation with the team at teip, business case in hand.

Discovery

Developing empathy, not components

With the help of another Product Designer, we approached the situation as a design problem with UX Research instead of jumping into solving mode.

Auditing five products

An extensive UI audit revealed a lot of inconsistency:

  • 6 variations of the "primary" color

  • Nearly 40 shades of gray

  • Over 60 text styles

  • And so much more…

The role of qualitative research

Surveys and interviews uncovered the real pain points and needs:

  • A design process that was hard to understand

  • The process was slowing down

  • Designs didn't reflect the real SSoT: Code

The team wanted to improve communication to reduce misunderstandings and worry less about tech debt.

The aha! moment

Strong collaboration as a vehicle for communication

Having clarity of the definition of success, in this case, achieving better communication, I approached the process as a co-creation dynamic to create a sense of mutual empathy and ownership.

Co-creating the roadmap

To define an action plan, we prioritized efforts and defined design principles, leveraging frameworks from Design Systems experts Nathan Curtis and Dan Mall.

Connecting code and design

We built and thoroughly tested foundations in collaboration with engineers, held office hours to share progress and answer questions, and got deep into the weeds of sending PRs to connect design tokens.

Outcome

A shared language to increase efficiency

The implementation time was reduced without compromising the brand, and in fact, it improved even further.

Trade-offs and learnings were part of the deal

Refactoring tokens several times and creating breaking changes wasn't fun, but the goal was successfully met. That's the story of how Glue Design System was born.

teip is entering an exciting phase as a business, and Glue plays a key role in that. With an early investment in rethinking how products are created, focusing on solving the right problems is easier than ever.

"My code is now 100% reusable, with tokens I can trust and access everywhere. It's a game changer!"

β€” Kevin, front-end engineer

Impact

Timeline

12

months to launch Glue v1

Adoption

05

web and mobile products

Cost savings

>50%

design and development time

User-centric products

35%

90-day CRR of the main app

Learnings

Start small, don't rush

Don't try to become the next Carbon or Polaris overnight.

Don't overthink naming

What matters is that it feels right for your team.

Get comfortable with iterations

Treat them as opportunities to learn and improve.

Collaboration creates ownership

Overcome challenges together and celebrate small wins.

Contact

Let's talk!

I'm excited to collaborate creating delightful experiences and high-quality products.

Drop me a message at:

hi @ laurie fyi

Based in

β˜… El Salvador

I can talk for hours about

🎨 πŸ“· & 🎸

Until next time! ✌️

Β© 2013 - 2024