User Interface Design: Complexity vs. Flexibility

While building a report a few weeks ago I realized something I’d never thought of before: in user interface design, the more flexibility something offers, the more complex it tends to become.

This is an obvious conclusion, but I had never thought of it in these terms before.

A Simple Report
A few weeks ago I built a report. The first iteration used a hard-coded SQL query called by a page with no visible input parameters. The UI was delightfully simple: a single button marked “Run Me.”

The next step in designing something usable was to add two input fields for the start and end dates. At that stage I had a report that was fairly simple, but not very flexible.

Next, I added three parameters that allow a user to narrow the report by Customer, State, and City. With that the report became slightly more flexible, but also more complex. Luckily, this is where the complexity ended (read: the need for flexibility ended). It’s a good thing, too, because the interface was beginning to look busy.

If I had continued along this path to absurdity, I could arrive at a single text area for inputting SQL queries. This approach would be extremely flexible, but far too complex for business users.

Shopping Carts
Another example of this inverse relationship between simplicity and flexibility can be illustrated with online shopping carts.

Someone asks me every month or two about online shopping carts, typically: “If I want to sell a product online, which shopping cart do you recommend?” My first question is always: how technical is the person who’s going to manage it? (read: how much complexity can they tolerate?)

The simplest option is something like Yahoo! Stores or Shopify. Simple, yet configurable to the extent Yahoo! or Shopify allow in their control panel.

A more flexible approach is purchasing an off the shelf shopping cart that can be customized by a programmer. Products like .netCART contain loads of functionality, but they’re geared towards technical people rather than business owners, since they are too complex for the average person to configure. They offer loads of flexibility with lots of complexity.

And finally, the most flexible shopping cart one coded from scratch. Super flexible, very complex.

Cake and Eat it, too
With an entire design movement built around simplicity, it seems warranted to ask: can a design be simple and flexible at the same time?

In thinking about this, Gmail comes to mind since it’s simple enough for my mom to use, but flexible enough to serve the needs of more advanced users (and once they get POP3 retrieval out of beta it will be that much more powerful). Google achieves this by making common tasks obvious, and uncommon tasks hidden. Want to send an email? It’s right in front of you. Set up POP access? It’s in the settings menu. The more advanced items are hidden from beginning users, but the key is that they can accomplish 99% of their tasks without every looking in Settings. In fact, that’s one way Gmail succeeds where Outlook fails.

I also find the WordPress blogging engine flexible and powerful, yet surprisingly simple. As with Gmail, the WordPress team has managed to create a product with a ton of features that somehow leads beginning users to where they need to go quickly and effectively. I’ve introduced several newbie bloggers to WordPress, and never once have I had to answer basic questions you’d expect (“How do I create a new post?”, “How do I change the skin?”). Yet WordPress is insanely configurable through the administration console, its configuration files, skins, and add-in modules.

These applications do a good job of making common tasks trivial, while shielding the user from advanced tasks until they have the need or motivation to seek them out. These applications are not simple, nor are they feature-limited, but they do an amazing job of catering to beginning and advanced users at the same time.

The Holy Grail of UI Design
In doing so these applications provide flexibility and simplicity simultaneously; a feat that’s difficult and often expensive to accomplish because it fights the natural tendency towards complexity. Ultimately, I believe this combination is the holy grail of UI design.

Start Small, Get Big
Growth Secrets for Self-Funded Startups. It'll Change Your Life.
What you get for signing up:
  • A 170-page ebook collecting my best startup articles from the past 5 years
  • Previously unpublished startup-related screencasts
  • Exclusive revenue-growing techniques I don't publish on this blog
"The ideas and information Rob provides should be required reading for anyone that wants to create a successful business on the web." ~ Jeff Lewis
Startups for the Rest of Us...
If you're trying to grow your startup you've come to the right place. I'm a serial web entrepreneur here to share what I've learned in my 11 years as a self-funded startup founder. Luckily several thousand people have decided to stick around and join the conversation.

