top of page

DESIGN SYSTEM FOR A
FAST-GROWING STARTUP

 

My Role
Product Designer

Year
2021

​Company
BeProfit

SUMMARY

Background

I joined BeProfit in October 2021 as the first in-house designer, collaborating with the Head of Product to completely redesign the platform.

As the sole designer, I had to balance creating the Design System with urgent UX tasks due to tight deadlines. The Design System needed frequent updates to meet new requirements, which required a careful strategy to manage these ongoing changes efficiently.

BENEFITS

1

 
This approach would ensure consistency across the user interface.

2

 
Streamline the development process, thereby enhancing both the efficiency and the quality of the product.

3

 
Useful for product managers who want to create sketches.

DETAILS

Setting the Foundation

I started the project by setting up a core color palette centered around the brand's main color and expanded it to include shades for alerts, successes, and informational cues. I also defined a range of font sizes to suit different content levels for a clear visual hierarchy, along with precise spacing guidelines to improve readability and maintain aesthetic uniformity. This structured approach ensures brand consistency and meets the diverse needs of the system's design.

Developing Design Components

 

I developed an evolving set of components based on Atomic Design principles. By collaborating closely with developers, we ensured that our naming conventions and component organization were practical and mutually beneficial, streamlining the integration process across platforms.

 Exemple of Building Hierarchical Component Structures

Fast and Efficient

I designed components quickly and effectively, using well-tested templates to save time and ensure good results. I believe that a design system should develop consistently, adjusting over time to meet specific needs, especially in fast-paced work settings where flexibility is key.

Streamlining Communication in a Design System

 

To effectively implement a Design System for diverse internal users, I engaged
in several key activities:
 

  1. Explained design principles to the leadership team.

  2. Demonstrated behaviors and interactions during developer transitions.

  3. Provided research and alternatives for future design and product development.
     

Considering the time constraints of our weekly remote sessions, I used asynchronous communication methods. I streamlined documentation by embedding notes in Figma files, creating video tutorials for complex features, and using visuals to clarify expected behaviors. I also linked components to their screens to keep developer references current.

Example of a Do and Don't Guide

bottom of page