The state of Inductive User Interface (IUI): here to stay

Back in 2004 I left Rockwell Software (a subsidiary of Rockwell Automation) to join a small company that needed technical and design leadership for a potential touchscreen application for the pharmaceutical industry. As part of my design, I had to do research on usability of touchscreen interfaces. This led me to study panel designs in Japan and the manufacturing industry and eventually Inductive User Interface (IUI). IUI is a user interface design approach that emerged with Microsoft Money 2000 and has infiltrated many of the software applications we use today, most notably Windows itself.

IUI emerged as a realization that there are two different classes of use of software. The first is through deduction which is common to power users such as myself that are typically programmers, IT personnel, or other more technically sophisticated roles in an organization. When a new application is installed on our computer, we typically flip through the menus at the top of the window, or hover over the tooltips of the toolbar buttons to find out what was available. Sure there is online help, but we can usually deduce what to do simply by exploring these common controls. Deductive user interfaces are better for people who use the same application over and over again. Once a graphic artist has used Photoshop or Illustrator for a while, they want many actions available in the same place and in the same screen. An IT administrator also needs a single page they can use to administer a user account and modify anything about them.

Microsoft realized that the other way most use software is infrequently. The most common example of this is the control panel in Windows. Many home users of Windows rarely use the control panel and so when they go in to configure settings, they don’t remember anything at all about the screens. IUI makes the user interface’s purpose on each screen explicit – there is no exploration or guesswork involved. It also forces UI designers to break the software up into more steps or screens, and as a result will slow the process down some for power users. However Microsoft (correctly) determined that the 80/20 rule applies here – 20% of users of their OS are power users.

This screenshot from Microsoft’s IUI guidelines whitepaper (published 2001 but still very relevant as I’ll get to) illustrates the paradigm shift well:

ms997506.iuiguidelines02(en-us,MSDN.10)

Microsoft Money 99 “Account Manager” screen

The first thing a user thinks when reaching the page is “what can I do here?” The title says “Account Manager” but the primary purpose of the screen isn’t clear. There are buttons on the bottom of the screen that allow the user to do something, but they are disabled until an item from the list is selected. Additionally, there’s no easy way to get back to the previous page or a “home” screen of sorts.

Here’s Money 2000’s version of the same screen:

ms997506.iuiguidelines03(en-us,MSDN.10)

Microsoft Money 2000 “Pick an account to use” screen

Here the purpose of the screen is clear – “Pick an account to use”. Once the user selects an account from the hyperlinks on the right (which still show the rollup dollar information) they are then presented with a new page with links that allow them to do things with that account. Links are available allowing them to navigate back to the previous page. Additionally, IUI allows for a “task panel” of actions on the left or right side of the screen that are related to account management but not a single account itself.

Read the full whitepaper for more information about the background of IUI. Interestingly, Microsoft’s Windows Vista, and more recently Windows 7 User Experience Interaction Guidelines don’t mention IUI explicitly but the common controls of the operating system are designed for these exact types of user interfaces. Specifically, check out Silverlight and WPF’s navigation framework that allows you to create separate pages easily with built-in browser-like “back” and “forward” buttons. A look at any Windows control panel applet, many screens and dialogs in Visual Studio 2010, as well as the task panels in Office show that IUI is a powerful tool throughout Microsoft’s suite. Other vendors like Intuit, Apple, and Google regularly use IUI in store checkouts, configuration screens, and other infrequently used parts of their applications.

