Clarity and Style

A few days ago, John Maeda, Head of Computational Design and Inclusion at Automattic, shared this tweet:

He is right. We are all responsible for what we create and the ego of a designer should never influence the design in a way that it negatively affects quality. But it was primarily the first part of the tweet that got me thinking because it touches on something quite important.

Good design is about clarity over style.

There is much truth in this statement, yet it is something that still isn’t well understood, it seems. Good design has intention and it has to communicate something, often on many different levels, to be effective. This makes clarity essential: The purpose of a design has to be clear, the functionality has to be clear, and the message has to be clear.

Style, though, in the sense of a distinctive aesthetic appearance, might appeal to the eye and thus successfully deceive people for a little while if a design lacks clarity. But taken all by itself, style is not enough for a design to be effective. If the message isn’t clear, making it look pretty will only get you so far. Style in the sense of appearance is not sustainable. It is volatile.

Yet, many designers seem to still favor style over clarity quite often. Why? It might well be that, sometimes, designers are themselves deceived by style, by an extraordinarily well-crafted sensual appearance. Sometimes, designers also simply fall in love with the artistic side of design so much that they get lost in it and forget to look with a beginners mind. Sometimes, designers deliberately use style to “seduce” clients and stakeholders to get approval or to gloss over certain shortcomings. Style certainly is powerful and seductive. But maybe the primary reason why so many designers prefer style over clarity is: Styling something is easy. Making something crystal clear is hard.

Making something crystal clear requires straightforwardness, consistency, and perseverance. It requires advocating for something and at the same time being open to change your mind. To achieve clarity, you need to be willing to ask questions, to challenge every detail, and to reduce something down to the essential. Clarity is when you communicate exactly the right amount of something, not too much, but at the same time – and this also often gets confused – not too little. Only because we make something less complex, it doesn’t automatically get more clear. Sometimes, you have to add the right amount of complexity to make something clearer. Maps, for example, can be exceedingly complex yet still strikingly clear.

Making something crystal clear also means knowing not only how to say something and how much of it but, first and foremost, what to say and why. And for this, it isn’t enough to simply slap some lorem ipsum text into your design and wait for someone else to fill in just the right words later. You need to know how to encode your message so that the right people are able to decode it. This is standard semiotics but it requires a deep understanding of the people you want to reach. You need to understand your audience, their needs and wants, what drives them, and the context in which they might interact with your design. You need to work with content first – maybe not the final version of it but already on point regarding the message – and design with this material, the real material, all real materials, constantly prototyping, observing, and improving every aspect of your design until you know it works.

And this is where style comes in again. Because, of course, style has its place. Which is also why John wrote “clarity over style” and not “clarity instead of style”. There is still an and. Style can be what sets you apart from the competition. Style can create identity and convey emotions and atmosphere, even a feeling of familiarity. Style can support your message by further improving clarity.

Good design is about clarity over style. Combining clarity and style so that they complement each other and the design reaches another level of fidelity is mastery.

Prototyping.news: For a monthly update on the latest articles, tools, and other resources about prototyping for the Web, sign up for my free newsletter Prototyping.news.

~

53 Webmentions

