30 Mrz 2017
car2go INSIGHTS

Defining a Modular Design System

A design system can be helpful to a company, it makes the work with software development and design easier. But what exactly is a Modular Design System and how does it get created?

 

To answer this questions the car2go Product Development Team shows how it creates a design System to work better and faster together with software development and design.

Better because a cohesive experience is more easily understood by the car2go members, and faster because it gives the team a common ground to work with.

Laying the foundation

To get started the first step is to define a set of core characteristics to guide the design. This can be reasonable since most of the time even small teams end up with 50 shades of grey and without any foundation to build on.

A simple style guide was the solution for car2go . The style guide defines the typography, colors and icons based on the existing car2go corporate identity.

Such a style guide ensures to unify the future creation of modules while at the same time it gives the flexibility to change the existing style and add features to it.

Creating the modules

With each update the management of symbols became better and the team could tailor it to exactly what it needed it to be for car2go.

Each component has been defined by its required elements such as title, description and icon – every element can be visible or hidden based on the view logic.

The development team created one set of those components for iOS, Android and Windows Phone. This step made it easier to adapt the components quickly to the car2go app.

 

Review

Since car2go defined a Modular Design System engineers and designers share a common ground and can build new features faster and focus more on the logic rather than the view.

Such evolving ecosystems will never be finished and tweaks to the designs are necessary to allow new ideas to coherent together.

 

What would be a great new feature for the car2go app to you?