How People Actually Use Touch Panels And Graphic User Interfaces

Have you ever really considered how your users are using your touch panels? Try standing back and be a fly on the wall and observe as new users try to use a touch panel that they have never seen before. This exercise can be a real eye opener! What seems so obvious to you may simply baffle the average system user. This user testing is very important before you deliver your final touch panel design. It is very important that the broadest spectrum of users possible feel at ease with your touch panel layout.

A panel's first impression on a user must be inviting and instill confidence in the control system. Nothing should be placed on the touch panel screen without careful consideration of it's alignment with other objects. Because you are working with such a small area, the users will be able to take in a greater amount of information if you present it in an organized way.

Some Background - How Do People Actually See And Read?

Many of the basic graphic design principles that have evolved for print media have direct relevance to touch panel design. These conventions are based largely upon how the human eye and brain deal with information gathering. One of the most fascinating is the phenomena of how humans use quick scanning to speed up information gathering. This quick scanning is really quick. It happens in literally the blink of an eye. Within a 1/100th of a second, your eye can take in a whole page and organize it for easier reading.

When a person is presented a sheet of paper with writing on it, their brain very quickly scans the whole page and organizes how it will take in the information. In western countries, the eye usually starts in the upper left corner and scans the page from left to right. In the case of text, once the overall page is scanned, the eye will start to break down individual sentences. Something very strange happens here. Instead of reading left to right, the eye will start reading the first few characters in the first word and then it will go to the last word in the sentence and do the same. This action is repeated back and forth until the brain understands the sentence. So we actually read whole sentences from the outside inward! This is why newspaper columns are so narrow - the relatively narrow sentences are much easier to scan and read quickly. To prove this point, I have repeated this paragraphs text in two side by side "newspaper" columns below: (this may not appear as obvious on smaller displays)

When a person is presented a sheet of paper with writing on it, their brain very quickly scans the whole page and organizes how it will take in the information. In western countries, the eye usually starts in the upper right corner and scans from left to right. In the case of text, once the overall page is scanned, the eye will start to break down individual sentences. Something very strange happens here. Instead of reading left to right, the eye will start reading   the first few characters in the first word and then it will go to the last word in the sentence and do the same. This action is repeated back and forth until the brain understands the sentence. So we actually read whole sentences from the outside inward! This is why newspaper columns are so narrow - the relatively narrow sentences are much easier to scan and read quickly. To prove this point, I have repeated this text in two side by side columns below:


So which text looks easier to read to you?

This concept of "quick scanning" is something that you must consider when designing your touch panel layout. If your panel is too busy or has too much going on, it can make it difficult for the eye to scan quickly and the user will instantly feel confused and ill at ease with the panel.

The classic example of impediments to quick scanning are background images. This could be a corporate logo, a picture of the companies building or just a tiled background image. Unless it is an integral element in your design - don't include it! As the eye scans the screen, it will try to identify as much detail as it can. If you have included anything unnecessary like a background texture, image or a colored area to group buttons together, this will slow the eye down and introduce confusion and negative feelings towards your panel. This is not to say never use these types of elements - just weigh their contribution against the downside as the users scan the panel.

How Do People Actually See A Touch Panel?

The perfect touch panel would have one button in the center of it labelled "What would you like?" When pressed it would perform what ever function the user was thinking about when they pressed the button! If only we could do that...

The typical touch panel user is probably not too concerned with many of the fine details of your touch panel design. They just want to perform a task. In most cases they will be unfamiliar with the touch panel layout and they will want to understand how the panel works as quickly as possible.

They will quickly scan the touch panel and try to group the controls into understandable and usable groups. Often they are unsure of what the touch panel can do and are very intimidated.

In western countries, the eye usually starts in the upper left corner and scans the page from left to right.


Where did your eye go first? Button one or button two?

The best touch panel layout will be simple, uncluttered, well labeled and free of unnecessary detail.

What Do Users Want In A Touch Panel?

Users want to get to where they are going within 3 button presses. The fewer the better. Simply put, your users will want to see what they need to do right now. Try not to hide features on hidden pages but carefully balance this against cluttering a page with every control in your program. Structure and layout is very important but we will get to that when we look at C.R.A.P. graphic design.


Graphic Design for Touch Panels - Design IssuesDesign Issues