The Twelve Principles of Great UI Design

The sub-title of this series of blog posts addressing UI Design is: “Creating User lnterfaces for Applications That Are Easy to Use, Look Good, and Drive Customer Adoption.”

The twelve principles of UI Design focus a designer’s or developer’s efforts towards these three points:

  1. Easy to Use
  2. Look Good
  3. Satisfy the Customer

That’s what you’re trying to achieve, and if you create UIs that are easy to use, look good and satisfy the customer, you will drive customer adoption. So that fourth point is really to not only satisfy the customer, but to get that customer or potential customer so satisfied that they will buy and use the product–and the word-of-mouth creates a tsunami of growth.

Thus the three points become:

  1. Easy to Use
  2. Look Good
  3. Drive Customer Adoption

That’s WHAT you want to accomplish. HOW to accomplish it, that is the six million dollar question!

And thus we have twelve principles of UI Design that, when followed, result in killer User Interfaces that ARE easy to use, look good, and customers buy it. In volume.

The Twelve Principles

  1. KISS—keep it simple, stupid.
  2. A sense of aesthetics.
  3. White space is good for background!
  4. Use space as a border and separator
  5. Consistent color theme
  6. Color gradations add appeal
  7. Ergonomics: Functionality wins!
  8. Alignment! Alignment! Alignment!
  9. Organize the page into logical groupings
  10. Keep fonts in a similar style or family
  11. Have actions clearly visible to execute
  12. Shade alternate rows or columns with a light hue of the main color.

I’ll cover each of the above points in much more detail in further posts.

 

©2017 Curt Larson. All Rights Reserved.

Advertisements

“Art” and UI Design

No matter what document or specification or standard is used, good UI design, like fashion, has a subjective quality to it. In other words, there is still opinion involved on whether or not someone likes it. It’s like that age-old quote about art: “I may not know what art is, but I know what I like.”

The twelve guidelines remove the subjective aspect of evaluating a UI—or at least reduce it substantially! There IS a technology to UI design, there ARE basic principles that result in better interfaces.

The ultimate arbiter is the customer and how well volumes of customers like and adopt the product. The UI is the first, the foremost, and the primary interaction with the product by the customer and thus has a huge impact on the success of a product. It’s worth getting it right.

Good underlying code impacts the performance of a product and the reliability of a product. Long-term satisfaction is obtained by having bug-free software and good software performance.

Yes, following good coding practices and making code tight and efficient are good engineering principles to follow and certainly help speed subsequent releases. I wholly support–and recommend–good engineering practices that result in logical code that is well laid out, well-documented, that can be upgraded and updated without tearing one’s hair out.

However it’s the UI that drives success. The underlying code can be a rat’s nest but as long as it works and looks good, will the typical customer care?

You can have a great product. The code is tight, well architected, robust, with nary a bug in sight. But if the UI is plain jane, if the user interaction with the software is clunky and it’s hard to use, your success will be limited.

(Yes, some software products have succeeded in spite of themselves. Government regulation, filling a specific market niche, the only product available, killer marketing, there are factors that can drive a product to success in spite of itself. But if they had a great UI…)

With the UI the most important part, how to you design a great UI when there is a subjective quality to “art?”

The fact of the matter is, there are technical factors with art that make it appealing to the viewer. “Good” artists know these things, either instinctively or by training and apply them. While there will always be a subjective quality to what is considered good–cars come in MANY different colors, for example–there are certain principles that apply to great UI design.

There are reasons why people like certain things. With the User Interface, just as there are technical laws behind what constitutes good “art,” there are certain principles that define a great UI. I have identified twelve principles of UI design that, when applied, result in great UIs.

What we’re going for is a UI that looks good, is easy to use and satisfies the customer. Following the twelve principles will result in a good UI. To make a great UI, it takes that artistic touch, that drive to perfection, applying the basics with a touch of flair.

In my next post, I’ll get into the twelve principles. Stay tuned!

 

Classics Rock

I think a true classic endures the test of time. As a car fanatic, certain car designs transcend the era in which the vehicle was built. What looked great fifty years ago still looks great today.

For example, the Duesenberg looks fantastic and I love to look at the lines and curves and swoops of an excellently restored example. The Bugatti Atlantic Coupe and Talbot Lago, similar styling in my mind, take my breath away.

I still think the Jaguar XKE, coupe or convertible, is the sexiest car ever made. The 1963 Chevrolet Corvette split-window coupe remains an icon and I wish I could afford one! The ’57 T-bird still turns heads driving down the street. There are more on my list of personal favorites, such as the Ferrari 250 GTO and the Ford GT40.

Today’s styling is completely different than these classic cars. Yet these great car designs persist over time, turning heads and capturing hearts of new generations. Some cars are so classic, car companies are re-creating them today.

In short, the Classics rock, whether it’s cars, music or great UIs.

While people get nostalgic over the Commodore 64, the Apple II, the Altair, the Tandy, and even Pong, Asteroids and Pac-Man are remembered fondly, if I ask, “What are the classic UIs?” nothing really stands out. People might answer, “Windows 3.1” or “the Macintosh.” Not because the UIs were great, but because these UIs were a quantum leap in functionality.

What makes a car design become a classic can be boiled down to a couple of descriptive words: Elegance, style, flair. Great cars evoke a passion within us and new generations still look at these examples and go, “Wow!”

I believe that great UIs can be created with elegance, style and flair, and these transcend the latest fashions. You might say we don’t need a UI to create passion, but why not? Mac users love their Macs. It’s not just because their MacBook Air weighs 12.7 ounces and practically levitates in the air. They have an interaction with their pc that is generated by the UI.

Whether you’re following the Metro trend, or the Apple trend, or some other “style” (style as in type, or kind), a great UI has an aesthetic quality to it that is pleasing to the eye. Whether the buttons are mono-color or the old “3D” look, an elegant UI is an elegant UI.

Great UIs are well laid out, with the bits and pieces well organized, it’s easy to read, it’s easy to use. They’re not just utilitarian, they have some flair to them, a touch of elegance, a dash of class.

My personal opinion is: don’t worry so much about the latest trend. Instead worry about functionality and elegance, flair and class. AND if you can incorporate the latest trend, then do it! Creating a UI that follows (or leads) the latest trend shouldn’t be the primary design consideration, making a great UI should be #1.

Create the Classics.