Story Behind Our Design System 2: Adorably simple.

Ameer Omidvar
Bootcamp
Published in
4 min readNov 7, 2024
Sigma Design System 2
Sigma Design System 2

Creating Sigma Design System 2, we knew it had to be different. We weren’t aiming to create just another design system; we wanted one that would be truly usable and, as we like to say, adorably simple. We wanted it to feel intuitive from the start, a system that wouldn’t add complexity but instead would make designing delightful and straightforward.

The Start of Something Different

When we first began, our team at TheSigma was simply trying to solve problems we’d experienced ourselves. We’d worked with numerous design systems that felt either too complex to implement or too bare-bones to be useful in real-world projects. We asked ourselves: Why isn’t there something that feels just right? That question was the spark behind Sigma Design System 2.

Designing with Simplicity at the Core

Sigma Design System 2 Logo
Sigma Design System 2 • Adorably simple

Our approach to simplicity was intentional from the very start. Each component was designed to look clean, approachable, and adorably simple. We wanted every button, icon, and layout element to blend into an interface that feels natural and intuitive. The beauty of Sigma lies in how these elements come together: individually simple, but collectively powerful, creating a UI that feels cohesive and effortless.

This simplicity wasn’t about stripping away functionality but about embracing clarity and ease. When components are so intuitively designed, they work seamlessly together, helping designers build interfaces that don’t just look great but also feel great.

Documentation Crafted with Care

To support this vision, we knew our documentation had to be exceptional. Great documentation is what allows a design system to be truly useful, and we wanted Sigma’s to go beyond a standard manual. We pushed the limits, crafting beautifully detailed, user-friendly documentation that feels like a guide, walking designers through each component with clarity and ease.

This attention to documentation means that every feature is immediately accessible, making Sigma easy to pick up and use, whether you’re a seasoned designer or just starting out. We believe that well-crafted documentation is key to making Sigma not just a toolkit, but a genuine design resource.

On Material Mode: Bringing Depth to Design

Built and customized with Sigma Design System 2

One of the standout features of Sigma Design System 2 is on Material mode, a unique option for components that opens new possibilities for spatial interface design. Designed with a glass-like surface, on Material mode adds a subtle layer of depth to components, giving them a dimensional, modern feel.

This mode is perfect for designers who want to create layered, spatial interfaces (Like designing for Apple Vision Pro), allowing for rich visual effects that feel contemporary and engaging. With on Material mode, components take on a presence that’s both sleek and impactful, making it ideal for exploring new UI concepts that leverage depth and layering.

Crafting the Icon Library (And Why We Went All In)

Sigma Icons
Sigma Icons

We’ve all been there: hunting for the perfect icon, only to find that it doesn’t fit with the rest of the set. To spare others this hassle, we built an icon library from scratch — over 300 icons in multiple sizes and two styles (line and fill). It was a labor of love, but we knew that having these icons available in different variations would make a difference. Now, designers could stay within Sigma without ever feeling limited.

Making It Responsive

Responsive for mobile and desktop

Today’s interfaces live on every type of screen, from desktop monitors to smartphones. So we worked hard to build in auto-layout and responsive capabilities that would make Sigma Design System 2 adaptable to any device. Light and dark modes came naturally after that — it just made sense to have a design system that could adapt with the same flexibility we wanted in our own work.

Launching and Seeing the Impact

Sigma Design System 2

After months of development, testing, and refining, we finally launched Sigma Design System 2. Watching it go live felt like seeing our vision finally take shape. Feedback poured in, and it was overwhelmingly positive. Designers found that Sigma was exactly what we’d intended: a balance of simplicity, flexibility, and power.

Today, Sigma Design System 2 is helping teams around the world create cohesive, adaptable UIs faster than ever. But we didn’t just build a design system — we built a tool that empowers designers to bring their own visions to life, without compromise.

--

--

Bootcamp
Bootcamp

Published in Bootcamp

From idea to product, one lesson at a time. Bootcamp is a collection of resources and opinion pieces about UX, UI, and Product. To submit your story: https://tinyurl.com/bootspub1

No responses yet