Category Archives: design

Realism and Abstraction in User Interface Design

User interface designers (and particularly icon designers) could learn a lot from comics and the theory behind them.

Taking his cue from Scott McCloud’s excellent Understanding Comics, Lukas Mathis looks at how for optimum recognition and in order to aid understanding, user interface elements must find the sweet spot between universality and realism. Like when drawing certain comics, it’s about finding the optimum comprimise between too little detail and too much.

People are confused by symbols if they have too many or too few details. They will recognize UI elements which are somewhere in the middle.

The trick is to figure out which details help users identify the UI element, and which details distract from its intended meaning. Some details help users figure out what they’re looking at and how they can interact with it; other details distract from the idea you’re trying to convey. They turn your interface element from a concept into a specific thing. Thus, if an interface element is too distinct from its real-life counterpart, it becomes too hard to recognize. On the other hand, if it is too realistic, people are unable to figure out that you’re trying to communicate an idea, and what idea that might be.

Non-Design Skills Needed by Designers

Like in many other specialised fields, to become a great designer one must master or be acquainted with many non-design skills.

User interface designer Aza Raskin — ex-Creative Lead at Firefox and son of Jef — offers up this list of what he believes to be most important to do and master in order to become a designer:

  1. The Hardest Part of Software is Culture. Get a Book on Negotiation. If you cannot communicate, you will fail. If you cannot convince, you will fail. If you cannot listen, you will fail. […] To design is to inspire participation. Unless we can let our ideas become other people’s ideas—get others to want to champion design as their own—we will not be successful. […] The hardest part of your job isn’t being creative or brilliant; it’s communicating and culture.
  2. Know Cognitive Psychology. You are designing for people; you need to be well versed in the abilities and frailties of the human mind. […] Interface design is as much a science as it is an art. Know the science, else you are walking blindly through a minefield of harmful design.
  3. Learn to Program, Even if Poorly. Thucydides wrote, “The society that separates its scholars from its warriors will have its thinking done by cowards and its fighting by fools.” The optimal society is one that mixes scholar-warriors and warrior-scholars. The same is true for companies that schism their designers and engineers.
  4. Create, Create, Create. You’ll need thousands of hours of practice to rise to the top of your game. […] If you don’t have dozens of little projects you’ve created, learned from, and even discarded, you are doing it wrong.
  5. Study Graphic Design. Looks affect usability. Looks are just one aspect of designing for emotional beings—you need to think about the whole sensory experience of an object, from sound to touch—but looks are often the most immediately apparent.

PlentyofFish and Unusability

In an early 2009 profile of Markus Frind–the founder and CEO of the online dating website PlentyofFishInc. briefly touched on the topic of the site’s famously bad user interface, with Frind explaining why he believes that, sometimes, user experience should take a back seat as a better experience isn’t always linked to greater profits.

Plenty of Fish is a designer’s nightmare; at once minimalist and inelegant, it looks like something your nephew could have made in an afternoon. There’s the color scheme that seems cribbed from a high school yearbook and the curious fondness for bold text and CAPITAL LETTERS. When searching for a prospective mate, one is inundated with pictures that are not cropped or properly resized. Instead, headshots are either comically squished or creepily elongated, a carnivalesque effect that makes it difficult to quickly size up potential mates.

Frind is aware of his site’s flaws but isn’t eager to fix them. “There’s no point in making trivial adjustments,” he says. Frind’s approach — and the reason he spends so little time actually working — is to do no harm. This has two virtues: First, you can’t waste money if you are not doing anything. And second, on a site this big and this complex, it is impossible to predict how even the smallest changes might affect the bottom line. Fixing the wonky images, for instance, might actually hurt Plenty of Fish. Right now, users are compelled to click on people’s profiles in order to get to the next screen and view proper headshots. That causes people to view more profiles and allows Frind, who gets paid by the page view, to serve more ads.

This wonky rationalisation reminds me of Andrew Chen’s insightful reponse to the Quora question, How did MySpace, with a smart team of people, do such a bad UI/UX job with the new design?

Dark Patterns: Evil Design Patterns

I’ve looked at design patterns many times before: persuasive patterns, anti-patterns and interaction patterns. The missing link: dark patterns.

According to Harry Brignull–the designer who really started the discussion on this topic–dark patterns can succinctly be described as “user interfaces designed to trick people” or “dirty tricks designers use to make people do stuff”.

Brignull first wrote about this type of design pattern back in July 2010, followed shortly by a dark patterns presentation for designers and researchers (29m 27s) and, more recently, a presentation aimed at brand owners and marketers (25m 29s).

All of this leads to the Dark Patterns wiki: a listing of the most popular methods companies use to trick people through their user interfaces, including:

via Kottke

The Three Design Principles and The Simplicity Myth

We are confusing usability with simplicity and capability with features. This is faulty logic, says usability and ‘cognitive design’ expert Don Norman, and our interpretation of our needs is mistaken: the goal is not simplicity; it is appropriateness, usability and enjoyability.

Suggesting that what consumers really want are frustration-free, capable devices that tame our complexity-rich lifestyles, Norman looks at how the ‘simplicity argument’ is not about simplicity, but poor usability and design.

Once we recognize that the real issue is to devise things that are understandable, we are halfway toward the solution. Good design can rescue us. How do we manage complexity? We use a number of simple design rules. For example, consider how three simple principles can transform an unruly cluster of confusing features into a structured, understandable experience: modularization, mapping, conceptual models. […]

Modularization means taking an activity and dividing it into small, manageable modules. That’s how well-designed multifunction printers, scanners, copiers, and fax machines do it: Each function is compartmentalized by grouping and graphics, so each is relatively simple. […] Learn to do one function, you then know how to do all of them.

Good mapping is essential to ensure that the relationship between actions and results is apparent.

But most important of all is to provide an understandable, cohesive conceptual model, so the person understands what is to be done, what is happening, and what is to be expected. This requires continual, informative feedback, which can also be done in such a way as to be pleasurable: see any Apple product.

Emotional design is critical to a person’s enjoyment of a product, the most critical variable here being the need to feel in control. This is especially important when things go wrong. The key is to design knowing that things go wrong, thereby ensuring that people will understand what is happening and know what to do about it.

The argument is not between adding features and simplicity, between adding capability and usability. The real issue is about design: designing things that have the power required for the job while maintaining understandability, the feeling of control, and the pleasure of accomplishment.