For more on why you should read this blog, go here.

11 comments ↓

#1 http:// on 02.05.07 at 9:15 am

I agree but you’re stopping short of the real story here… that is, what were the elements of design and HCI that wordpress and gmail implemented that allowed them to reach such a lofty balance of simplicity and flexibility? iow, how can we design solutions which cater to both the beginner (by being simple to use) and to the expert (by being flexible and configurable)? I look forward to part 2 ;o)

#2 http:// on 02.05.07 at 4:47 pm

your use of inverse relationship here is a little skewed, but I think I understand the point you’re trying to make.

#3 rwalling on 02.05.07 at 6:01 pm

Babak – thanks for the input. Looks like I’ll have to delve deeper into this topic. Amit – Tell me more about how my use of inverse relationship is skewed.

#4 http:// on 02.05.07 at 7:00 pm

http://en.wikipedia.org/wiki/Inverse_relationship Usually an inverse relationship is where one value increases as another value decreases as the wikipedia definition states. But, your example states “the more flexibility something offers, the more complex it tends to become.” That looks like a direct relationship to me.

#5 http:// on 02.05.07 at 7:03 pm

You’re probably better off stating “The more flexibility something offers, the less simplistic it tends to become.” Which basically boils down to the same thing you are stating.

#6 Ilya Grigorik on 02.05.07 at 7:51 pm

Interesting read, but I think the inverse relationship is too simple of a theory. Let’s step outside the world of software development for a second and look at ‘adjustable seats’ in your car. Some of the higher end models have a dozen adjustable settings – it’s both a complex and flexible system. However, now assign each position a toggle and lay them out on the dash. Will you ever remember which is which? Probably not. But, if you lay them out in the shape of the seat itself, all of the sudden it becomes easy and simple. (presence of a natural mapping) Complexity and flexibility are definitely not one to one. You can make a project more complex without making it flexible and vice versa.

#7 rwalling on 02.05.07 at 7:54 pm

Amit – I’ve changed the wording to what you’ve suggested in order to better map to an inverse relationship.

#8 John on 02.05.07 at 7:55 pm

This reminds me of the old program PC Tools/PC Backup, back in the DOS days. One of the menu bar headings was something like “Complexity” and the choices below were something like Simple/Medium/Advanced. Of course, the default was simple.

#9 rwalling on 02.05.07 at 8:08 pm

Ilya, Thanks for your feedback – you make a good point. Thirty years ago I bet that car makers would have placed a set of toggle switches on the dash and expected you to remember them. This would not only be easier to design, but cheaper to build. This is how a lot of application developers approach application design – do what’s easy to design and cheap to build. So I do think complexity naturally increases as flexibility does, but there are ways around this tendency. But those ways require additional design work or additional constructions costs…or both. And that’s the point of this post. Finally, I don’t think the converse is true; in other words, a project does not becomes more flexible anytime it’s made more complex. Since my statement of an “inverse relationship” does indicate the converse to be true, I’m going to remove that piece and leave it as the more simply stated: “…the more flexibility something offers, the more complex it tends to become.” Thanks for your insight, Rob

#10 http:// on 02.08.07 at 9:08 pm

are talking about the software itself, or the user experience? something highly configurable by the end user will be less flexible for the developer. a single report may seem more flexible to the user, but its actually more code and more complexity they’re seeing. don’t flexibility and simplicity often go hand-in-hand. XML being an example. by adding tons of preset search parameters as in your first example, aren’t you really making the software itself less flexible?

#11 admin on 02.09.07 at 4:13 pm

I’m talking about the user experience of the software. XML is very flexible, and it may be simple for a software developer to understand, but what if I gave it to a business user and told them to edit it? I’d have to create some kind of GUI editor on top of it that limits his options (thus reducing flexibility). Adding tons of preset search parameters makes the software more flexible from a UI perspective – it allows a user to be more in control of the data they see.