Is there any difference in element minimal sizes on 10 and 24 inch touch screens?

Question

I am developing an application which is supposed to be used on a 24" touch monitor.

There are lots of guides on physical sizes of a touch screen UI elements. All of them are saying that every button/touch-control should be at least 9-11 mm. I think it is a good advice for tablets. But what about 24" touch monitors?

Are minimal dimensions for 10" tablets same for 24" monitors?

Answer 1

Microsoft's touch interaction guidelines for Metro apps (generally used on screens like those) vary from 5–9 mm square, depending on the tolerance you provide to undo accidental presses.

Touch screens aren't all built alike, though; some are extremely precise and some are very poor with touch accuracy. As the panels increase in size to 17 inches and above the parallax effect can even make the touch accuracy highly variable on a single panel. With some technologies, the screen edges are much less responsive than the centre.

Parallax is the major effect that would make this difficult. Many touch-screen devices use projected capacitive touch (PCT) sensors which are effectively behind one (or often two) layers of glass. Even relatively thin glass (~3mm) can have a profound impact on the apparent touch location on different parts of the display (an effect exacerbated by the distance of the user from the display—exacerbated by extreme height disparities in users—and the specific area on screen the user is targeting).

It's a bit difficult to describe effectively but here's a diagram to get the point across:

The easiest way to resolve this issue (especially factoring in the expectation that different users will be at different heights and distances from the screen, and thus the yellow "perceived" hit target is in a different place for every user), is to simply expand the hit target itself (either visibly or invisibly) to accommodate fuzzier targeting.

It's worth pointing out that the effect is greatly lessened as the number and thickness of the layers between the LCD panel itself and the user is reduced. Some technology (like the infrared framed displays on most very cheap touch-screens) are practically immune to this issue, but as you can tell, there's more to answering this question than simply the size of the screen.

For what it's worth, our software written for PCT touch-screen kiosks (targeting 17- and 19-inch displays) has no interactive element smaller than 2 cm square (and even those elements are generally non-essential/convenience controls; most of our buttons are as large as 4–5 cm on their smallest dimension). On very large PCT displays (30+ inches), even those may cause issues due to the extreme parallax effects, so I'd then focus my attention on getting the front glass made as thin as humanly possible.

Answer 2

Note Fitts's Law is for pointing in two dimensional space by the way; tapping is a different action. Touch occurs in three dimensional space unlike dragging a mouse. There's lots of other stuff I could say about the differences, but the main thing is you shouldn't be trying to directly calculate it in most cases. Look to Fitts's Law as a rough guide, you should really only be actually crunching numbers with it if you're doing formal research.

Also see these interesting posts about touch and Fitts's law.

Now, the reasons for the physical minimum sizes on touch screen devices are completely unrelated to the size of the screen; they're related to what you can touch with your finger with reasonable accuracy and comfort. The minimum effective size is still pretty much the same, baring other considerations. If anything position on screen (how far to I have to reach to press this button?) is more relevant than the size, as long as you meet a reasonable minimum.

As a real word example, let's look at Windows 7. Certain elements like the Taskbar are very well designed for touch; predictable location, large enough to tap without error (mostly), they work pretty well, even though they're relatively tiny compared to the size of the screen, they're usually at least half an inch wide. Even as a compact element they work well, unlike many other default UI elements; checkboxes are quite painful to work with via touch in Windows 7.

However, since you've got much more space, there's really no reason not to make the buttons physically larger on average; it's still easier to tap a 10" wide button than a 1" wide button. Determine the best control sizes based on how important the button is, how much space you need for other elements etc.

In the Windows 7 example above (and the iOS tab bar) a minimum touch size is used because these are almost always present and always in the UI so they shouldn't get in the way. Unless your app needs to make serious and efficient use of the whole 24" display your touch points should be larger on a 24" machine. How much larger? There's really no magic number. If using it feels awkward, it's probably awkward. Go by how it works.