What is good design?

What is good design?

A designer should be able to design anything from a spoon to a city. Adolf Loos (paraphrased)

Today most designers think of themselves as one-trick-ponies. Rather, that’s how designers began thinking after the work of the typographer from the 15th and 16th centuries split into two: the printer who knows the technical details of bringing a design into reality, and the designer who decides what needs to be printed.

What a divide that is. Or, what a divide that was.

Printing used to be terribly hard. If you ask some of the best printers today, like Stiedl, they’ll tell you it still is, but Kinkos is open 24/7. Printing is easy, and now that much of design lives on the screen rather than on the page, why does this divide in technical knowledge and design prowess still exist?

You’ve probably hear the term “Unicorn” used to describe someone who can not only write code—HTML, CSS, JavaScript, Ruby, whatever—but also design. These people are the modern-day versions of typographers (in the old sense of the word.) Unicorns are nothing compared to what Loos wanted.

Design and code should have an asterix next to design. They can design things for the screen and maybe things to be printed. They don’t bother themselves with spoons or cities. spoontocity I had a conversation with a designer the other day, and they said that industrial and graphic design require different skillsets. I, obviously, objected.

The principles of design remain constant. They don’t change based on the medium. Otherwise you could say that web design and app design required vastly different skillsets. Or that fork design and knife design are miles apart.

The ultimate measure for a design is how well it achieves its purpose in the context of human use. For example, a vacuum cleaner which sucks up dirt extraordinarily well but which has a hidden power button, has a bad design. Similarly, the vacuum cleaner with very clear and concise controls, which looks nice, and fits beautifully in your closet but doesn’t pick up dirt worth a damn, has a bad design.

Far too many designers think their focus should be on aesthetics. If it looks cool then I’ve done my job, right? Proper function in the context of human use—that is all there is.

Looks good but illegible? Back to InDesign. Looks cool but doesn’t light the room? Back to the garage. Looks great but doesn’t convert leads? Dreamweaver (or MS Word, depending on why). Beautiful but has terrible automobile traffic? Actually, for this one, there’s no easy solution—get rid of parking, for starters.

Design is experience. Experience meaning the before—how something looks. The during—how easy it is to operate or use. And the after—how satisfied the user is with the results of operation. These three aspects of design rely on each other; nothing may be omitted or left out. Let us look at these three as they apply to different media. Design is experience. To design a converting landing page (to read about how to design a landing page, check out this tutorial) the web designer handles the before; the copy writer handles the during; and both of them handing the after. The order of when these are considered, though, does not follow the same pattern.

The copy writer must first write copy that converts. He must write the header, the sub head, the body copy, the callouts, the calls-to-action, and so on. He must create, before the designer looks at anything, all the content the user will read.

It helps if the copy writer also provides descriptions of what graphics, if any, he would like on the page. To do this, he must design a dialogue with the reader which leads to a purchase or download or subscription. He must design the copy so that it flows to the end that he wants.

Once he’s done, the designer will take that copy and give it an aesthetic. She will consider the fold, and what should go above it. She will consider the calls-to-action, and how to make them contrast sharply with the page. She will spend hours poring over the typography to make sure it is visually appealing, highly legible, and fitting to the content. She will make sure the page holds its design on every screen size. And so on.

Finally, once the page is live. They will, together, view the results—conversions, in this case—and decide what design needs to change: the copy or the visuals. If a landing page is created in this method—with thought devoted to the before, during, and after: to the experience—then it will successfully convert.

Let’s get out of the computer and into the real world. Stairway railings. You probably never consider railings as something that are designed; you probably take them for granted. I posit here, that architects largely do, too.

Much devotion has been given to the design of the railings themselves—their shape, height, and endings—but little, as far as I can tell, is given to their placement.

In the context of a wide stairway leading up to one or multiple doors of a building, one might notice that there exist multiple options for traversing the stairs. Up the left, the right, and so on.

This decision may be affected by outside factors—one’s ultimate destination may be inside on the left; thus, we may expect her to walk up the left-hand of the stairway. Largely, though, we can ignore, based on the law of averages, these case-specific influences; the problem of where to place the railings still remains.

Architect designers often take a symmetrical approach to the problem, dispersing the railings evenly throughout the space, cutting the visuals into even sections. This, undoubtedly looks great on paper, as it usually looks nice in reality.

Looking nice—that’s a start. Unfortunately, symmetry is as far as many architect designers go. They see only how the railings look, not the experience they produce. If you have three double-doors at the top of a wide stairway (it’s a large building) and you want to place railings on this stairway, you may think to place three railings, dividing the space in the same way that the doors do.

