Salesloft, 2023

Evolving the Salesloft
Design System

Evolving the Salesloft
Design System

Evolving the Salesloft
Design System

Intro

Intro

As part of the Design System team, I helped design and develop Cards and Panels. Two key components that moved us closer to a complete, scalable design system. These additions gave designers more flexibility and made the design process faster.

Team
Team

Product Experience, Design System Pod

Product Experience, Design System Pod

Role
Role

Product Design Intern

Product Design Intern

Timeline
Timeline

May - July 2023

May - July 2023

Problem

Problem

Our design system was missing some core components, making it harder for designers to stay consistent across products. Without ready-to-use Cards and Panels, teams had to rebuild these patterns from scratch or copy them from other Figma files, which slowed down the design process and led to inconsistencies across designs.

Flexible card variants that include different states.

Swappable panels for easy, context-based customization.

Solution

Solution

I collaborated with the Design System team to design and document both components from the ground up. Together, we:

Designed Cards and Panels with detailed variants and flexible states.

Ensured components followed design system standards for accessibility, spacing, and visual consistency.

Ensured components followed design system standards for accessibility, spacing, and visual consistency.

Created component documentation to make adoption easier for other designers.

A quick demo of the Cards and Panels, click play to see the video.

A quick demo of the Cards and Panels, click play to see the video.

Impact

Impact

These components made our workflow faster and more consistent. Designers no longer had to rebuild patterns from scratch; they could just drag, drop, and customize.


My work helped bring us one step closer to a more complete and scalable design system.

Key Takeaways

Key Takeaways

This project taught me the value of a good design system and how to build variants that make design faster and easier.

Helping other designers

Helping other designers

The components I created helped the team move faster and stay consistent across projects.

Figma variants save time

This was my first real deep dive into advanced Figma components, and it’s now something I feel completely confident in.


What does and doesn't work

What does and doesn't work

Working with the Design System team showed me how to build components that are structured but still flexible enough for everyone’s needs.