Design System

Design System I recently got accepted into the Ayagigs web3 fellowship foundational course, It’s been an amazing journey so far, shout out to our instructor Ajiri and our program Associate, Esther I want to share one of the few things, I've learned so far

Design systems

A design system contains a set of deliverables of UI patterns, components, guidelines, and style used within a product, including how and when each elements should be implemented, this helps teams to build consistent and usable designs.

A design system helps to improve processes, assure quality control, make iteration management simple, and maintain consistency across the entire product, in addition to ultimately saving time and effort.

Components of a design system, What should be in your design system A design system contains a catalog of reusable components, and standard brand guides including a color palette, typography, and iconography. It sometimes contains elements such as data, visualizations, illustrations, page framework and structure, and accessibility guidelines.

This means that various aspects of a product are clearly defined, including the visual style, colors, typography, and icons. Defining primary, secondary, and tertiary colors helps an application stand out and is more user-friendly

Popular design systems

1. Google’s Material Design
2. Shopify’s Polaris
3. Microsoft’s Fluent
4. Airbnb
5. Uber’s Base Web

Creating a mini-design system Mini-design systems are created for smaller design projects for early startup companies or if you are working on a personal project.

The majority of elements that you will be using are atomic components like buttons, dropdowns, forms, fonts, colors, etc When using a third-party design system, look out for flexibility and proper component nesting.