10 Guidelines for Making a User Interface People-Friendly

I am going to write on one of my big “pet peeves” this week.  The harshest criticism of most delivered software comes from people frustrated by their interaction with the user interface. In my experience, most change requests are related to users and the user interface (UI). Now I know that most project managers are neither the designer nor developer of the UI. However, during initial design and prototype reviews, there are best practices to follow based on human factors and cognitive science research that create a friendlier product. (I work on many projects with cognitive scientists and have been told this often!)

In September 2010, I talked about the user design from the perspective of flow and functionality in “Keep Users in Mind in Your Design.”  In this post, I am going to talk more about the presentation of information or action requests to the user rather than the navigation of the software. For the following 10 guidelines, I am relying on the insightful work of Jeff Johnson in his book, Designing with the Mind in Mind and the excellent book on documenting user requirements by Karen McGraw and Karan Harbison, User-Centered Requirements: The scenario-based engineering process.

  1. Consistency. People act first on their expectations and experience. To translate that knowledge to the UI means presenting options in the same way each time the user is required to take an action. For example, if the software requires the user to consent or affirm an action before moving forward, the consent window should always be in the same place, with the same options, using the same words, in the same order. It also means that if different pages have the same capability, for example “search”, then that option should always be shown in the same place on the screen.  At Cognitive Technologies (where I previously worked) we used the Performance DNA™ methodology to ensure a match with the user’s mental model and work processes.

Grouping. Take advantage of people’s natural tendency to group objects that relate to one another. Use spacing, font type and size and nearby controls to create a natural visual group that is clearly separate from other groups. For example, this page from Adobe Photoshop Help uses white space, color, font size and symbols to guide the user to selectable options.

And here is a SharePoint page that also uses white space, pictures, and grouping to guide the user.

  1. People read pages from left to right and top to bottom. Using this knowledge, presenting data in two columns, with the left hand column being the field name and the right hand column being the field value, is more intuitive to users than placing field names on top and values beneath them. I copied this example from Jeff’s book to summarize an individual’s mortgage:

Poor

Good

$1,840.50            Monthly payment $662,611.22Total of 360 payments     Monthly payment     $1,840.50
$318,861.22Total interest paid September, 2037Pay-off date     Total of payments  $662,611.22
      Total interest paid  $318,861.22
      Pay-off date  September, 2037
  1. Breaking long lists into groups of three or four items makes them easier to read, remember and copy than a long list of numbers. For example a phone number shown as 2153345645 is more difficult for readers than 215.334.5645. Not to mention 16 digits credit card or 30 digit user license numbers.
  2. Use clean easy-to-read fonts. A contrasting background box can make text stand out; however do not use contrasting colors that cannot be seen by colorblind individuals, such as red on green.
  3. Avoid techno-jargon. Use LOGIN or SIGN IN as opposed to AUTHETICATE, for example.
  4. Do not place error messages too far from the point of data entry. People focus on a small 2 to 3 cm screen area when reading. An error message that appears at the bottom or top of the page may go unnoticed. If you must place the error message there, consider making it bright in color and blinking as our peripheral vision is effective at detecting movement.
  5. When presenting options, combining color differences with other cues makes it easier for users to automatically recognize groups and actions. For example, the Mac OS uses different symbols next to files in the process of being updated versus completed updates in addition to color differences. Your design goal is to take advantage of people’s normal brain organizing and visual detection capabilities to minimize the amount of cognitive processing required.

  1. Give users multiple ways to accomplish the same task. For example in a copy, cut or paste operation, people unfamiliar with the task may prefer a guided method using pull down menus or icons.  Others may prefer to right-click on highlighted text to bring up the editing menu. Another option is to highlight text and then drag and drop. And finally some people will choose the simple keyboard shortcut of: Highlight, CTRL+C (or X), move cursor to desired location, and CTRL+ V to paste. The important point for the user interface designers to remember is to give people options to accomplish a task that accommodates their tool knowledge.  Use good scenario based requirements gathering to create multiple ways to present information and tasks.
  2. Do not expect users to remember how they got to a step in a multistep action sequence. Show them a map or key and where they are in a process. As a matter of fact, it is good practice to give users feedback every time they take an action, because if the page looks the same after an action as before, the user may think they have failed and repeat the action.

