“THOSE ARE MY

PRINCIPLES, AND IF YOU

DON'T LIKE THEM... WELL,
I HAVE OTHERS.”
Groucho Marx

Groucho Marx famously said: “Those are my principles, and if you don't like them... well, I have others.” For our design system, we'll need to de ne some principles, not
for the others to like them, but to represent the values we believe in as a team, and therefore they will be re ected in the product as well.

fl
fi
 WHAT ARE THE
DESIGN
PRINCIPLES?

Many times we skip the designs principles and start designing the system right away. The temptation of jumping straight into the visual part is always there.
 LACKING PRINCIPLES
We end up designing a system
without coherence or fundaments
that can sustain it.

The problem with doing this, with going straight into designing the style guide, is that we'll end up designing a system without coherence and fundaments to sustain it. To
avoid this from happening, one of the rst things we should do is to think about our design principles: A serie of beliefs or fundaments that will be embodied into
everything else.
fi

 IBM DESIGN LANGUAGE

→ Carefully Considered
→ Uniquely Uni ed
→ Expertly Executed
→ Positively Progressive

Many of the design systems out there already have their design principles. For example, the one from IBM has "Carefully considered", "Uniquely uni ed", "Expertly
Executed" and "Positively Progressive". As you may notice, these principles can sound a bit abstract, but they have to be useful, not something just decorative.
fi







fi
 HOW THEY ARE APPLIED
TO THE UI
→ In colour and typography
→ In patterns
→ In the “tone of voice”
→ In images and photos

Even if the design principles are a bit abstract, there are ways to take them to a more tangible side. When design principles are put into action, we can see them
represented in elements such as colour and typography, but also in patterns, the tone of voice we will use in texts, or in the kind of images and photos we choose.

More information: https://www.carbondesignsystem.com







Spotify's design principles are "Relevant", "Human" and "Uni ed."
fi
If we take one of them, "Uni ed", we will see that it can be applied not only to the interface but to o ine marketing material. It means that the image and experience have
to be consistent, regardless of the medium.

More information: https://spotify.design/article/introducing-spotifys-new-design-principles

fi
ffl
 SPECTRUM (ADOBE)
→ Rational
→ Human
→ Focused

"Spectrum" is Adobe's design system, and has 3 principles: "Rational", "Human" and "Focused". This can be interpreted in many di erent ways, but they think of it as
the interfaces being for everyone, accesible and inclusive.

More information: https://spectrum.adobe.com






ff
 INCLUSIVE
→ Language
→ Colour and contrast
→ Re ects their principles

This also means that every design, no matter if it's a button or any other components, has to re ect that idea. To be even more speci c, interfaces will be available in
multiple languages, and they will meet minimum contrast ratios. Every design decision is an extension of the design principles in a tangible and directed way.
fl





fl
fi
 OUR OWN
DESIGN
PRINCIPLES

Design principles are one of the reasons why there are no two systems that are exactly the same: Those values that you believe in are most likely to be di erent from
someone else's.

ff
 ALIGNED
→ What you believe in as a person
→ What your team believes
→ Your company’s values

Your design system should have its own design principles, aligned to what you believe in as a person, what your teams believes, and your company's values. Next, we'll
make a list of the ones we will use during the course.





 “FOR EVERYONE”
Accesible and inclusive: We need
to consider a wide range of users.

I feel identi ed with what we saw before while reviewing Adobe's design system, that idea of building a product for everyone. This principle we have here means that our
designs need to be inclusive and accesible, and that we have to keep in mind a wide range of users. When designing the interface, this can be translated into keeping in
consideration di erent screen sizes, and adapting the design for each case.
fi
ff
 “TRANSPARENT”
The interface must communicate
in a clear and coherent way what's
currently happening.

The second principle I chose was "Transparent". This can mean many things, but in this case I will focus it in a way that the interface has to communicate in a clear and
coherent way what is currently happening.
 “INTENTIONAL”
There's an intention or purpose
behind; let's be proactive and
anticipate the user's needs.

Then, something that I think is important to include as a principle is "Intentional". It means that we won't use techniques or dark patterns to confuse the user. It also
means that our products and way of communicating should have an intention or purpose behind, be proactive and anticipate the user's needs -- but without pushing him
or her to do something unwanted.