A Structured Approach to the Art of Design

Good design is often thought to be an art, subjective and difficult to measure. Just as a US Supreme Court Justice once explained how he identifies pornography, “I know it when I see it”, many people believe you can only know good design when you use it. Does that mean there is no structured approach to the art of design?

Many people believe you can only know good design when you use it

We’ve thought about design and human machine interaction a lot over the years. While creating interfaces, we would sometimes have lengthy design discussions ending in standoffs, where we couldn't agree on a solution. Everybody felt that that their own design was better and there was no way to adjudicate between these claims. To bring some order to the chaos of the design process, we developed a framework to rationally evaluate these different design choices.

We call it LEIA, which stands for Logical Ergonomic Intuitive and Aesthetic. Just as 3D objects have length, width and height, all products can be evaluated on logical, ergonomic, intuitive and aesthetic dimensions. You can think of it as a spirited advisor helping you fight back against the galactic tyranny of bad design. This is the minimal set of dimensions needed to categorize any interface, and any conceivable change you make to your design affects at least one of these dimensions. LEIA is a fully sufficient framework for examining an interface. Here’s a breakdown of what these dimensions mean in practice:

photo Coming soon to bad design near you

  • Logical – is it internally consistent? A logical interface makes sure that things work the same way in different places within your product. Being internally consistent helps users navigate your product and attain mastery quicker. It's one of those properties which is noticed more in its absence. The English language is a great example of an interface lacking in internal consistency - there are no fewer than 10 different pronunciations of the suffix 'ough' for example. That makes it harder to learn as a language, because you need to learn many exceptions on top of the standard rules. A logical interface, by contrast, works just like you would expect, and users understand new features without needing explanation at each step. A good example is the System Preferences window on Macs - a central location for adjusting your computer's settings, where each settings item has a straightforward and consistent menu. So even if you've never added a new Bluetooth device, say, you'll know where to find the menu and you can probably figure out how to add the new device without Googling it.

photo

  • Ergonomic - how much exertion is required to operate the interface? An ergonomic interface is efficient, and minimizes exertion on the part of the user. This is especially important for routine tasks that users do every day - removing even a single click from a task makes a noticeable difference to the ergonomics. We are lazy creatures, and we gravitate towards shortcuts and tricks like flies to dropped icecream. Navigating overly complex or uncomfortable interfaces can instill subconscious resentment in the user, so it's better to simplify as much as possible. For example, buttons that the user presses often on a smartphone should be closer to the bottom of the screen, so that they're easier to access with the thumb in a singlehanded grip.

photo Areas in green are easier to reach with the thumb

  • Intuitive – is it externally consistent? An intuitive interface works like other things your intended users are familiar with. When people say something is ‘intuitive’, what they really mean is they already know how to use it. Often, intuitive design relies on a metaphor. Graphical user interfaces (GUI) for example use the desktop metaphor - 'documents' are organized in 'files' on a ‘desktop’. When the first GUI was introduced, this meant that office workers could more easily make the switch to digital, since they were already familiar with the language and concepts used by the GUI. It's important to also think of who you want the product to be intuitive to - is it intuitive to people who have already used similar products, or is it intuitive to people who have no previous experience with such products?

photo

  • Aesthetic – How do you perceive it? Aesthetics covers the way something interacts with your senses. Think about a car - the way it looks, sounds, feels (and smells?) is its aesthetic component. Aesthetics is what most people think about when they think about design, and it's often our go-to when we want to make a change. The LEIA methodology helps us understand the costs and benefits of any change, because increasing your product’s aesthetic might adversely or positively impact other dimensions as well. Aesthetics is intensely subjective though, and to know whether your product is aesthetically pleasing or not, you have to rely on your and your users' opinions. Separating aesthetics from other dimensions, and viewing it in the context of the interface as a whole makes the subject easier to approach.

photo

Much aesthetic, very wow

As you design your product, you first need to come up with your desired LEIA profile. Realistically, you can’t be great at everything. You need to decide which dimensions are crucial, and which you can skimp on. Think about what will help you achieve your goals and fit in with your branding, and assign weightings to each of the dimensions accordingly.

Let's take a look at a real-life LEIA profile - that of Traintracks. We make a big data engine that aims to democratize data management and analysis. We prioritize being logical, since it’s a new and powerful tool, and we want people to quickly master it through exploration. This is also important because we decided to be intuitive to novice users rather than initiated data experts. Emphasizing internal consistency within our system and external consistency with common but unrelated products, like operating systems, helps us target our desired end user. Because our system focuses on ad hoc questions - new use cases on a daily basis, it makes sense for us to prioritize logic over ergonomics. We also understand that to make new users comfortable using such a powerful tool, it is important for us to make sure our product is particularly appealing to the senses. Minor touches like animations, thoughtful color choices and beautifully symmetric designs help new users feel instantly empowered. Understanding our LEIA profile helps us to prioritize which things we want our interface to be good at.

Next, you use your LEIA profile to evaluate proposed changes to your design. Let’s illustrate this with an extended example. Imagine we’re the product designers at Fiat, and we’ve been tasked with improving the design of our latest Fiat 500 model. As you may know, Fiat also owns Ferrari, those gorgeous red beasts beloved of Russian billionaires. A naïve approach would be to observe that Ferrari cars have an attractive luxury brand image, and then copy some of the design elements of Ferrari into our Fiat model to spice things up. For example, Ferraris come with hard bucket seats to secure drivers around fast turns. Why not stick those badboys in the new Fiat 500? Or how about lowering and stiffening the suspension?

photo

On closer thought, that would be a terrible idea. Bucket seats and racing suspension work in Ferraris, because Ferraris have a completely different LEIA profile to Fiats. They are supercars, built for performance and status rather than picking the kids up from school. The Ferrari wants you to dream about special moments, while the Fiat is about improving your daily routines. Adding bucket seats and lowered suspension to Fiats would decrease their ergonomics, which is a priority for Fiat buyers. Instead, you could think about ways to further increase Fiat cars’ ergonomics, like adding more cupholders or increasing the size of the trunk. Unsexy, but far more relevant to your users.

photo

So let's go over all that one more time. Interfaces have four different dimensions - logical, ergonomic, intuitive and aesthetic. Each time you make a design change, you affect at least one of those dimensions. By establishing a desired LEIA profile for your interface, you can evaluate different design changes and decide which best fits your product, philosophy and brand. While design will always be a subjective and creative process, adding some structure will help you make better design choices, and ultimately create better interfaces.

John Reid

I'm a computer science student at Yale-NUS College in Singapore, currently doing an internship at Traintracks.io. I'm an information addict, avid gamer/consumer of fantasy novels, and wannabe runner.

Beijing, China
comments powered by Disqus