Photo of Dennis Frank
Dennis Frank
Thank you @m_ott for this beautiful article about design. “Styling something is easy. Making something crystal clear is hard.”
Photo of Tom Tinkerson
Tom Tinkerson
"content 1st – maybe not the final version but already on point regarding the message – design with this material, the real material, all real materials, constantly prototyping, observing, and improving every aspect of your design until you know it works" matthiasott.com/notes/clarity-…
Photo of Tom Tinkerson
Tom Tinkerson
"… knowing not only how to say something and how much of it but, first and foremost, what to say and why. And for this, it isn’t enough to simply slap some lorem ipsum text into your design and wait for someone else to fill in just the right words later." matthiasott.com/notes/clarity-…
Photo of David Hellmann
David Hellmann
New link: "Clarity and Style · Matthias Ott – User Experience Designer" — Direct Link: matthiasott.com/notes/clarity-…
Photo of Dennis Frank
Dennis Frank
Thank you @m_ott for this beautiful article about design. “Styling something is easy. Making something crystal clear is hard.”
Photo of Russell Frith
Russell Frith
Clarity and Style, by @m_ott russfr.it/2YPicQt #design #ux
Photo of Carol
Carol
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Redvelvet
Redvelvet
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Dean Zarras
Dean Zarras
Spot on: “Style certainly is powerful and seductive. But maybe the primary reason why so many designers prefer style over clarity is: Styling something is easy. Making something crystal clear is hard.” — ⁦;@m_ott⁩; #software #uiux matthiasott.com/notes/clarity-…
Photo of Christina Bruce
Christina Bruce
" Clarity is when you communicate exactly the right amount of something, not too much, but at the same time – and this also often gets confused – not too little."
Photo of Michael Le
Michael Le
"Only because we make something less complex, it doesn’t automatically get more clear. Sometimes, you have to add the right amount of complexity to make something clearer." - @m_ott matthiasott.com/notes/clarity-…
Photo of Hani Ramadhan
Hani Ramadhan
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Joy Lin
Joy Lin
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Maite Dalila
Maite Dalila
"Good design is about clarity over style, and accountability over ego." @johnmaeda Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Eduardo Gómez
Eduardo Gómez
Clarity and Style · Matthias Ott – User Experience Designer matthiasott.com/notes/clarity-…
Photo of Greg Gonzalez
Greg Gonzalez
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Alan Natachu
Alan Natachu
"Good design is about clarity over style, and accountability over ego." @johnmaeda Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Florida Man.
Florida Man.
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Cyril Rouhana
Cyril Rouhana
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of Tomas Ooms
Tomas Ooms
Clarity and Style, by @m_ott matthiasott.com/notes/clarity-…
Photo of User Viewing
User Viewing
Clarity and style | "Good #design is about clarity over style, and accountability over ego." @johnmaeda – by @m_ott buff.ly/2Tfp0Tu #uxdesign #ux
Photo of ALT Agency
ALT Agency
Clarity and Style >>> matthiasott.com/notes/clarity-… #webdesign #UX
Photo of Simon Fréour
Simon Fréour
Sounds like advanced UX design advice to me: "Only because we make something less complex, it doesn’t automatically get more clear. Sometimes, you have to add the right amount of complexity to make something clearer." matthiasott.com/notes/clarity-…
Photo of Hassell Inclusion
Hassell Inclusion
@m_ott discusses clairty & style in webdesign matthiasott.com/notes/clarity-… #UX #A11y #InclusiveDesign
Photo of UNIHUNT
UNIHUNT
Zamyšlení nad tématem srozumitelnost vs. styl matthiasott.com/notes/clarity-…
Photo of Rob Langdon
Rob Langdon
"Styling something is easy. Making something crystal clear is hard." (via @Pocket) matthiasott.com/notes/clarity-… #doingthehardworktomakethingssimple
Photo of Ann
Ann
Clarity and Style matthiasott.com/notes/clarity-… #DesignMadness #UX #UI #Creative
Photo of PINT, Inc
PINT, Inc
"If the message isn’t clear, making it look pretty will only get you so far."
Photo of Hassell Inclusion
Hassell Inclusion
@m_ott discusses clairty & style in webdesign matthiasott.com/notes/clarity-… #UX #A11y #InclusiveDesign
Photo of Hassell Inclusion
Hassell Inclusion
@m_ott discusses clairty & style in webdesign matthiasott.com/notes/clarity-… #UX #A11y #InclusiveDesign
Photo of contentiful strategies
contentiful strategies
“Good #design has intention and it has to #communicate something, often on many different levels, to be effective. ” buff.ly/2UCOIai via @m_ott
Photo of Brinkmanda
Brinkmanda
"Styling something is easy. Making something crystal clear is hard." matthiasott.com/notes/clarity-…
Photo of Hassell Inclusion
Hassell Inclusion
@m_ott discusses clairty & style in webdesign matthiasott.com/notes/clarity-… #UX #A11y #InclusiveDesign
Photo of Martin Cibere
Martin Cibere
#Clarity and #Style by @m_ott matthiasott.com/notes/clarity-…
Photo of CSS-Tricks
CSS-Tricks
> Good design has intention and it has to communicate something, often on many different levels, to be effective. This makes clarity essential: The purpose of a design has to be clear, the functionality has to be clear, and the message has to be clear. matthiasott.com/notes/clarity-…
Photo of Adactio Links
Adactio Links
Clarity and Style · Matthias Ott – User Experience Designer matthiasott.com/notes/clarity-…
Photo of CSS-Tricks
CSS-Tricks
#design ????; About "Good design is about clarity over style." matthiasott.com/notes/clarity-… ????; Always Ask Why Five Times thedesignteam.io/always-ask-why… ????; How to get buy-in for building a design system abstract.com/blog/design-sy…
Photo of Alfred Danda
Alfred Danda
Clarity and Style #UX #UI #Design matthiasott.com/notes/clarity-…

Likes

Reposts