I’d encourage you to learn the IUI design principles and adopt them to the way you design software for your clients to give them more usable interfaces. Here are a few of the ones I use the most (and some I’ve come up with on my own).

  • Select a title that asks the user to do something.

    • Don’t use the words “and” or “or”. If this happens – you need to design two screens!
    • For screens that allow the user to review something, make the title “Review the details of this <object>”.
  • Include an instructions line below the title that gives additional information about what’s presented. For example in the Money 2000 screen above this line might state “Account totals are listed to the right of each account. To perform more actions on the account, click on its name.”.
  • Avoid horizontal scrolling (and vertical if on a mobile device or tablet/touchscreen!).

    • If you have a grid, show only the most important columns of info about an object being viewed.
    • Allow the user to select the items in the grid to get more information about them.
    • Alternatively, don’t use a grid and use custom XAML or HTML markup that creates rows of detail/header information.
  • Place “global” actions (like “Home” or “Logout”) in a dedicated panel at the top or bottom of the screen where they are always available.
  • Make mockups in Balsamiq, Sketchflow, or another low-fi mockup application of the main screens

    • Once you have the mockups go through the flow of the application and look for opportunities to connect related screens through related actions on the task panel.
    • Identify user roles that need access to each page and/or link and design your permission system around this.
  • Designs screens after domain objects in the business’ natural language e.g. Orders, User Accounts, Patients, Subscriptions etc. Then design the related screens for each domain object.
  • When you have more than 5 actions that can be taken on an object selected in a previous screen, break the actions up into categories and make the user select a category first. These are “category navigation pages” and I’ve found numerous cases where they make an application highly usable.

IUI is not a perfect fit for every application, but many product managers and power users at companies who are designing new versions of their applications, or new products altogether, do not have a background in modern UI design and are unaware of this approach. They can also be tainted by previous experience and knowledge, leading them to believe their user base doesn’t need things to be broken up into “so many screens”. Use the research Microsoft has provided and examples of modern applications as leverage to open up the discussion and enable them to take part in designing the software in a more usable fashion. Whenever I’ve had the opportunity to use this approach, the results are often eye opening to everyone involved and can have a dramatic effect on users understanding the big picture of their flow of work.

Social networking as a tool for consulting: making client and colleague relationships personal

By now it’s undeniable that the scale of usage of social networking, as this info graphic on Facebook presents, is impossible to ignore for web savvy businesses. My employer, Catapult Systems, asked employees to consider enhancing their personal brand by signing up for a Twitter, Facebook, and Linked In account if they didn’t already have one, and also offers a set of aggregated blogs on blogs.catapultsystems.com that are straightforward to link to your own personal blog.

When this request was first made, the blogging aspect seemed natural to me. The benefit of bringing more traffic to my blog from technical folks I do business with through my day job and the returning visits to Catapults’ makes a lot of sense from a marketing standpoint. However with so many companies banning Twitter and Facebook due to the frequent flow of information coming in, our CEO still surprised me with his willingness to take a chance on the risk that employees could abuse this power. Though Catapult has some of the most personable, professional people I’ve ever worked with there, it still seemed like an exciting experiment at first.

What I’ve found however, is that for a consultant so much of being effective means understanding the clients you do business with as people, and their personal needs on a day to day basis. When most people think of Facebook friends, they think of distant relatives, old friends from school, and past loves. To share a thought on life, pictures of something you did in your spare time, or a recent challenge once privy only to your closest and most immediate friends can now be communicated en masse to the whole of your global circle. At first this can seem trite – why would these people care? And going further, why would the folks I work with, or the clients that pay me to solve their problems even want to know?

The reality is that between setting vision, gathering requirements, designing and steering, development activities, and (hopefully) happy hour celebrations on a successful project there is much more dialogue related to life outside of work than we care to acknowledge in this trying economic time. And people bring with them experiences and connections to other industries and aspects of life that can be helpful to each other in ways that enhance their personal lives, and as a result, their working relationships. Healthier working relationships lead to improved efficiency and general wellbeing within a project or organization.

Since following more of my coworkers (and a few clients) on these networks, I’ve had some find that I’m a recreational cyclist, musician, and father. This has led to sparking conversations about riding to work, the music we listen to while writing software, and strategies for having a solid work/life balance when children are involved. These conversations, and the resulting changes in life that follow, have a healthy, positive effect on how we feel when we arrive on the job each day, and the ability to understand what drives each other. Many companies when interviewing technical candidates ask “what are you passionate about?” and get responses about technology X or some industry expert’s blog. But when we are honest with each other as human beings – a job is still just one vehicle to use in our journey towards wherever we’re going with life. What drives us is often much more, and sharing that with others improves trust and encourages breaking down barriers to communication.