That’s symmetrical; that’s even. What you would be ignoring, though, is that the goal of each user—of each pedestrian who wishes to use the stairway—is to walk through the doors at the top.

Yes, they have a small, flat landing at the top of the stairs to funnel through, but chances are the architect designer put that there to accommodate the swing of the door or the width of some pillars. Better placement, I argue, factors in more than appearance, more than the before. It entails looking at the during and after.

Save money and put only two railings; one in between each pair of doors. This is symmetrical; this is even; this does not inhibit users. This does not confront pedestrians with a railing immediately after they walk out of a building. This does not force users to walk up a segment of stairs only to cut diagonally towards a door.

How does this proposition solve the problem of after? Well, if there exist three railings, which are symmetrical themselves, the user cannot walk down the middle—a railing is there. Sure, they can walk down the one-third or the two-third, but this fact is obscured by the fact that the railings cut the space into fourths.

With two railings, people can walk up and down the center freely, fully enjoying the symmetry of the design—the symmetry of the experience. They can get where they’re going faster (aligning segments of space with doors necessarily speeds up travel) and in a more pleasant way. The resulting effect is a subdued, even subconscious rightness. Users feel correct walking towards the door, unobstructed by ill-placed railings. the design of railing placement Sometimes solving the before, during and after—the experience—is that easy. Sometimes it’s a simple answer. Other times, as with the landing page scenario, it’s a long process which changes with every instance. This difference results from the complexity of the function and variation in intent.

In other words, landing pages exist for books, movies, apps, events, places, and more. Each possesses its own market of potential users, each of whom has her own goal. As a result, the copy and design of each landing page must be tailored to fit the context; the diction must fit the audience and the design must fit the content.

For railings, it’s much simpler. People need to get up and down the stairway and through the doors quickly and efficiently; if they need help traversing the stairs, or if they trip, the railing must be there for them. Beyond that, it should disappear.

The goal of each designer in every design is to engineer the ideal user experience. Ideal, though, should be considered distinct from best. Best implies that it’s enjoyable to a high degree or is at least very pleasant. Yes, every user experience should be pleasant, but that is not the primary focus of a designer. Pleasant is a part of ideal, not the entirety. Ideal integrates intentions, too.

Ideal user experience varies, how pleasant the experience is should not. To wit, an ideal experience on a sales page entails not only for the visit to be brief and pleasant but also that the user buys something. Put another way—every experience should be pleasant; ideal experiences should accomplish some specific goal in a reliable way.

If a design looks good, achieves its function, and does so both pleasantly and predictably, then the design is good. Everything else is mediocre or worse. Where in this definition of good design do we place the traditionally conceived principles of design? It depends on which principles we discuss. Principles of contrast, repetition, color, balance, and so on help to define a pleasant before experience. They guide the aesthetic of a creation. Dieter Rams’s Ten Commandments, on the other hand, help in defining a positive during experience.

They reflect what is necessary in a desirable interaction with a product. None of these, though, wholly capture the goal of a design. Dieter Rams’s position that “Good design makes a product useful,” is the closest I can find. The user’s main goal is often to learn—they arrive at a new webpage or to a new building or upon a new chair and do not know much about the experience they are about to have.

Quickly, though, within a few milliseconds, they make aesthetic judgments, which may be enough to drive them away. They may notice that the color palette of the website is jarring or that the ornaments look decidedly 90’s. They may judge the architecture and determine, based largely on preference, if they like it or not.

They may be able to tell if there’s enough light being let in through whatever windows, or if the airflow is poorly conceived. They may see that the material out of which the chair is built is quite flimsy, or that the chair looks uncomfortable. All of these subconscious judgments, which the user makes upon first glance, determine his immediate perception of the product. Before + During + After = Design If the aesthetics are nice enough so as not to drive away the user, then begins the true test of goal achievement. How legible is the text? Does the text actually educate the reader about the topic of the page? Does it follow logically? Does its tone and diction match the audience and content? Does the building’s layout allow easy transport to and from the user’s specific destination within the building? Does the building include proper signage so that the destination’s location is readily available? Does the chair bend or squeak? Does the chair last for years without sagging? These are the questions of during.

Products educate; they communicate; and they must do so without causing pain in the user. Once a user has finished using a product or has ended her experience with some built environment, she makes her final judgment. Hindsight has the last say on a product. In this way, a fantastically converting landing page for a terrible product which leaves its owners in regret is a bad landing page. Its end result, its goal, is a negative one.

The user marks the beginning and end of every design endeavor. From a spoon to a city, the user’s before, during, and after must work in unison to produce an ideal experience.

Download 7 Essential Typographic Layout Systems as a PDF

Subscribe and get the 52-page PDF for free.

Powered by Kit

Leave a Reply