Design system for OmniSynkAI, an ERP startup
Timeline
Spring 2024
Tools
Figma
Lottie
Roles
Product designer
Team
Overview
Design system and product design intern for OmniSynkAI
VARIABLES
I began my internship by creating a primitive and semantic variable system.
Initially
Color
Primitive color variables were made of hex color scales, while semantic colors took the primitive tokens and added contextual names. Semantic color tokens were split into universal, component-specific, text, and border colors.
Size
Primitive size variables comprised of multiples of 4, while semantic tokens were split between corner radius, spacing, and padding.
Typography
I used Figma's new typography variables to create a type system (though letter spacing doesn't work quite yet).
COMPONENTS
Work was done to alight past components with the new variable system. Overall, I made small changes to most components.
Changes
Applied new color and size variables
Applied new type system
Refined auto-layout to ensure
New Components
I added new components when requested by the product design team.
Reflection
My first internship! Yay!
Design System Practices
A large part of my time was spent researching best practices for design systems, and I used Uber Base and Wise's design systems as my main source of inspiration. I also used Designsystems.surf a lot!
Company Culture
Although this internship was remote, I spoke with a lot of others in the company, including fellow designers, researchers, engineers, and managers. I gained lots of communication experience, and also used new software including Zeplin and Confluence within the organization.