So why do I write about making the user interface “people friendly”?  As a project manager, knowing a bit about the human factors behind effective user interface design will help when you review the UI for your project or to better understand user requirements and change requests. We are lucky at our firm because our project teams always include performance specialists who specialize in how people think, learn and work!  And that makes all the difference in the tools and solutions we configure and implement.

If you have additional gotchas or guidelines for user interfaces, please share.

What if Project Managers had Mandatory Counseling?

I was watching a police drama show on TV as background noise the other night and someone in charge was telling an officer, “What you just experienced is stressful and carries potential long term emotional impact. You need to schedule an appointment with the department shrink to help you deal with your feelings.”

Hmmm, I said to myself. Project management can be very stressful at times. I have had nightmares about unanticipated problems, start-up failures, and integration debacles. However, I do not remember anyone suggesting I get counseling support to deal with my feelings.

So I wandered around in my head and constructed this possible dialogue between a PM and a therapist.

Good morning, Bruce. Have a seat. I understand you are a project manager and you may be experiencing some job-related stress.
Yeah, I guess so.
Tell me about your job. What does a project manager do?
(Oh, good grief!) I manage a small group of very talented people trying to build software with too few resources, too little time and unrealistic expectations.
What kinds of tasks does a project manager do?
I plan, manage risks, develop schedules, handle quality control, deal with stakeholders, report to senior management, create budgets, negotiate with other project managers, write proposals, develop presentations, travel — a lot of travel — I write reports, manage personality conflicts …
Excuse me for interrupting, Bruce. But, are all of those tasks necessary for project management?
And then some. I haven’t even mentioned keeping up with new technologies, estimating, evaluating …
Ok. I think I get the idea. You have many different tasks to do. How does that make you feel?
Feel? I don’t understand the question. This is not about feelings. This is my job.
Are you anxious about work? Have trouble sleeping? Find yourself thinking about work even when you are not there?
Yeah (duh!)
Do you take me-time to relax and refresh? Like reading a book or taking long weekends? Or, just sitting quietly? Like me, even though I am talking with you, I am sitting in a comfortable chair and I can look out the window at the flowers and birds — give my mind a beauty break.
Okay
For example, don’t you feel more relaxed after you returned to work from a long vacation?
I don’t remember. Right after I got back from my last vacation two years ago, we had a system meltdown. All I could think was that maybe if I had stayed there, I could have prevented it.
You seem to have an overly developed sense of responsibility. Perhaps you need to cut yourself some slack.
(yeah, and lose my job) Being responsible is part of the job.
Sounds like you do not have much personal time. Taking time for yourself helps reduce stress and anxiety. You can actually do a more effective job when you are not stressed out. Let’s talk about your work environment. What problems at work create the greatest anxiety for you?
I guess people problems. Like when two of my team members developed a personal relationship that then went south. Now, they won’t work together and if they are in the same room, one of them shouts bad things at the other.
Can you remove one of them from the team?
No I have to work around it. We are already short-handed. I cannot afford to lose either one.
How does that make you feel?
(Is there a polite way to say this …) Frustrated, I guess.
Anything else?
Well, there’s the paperwork and useless meetings and …
Sorry to interrupt again, but I see that we are out of time. I appreciate your coming in, Bruce. We will need to meet again next year to see how things are going. Remember, the minefields of life never go away; we just get better at navigating them (stolen from “Necessary Roughness”).I hope our session helped you see the importance of relaxing and reducing stress in your life.
Well that was a fun — and relaxing — trip through my imagination.

Guess I will get back to work, now – I have at least 20 emails waiting on me to solve problems!

The Lazy Project Manager's Blog

The Home of Productive Laziness Thoughts

ProjectManagement.com

Thoughts, experience, tips and tricks on issues affecting managers and project management

A Girl's Guide to Project Management

Project Management musings for one and all

How to Manage a Camel - Project Management Blog

Project Management Recruitment, Careers and News from Arras People

LeadingAnswers: Leadership and Agile Project Management Blog

Thoughts, experience, tips and tricks on issues affecting managers and project management

Project Management Hut

Thoughts, experience, tips and tricks on issues affecting managers and project management

Herding Cats

Thoughts, experience, tips and tricks on issues affecting managers and project management

beyondcenter

Pushing the Edges Out ...

projectxpert

Just another WordPress.com site