Simpu Design System

Simpu is a unique platform that deals with multiple integrations to over 10 different platforms from social media channels to databases to e-commerce platforms. My goal when designing the design system was to make sure that it was flexible enough to accommodate all the various platform connections without losing its own design style. For the spacing system, I went with an 8px grid system.


Typography

When deciding the official font for Simpu, the goal was something that was clean, easy to read and understand and i went with Averta, a geometric sans-serif typeface which makes it perfect for both and web platforms.

Iconography

When used correctly, Icons communicate the core idea and intent of an action. For Simpu’s design system, I went with the Windows 11 outline icons, because they provide different states, are easy to understand and they compliment the overall design system.

Color palette

The Simpu colour palette was designed in a way that enhances the user experience This also meant selecting colours with sufficient contrast and avoiding colour combinations that can be difficult to distinguish and affect usability.

Empty states

The main goal of the empty illustration is to guide the user on how to proceed further in a particular situation.
The goal of the empty state lets the user know what’s happening, why it’s happening, and what to do about it and provides opportunities to improve the user experience and consequently amplify business opportunities.

Other components

The design system had a wide array of components including and no limited to, menu and navigation, icons, Tool tips, badges, tabs, modals.
All of these were designed individually to compliment the overall look, feel and usability of the platform.

Results

A Design system is ever-evolving. The complete system I designed contains, buttons, forms, checklists, alerts, avatars, tabs, tables, modals and more components. You can request to view the complete design system.

Next
Next

Simpu Web App