Role

Lead Designer

Duration

2 months

Platform

Web, Figma Community

Contributions

Design systems
UI design
Component design
Design tokens

The Brief

The goal of this design system was to design a tool that enables teams to get started with projects quickly and provide a robust foundation to grow a project's design system quickly.

Our product team found that we often build the same components over and over again from project to project. Poplar offers core components that are designed with flexibility and customization in mind.

What I did

I conducted research into design systems and component libraries to inform the design of the system. I then created a style guide and component library with common elements that are useful when setting up a new project.

I created style guides for type, color, and icon systems, as well as a responsive grid system for web and mobile.

Each component is constructed to closely resemble how developers might build the component in code. The components also benefit from all of Figma’s features such as auto layout, component properties, and interactive components to allow designers a robust component that eliminates duplicate elements floating around designs.

The design system also utilizes variables and I created a brief overview of design tokens and how they might apply to certain projects.

Explore the design system on Figma Community here!