Published on | Prototyping: From UX to Front End — Medium James R Ford

Beauty, they say, is in the eye of the beholder. When it comes to the beauty of User Experience, I would say it’s more objective. But the “look” of a website can blur the lines slightly.

Bad doesn’t have to mean ugly (or vice versa), it can simply mean it is unfamiliar or in opposition to what typically equates with good or pretty. Good is what we like because we’re used to it. It’s what we’ve come to know as “good”. Or we have learnt from others/popular culture/mass media that it is “good” or “right”.

Take phones as an example! Phones used to small and simple to use, which was considered to be good. Now small phones are bad, and big smart, complex use phones are good. (Although Nokia is bringing back the small dumb phone, so will it become good again?)

So wrong it’s right. Like dipping fries in a milkshake.

A trend has been emerging over the past few years for “bad” looking websites. They feel under-designed and a bit retro — colour gradients (yes I’m looking at you, Instagram), sharp corners, bold colours, big text, irregular spacing of elements, and overlapping/overflowing content. Sometimes they are a nod back to the late ’90s when “nicely” designed websites didn’t exist.

<a href="http://ift.tt/2ponjI1">http://ift.tt/2ponjI1</a>

Instead of “good bad design”, I’m going to label this visual trend with the slightly less oxymoronic term of “undesign” (looks under-designed, undoing design, not typical design). Undesigned but perfectly crafted. In opposition to the term “polishing a turd”, which could be applied to many websites that look pretty but have poor UX and buggy code, “undesign” is like a piece of gold cast into the shape of a turd. It’s ugly or strange at first glance, but oddly attractive, and solidly built.

An analogy for undesign in the arts would be in terms of different painting styles/movements. Many people think of “good” art as a realistic portrait or a beautiful landscape, but there are lots of different ways to create a painting. In most stark contrast to realism, there is abstract expressionism and minimalism: both these forms of art bear little resemblance to what we see in life but there is beauty and quality to be found in them. The rules of value are shifted: the way you consider the mark making and composition is not the same as if you were simply regarding how closely a figurative painting resembled the subject.

How to spot an undesign

In part, undesign has developed thanks to memes, Snapchat filters and social-media app stories: a nonchalant aesthetic used by millions on a daily basis; a visual language that the digital generation relate to and are familiar with. The compositions of undesigned sites may seem extremely empty, or packed and overloaded, but it’s all been thought through and related specifically to the site’s content or purpose. The fonts can look simple and oversized but they are rarely your bog-standard Arial or Helvetica. They will have been chosen for a specific purpose, to produce a feeling or compliment a brand. Big, bold, electric-blue headings are a particular undesign favourite. Layouts respond to the device they are viewed on, even though the placements may look irregular and ill-spaced on desktop.

Bloomberg (open menu state)

Bloomberg has a number of undesigned features on their ever changing website, most noticeably the header area and take-over menu. The retro interactions, bright colours, gradients, square drop shadows and uneven grid spacing all point to a form of undesign. Considering that Bloomberg is such a well-known company and high traffic site, this aesthetic is a brave move.

There are lots of international examples but what has caught my eye is the number of New Zealand based websites using this style. Sons & Co (based in Christchurch) is a great proponent. Their own website is very undesigned: it’s underwhelmingly confident in its laziness. When they produce such well designed websites, how could this text page not be intentionally undesigned.

Studio Magazine is a great example of minimal undesign implementation from Sons & Co. Lots of space, electric blue type, irregular structure, overlapping elements. When you hover the mouse over the video, it flicks up and partially obscures the logo and other text. It looks like a broken or lazy interaction but when you think about it, it’s done simply and intentionally so that the video becomes the unobscured focus. An undesigned, user-focussed feature.

Studio magazine

An alternative undesign look is the Enjoy Gallery website. It has the large sans-serif headings and irregular spacing but instead of white space, it features big areas of bright block colours. It has a hipster I-don’t-care-what-you-think-of-me attitude. The menu is inventive but as I discuss later, inventive undesign doesn’t always equate to intuitive or usable.

Enjoy Gallery

The difficulty with undesign

The tricky thing with undesigning a website is that it has to look like minimal effort has been applied. This isn’t as easy as it sounds, especially if you are implementing quality front-end code and framework structures. Sometimes the intended minimal-effort appearance is over designed, ending up being too worried about itself. Or interactions and responsive behaviour are overlooked, producing a negative user experience. An undesigned site can look broken but it shouldn’t actually be broken.

UX Homegrown

An example of an almost undesign is the UX Homegrown website. It’s almost there but little things give it away as being designed, as opposed to undesigned. The heading font is too different, the blue isn’t bright enough, the gradients are too linear… and the shade of grey is just too grey (I’m joking, but there is something wrong with the blue and grey combo here). The design is thinking too much about what it’s trying to be, whilst trying to conform to rules. The biggest give-away is the subtle drop shadow on the text to ensure it is readable — an undesigned site would do things more simply, like putting it on a solid contrasting background. The lines around the boxes also produce funny visual effects, the site layout breaks at some resolutions. Whatever a site looks like, it shouldn’t break.

The accessibility is not always great on undesigned sites, as part of the look uses clashing colours or overlapping/obscuring elements. But you wouldn’t undesign a government site anyway. With undesigned layouts the navigation and user-flow is sometimes different/not what you would usually expect (due to interesting layouts etc), and this can lead to a negative user experience. No matter how much I like the look of a site, I don’t want to spend ages trying to work out how to get to the next page, or find what I’m looking for.

The undesign life

Undesign filters through all types of design — web, print, branding, etc. Once you have learnt how to design “well”, it’s very difficult to undesign. You’ve learnt what makes nice typography, a coherent colour palette, good spacing and a flowing layout. Doing the opposite feels wrong and you find yourself actively composing the bad design, which is the essence of undesign. Designing something that feels wrong but also feels right. I created the lovely image above, based on some “bad” image design I found. But it wasn’t as simple as it looks. What angle should the rainbow gradient be? Is Comic Sans too bad? What weight, size and alignment should I use? How much should the white box overlap the text? Box drop shadow: how deep, how dark, which lighting angle? And finally, how cute should the cat picture be?

Undesign is an acquired taste and is definitely becoming a style of its own, varying from slick to clunky, and may eventually become more widely seen as “good” design. However, as a colleague of mine asked: “Why would anyone want to make a site that’s ugly and uncomfortable? It just reinforces the ‘design wank’ philosophy that I would hope people in design would want to move away from”. Her question is absolutely valid. Undesign is perfect for a start-up organic-yoga-beard website that wants to be edgy and different, but you wouldn’t use it for a government agency. “Ugly and uncomfortable”, with time, might become less jarring, but the main issue with undesign is that its inherent desire to disrupt the norm makes it less user-focussed. As I style, I really like it, but if I was to implement it myself, I would make sure that the user experience is not forgotten. I look forward to the day when a client with a love of Comic Sans and rainbow gradients comes my way because it will no longer be a barrier!

Originally published on http://ift.tt/2qhlCcF

<a href="http://ift.tt/2puRtdB">http://ift.tt/2puRtdB</a>

Good bad design was originally published in Prototyping: From UX to Front End on Medium, where people are continuing the conversation by highlighting and responding to this story.

Good bad design

Cool stuff, every week

More Articles