There is still the issue of managing the time spent on social networks, and for me the solution came in the form of an excellent chat client with some advanced social networking features. I was first introduced to digsby by a colleague of mine, Josh Handel, early in 2009.  Digsby lets you use a variety of chat networks much like other available programs that have been around like Trillian and Pidgin (formerly Gaim). However it was first to the gate with deep social network integration and lets me be notified of activity in my twitter, gmail, facebook, and linked in accounts while I work. The team also releases updates whenever a compatibility issue arises between that service and digsby quickly.

The digsby task tray shows your configured social network connections (shown here in the Windows 7 taskbar) and the number of “updates” for that service:

digsby_tray
digsby’s Task Tray Icons

Once running, digsby will pop notification icons on your desktop whenever something happens in one of these services. This lets me instantly see when a colleague of mine adds a new connection in linked in, I get an email in gmail, someone needs help on Facebook, or something interesting happens on twitter.

digsby_notification
digsby’s Automatic Notifications

I’m able to ignore the updates that aren’t interesting to me without having to scan the full web page for that service, and take action by clicking on the notification when it’s of use to me. I follow several technologists including Martin Fowler on twitter, and I’ve had several times when tweets from them have linked to content that helps me solve a technical problem, or explain a process issue to my client. Of course I still have to avoid clicking links that take me to photos (however cute) of friends kids, and stop myself from reading a technical link if it turns out to be some rant about a technology that isn’t helping me solve a problem. But with great power comes great responsibility, as in all things.

Finally, each icon can be clicked on to show a panel for that service with most of the information you’d see on its web page. Updates can be scrolled and links of interest can be clicked to open your default web browser to that page.

digsby_facebook

digsby’s Facebook Panel

I remember back in high school having friends that you saw outside of school, and friends that you were personable with in school but never saw at home. I think of social networks as an enabler to a greater circle of trusted friends. These networks become a catalyst for forming deeper connections with people you normally do business with, and encourage making them a bigger part of your life and as a result, trusted advisors at work.

The subtleties of the iPad announcement are brilliance in marketing

Without going into a big diatribe about how great the iPad is or how bad it sucks, and what the hardware specs are, I thought I’d bring up a couple interesting things about how it is being brought to market that continue to show Apple’s brilliance in marketing.

First, yes there will be Apple “fanboys” who buy the iPad that already have a Macbook, iPhone, or whatever whether they need it or not. However I think the market Apple is really targeting are less sophisticated potential netbook users. Look at Google’s Chromium project’s Chrome OS. This OS is a great idea in my opinion, and this is coming from someone who NEEDS a PC to do his job. People like my Mom have a laptop already but hers is aging, and she never uses any CPU intensive programs. She just wants to use Facebook, surf the net, look at and upload photos, view email, and view a PDF every once and a while. This is all doable in the browser today with all the online sites.

The iPad is targeting this same group of people, but via a typical Apple design approach, they have spent the time to make the integration between several more frequently used applications extra seamless. Chrome OS will be a great experience, and Google’s online apps do integrate and offer a simple user interface, but Apple always has that little bit of extra sex that makes selling their products easy to less-technical users. The backward compatibility with the iPhone apps is also a great way to get a bunch of functionality out of one of these devices for little to no cost on day one.

Secondly, I know Apple is waiting for FCC approval and we’ve seen stories of pending lawsuits, but I think the fact that you can’t order an iPad yet is also strategic. With the Tablet concept having been tried before over the years, Apple is feeling out the feedback of its initial announcement from the current generation of users. I think they have the will and way to make last minute adjustments to the feature set and hardware specs to see this thing hit big. Only time will tell.

Follow

Get every new post delivered to your Inbox.

Join 78 other followers

%d bloggers like this: