Sajjad Abedi
I built Atlan's first design system to solve growing inconsistencies across our product. By creating reusable components and clear guidelines, we improved team velocity and user experience. Within four months, 4 out of 6 customers chose us specifically for our user experience.

Atlantis design system

Tl;dr

I built Atlan's first design system to solve growing inconsistencies across our product. By creating reusable components and clear guidelines, we improved team velocity and user experience. Within four months, 4 out of 6 customers chose us specifically for our user experience.

The background

At Atlan, our rapid growth created a new problem. Design inconsistencies were appearing everywhere across our product. As our company scaled, design inconsistencies were hurting our users and slowing down our teams. I worked with designers across the company to establish quality standards and deliver experiences that users would love. My goal was simple: make Atlan synonymous with great design.

The turning point

During a company townhall, I presented a clear vision: user experience could be our competitive advantage. I showed how design quality directly connected to our business goals. The response was immediate. Leadership and my team rallied behind the idea that great design would set us apart from competitors.

Screens from design system audit workshop
Product audit
Screens from design system audit workshop
Presentation durning townhall

Building momentum

I organized workshops with designers, engineers, and product managers. These sessions helped us identify problems and get everyone excited about solutions. To understand our users better, I gathered insights from multiple sources:

The problems we found

Our research revealed five critical issues:

Our solution approach

I led a comprehensive product audit with the design team. We documented every inconsistency and presented clear recommendations to leadership. This audit became our roadmap for building a design system that would solve these problems.

Notion page outlining all the task related to the design system

I built the foundation with design tokens, typography, and core components. Accessibility was built in from day one, not added later. Every component came with clear documentation and usage examples to help teams implement correctly.

Colors

colors
Tokens
Roles

Typography & layout

Typography
Layout and shadows

Icons

Icons
Brand logo

I shared weekly updates with the team and incorporated their feedback throughout the process.

Key components

Here are the main components we designed and built:

Button components
Text field components
Text field components
Tag components
Toast components

Design principles

With our foundation ready, I focused on components that solved real user problems instead of just redesigning what we had. Every component had a clear purpose and improved the user experience.

Tone of voice
Principle

I partnered with marketing and technical writers to create a content framework. Since content makes up 80% of the user experience, getting the words right was just as important as the visual design.

The results

The design system launch transformed how we work and how customers see us: