Distinguishing Good Design From Bad

Analyzing poorly designed interfaces alongside counter examples of successful design can be incredibly fun. All the while, it draws important lessons for designers of various levels.

…After all, by learning from the mistakes of others, we can avoid similar pitfalls when we release our own work to the public. Alternatively, by recognizing errors in our own work, we get a clear message about which of our efforts are working — and which are not.

And only then can we learn to manage errors in the future.

Design For Invisible Experiences

The best design goes unnoticed.

Experiences that are well thought out and executed in strategy should lack aggravation, and the way we interact with technology should feel effortlessly delightful.

Image source: Touchcore
“Good design is actually a lot harder to notice than poor design, in part because good designs fit our needs so well that the design is invisible, serving us without drawing attention to itself. Bad design, on the other hand, screams out its inadequacies, making itself very noticeable.”
― Donald A. Norman, The Design of Everyday Things

So in essence, good design should be error-free, easy to use, easy to understand, and be effective for the end goal or product. Using what is prescribed above, let’s look at a few examples of some good design, as well some eminently bad.


The Good

Let’s start off with one of my favorite file sharing sites, Dropbox. Here’s what I love about their app!

1. Dropbox

Source: Dropbox.com

Logo

Dropbox’s logo (a literal depiction of a box) is coherently simply, and because of its simplicity, can easily stand the test of time. It is built with strong solid shapes making it instantly recognizable at different sizes.

Dropbox SignIn

Color palette

The blue and white color scheme of the site is light, minimal, and non-opinionated, accurately reflecting the company’s straightforward mission of file sharing. The plainness of the site is smartly accented with nominally vibrant, lightly colored, wacky illustrations — injecting playful personality to the brand — without being overwhelming.

Layout

Dropbox Myfiles and Sharing

Dropbox’s interface makes incredibly easy for users to navigate and preview files. Folders and information is presented at a glance. Therefore, it is easy to sort files, easy to search files, and most importantly, easy to share, upload, and delete files all at the click of a few buttons.

Typography

The sans-serif typeface conveys simplicity and continues to support the site’s distinguished minimalist feel. Dropbox does a great job with its visual hierarchy. The CTAs are visually noticeable from the bright blue color and large type face, effectively promoting sign-up.

Overall, Dropbox is clean, lightweight, and easy to understand. There are few settings and options throughout pages, making them simple to navigate.

I am most fond of the illustrations — They add just the right amount of personality to the site, without being too obnoxiously distracting.

2. Medium

Next, let’s move on to my favorite blogging site, Medium!

Simple Black and White Palette

Color palette

Similar to Dropbox, it has a clean, modern look and is very minimal in its design — we are blessed with a plain black and white interface, perfectly suited for a blogging site. Because of the clean interface, there is no pain associated with “choosing the right theme.” There are few distractions, allowing users to focus entirely on its articles.

Typography

Easy header and layout formatting

My favorite part about Medium is its user friendly-editor. The serif typeface is absolutely beautiful and pleasing to the eye, giving the site a “professional” feel. The font size is easy to read, and the tracking / line spacing is second to none. Formatting is virtually automatic. Visual hierarchy of information (Eg. creation of headers) just takes a click of the a button.

Usability and Functionality

Medium — Claps

I absolutely hate it when I write something long and difficult — just to have it disappear. There have been numerous times when I’ve inadvertently hit a key while typing that functioned to erase everything I wrote. With Medium, I don’t worry because it saves everything for me!

There is something very different about Medium that makes it incomparable from any other blog site — you can follow publications and like the posts, you can highlight information on articles and save your notes for future reference. There is also a unique clapping option that no other site has.

With numerous engagement opportunities, fantastic readability, and a clean, minimalist interface that drives great content, Medium has great user experience design.


The Bad

3. The Room Movie

If you haven’t yet seen The Room, an independent drama film written, directed, produced by, and starring, Tommy Wiseau, I’d highly recommend watching it.

It’s a fantastically terrible movie, with a surprising mix of genuine and unintentional humor. With the release of the Disaster Artist, my curiosity prompted me to Google “The Room.” I must say, the search results did not disappoint! The 3rd search result took me to this gem:

Homepage

With the release of the Disaster Artist, I thought it would be rather fitting (and entertaining) to do a design analysis on www.theroommovie.com, a fantastically terrible website for an amazingly bad movie.

Layout

The homepage itself invites you to a complete mess, as hierarchy is all over the place. The advertising is loud and obnoxious, and the visuals oftentimes are unrelated to any of its surrounding text. There is no structural layout — zero usage of a grid system.

Typography

It is difficult to read the smaller text, mainly due to the fact that my eyes are more so directed at the capitalized, bold font. Font size does not aid in setting a visual hierarchy. Links, scattered all across the page, although underlined, are hard to tell if they are clickable or not.

Color

There is a clear red/black/white/yellow color scheme throughout the site, however, there is no strategy behind the color choices. There is contrast in color, however, and this is something I will commend.

Overall —Painful for the eyes, but (similar to the movie) gloriously bad. TheRoomMovie.com makes zero attempt at organizing information in a sensical manner for users. Information is redundant and or competing for attention. There is therefore little to no take away from the site. Anyone landing on this page is sure to be confused.