Are there any special design guidelines for big touch screens (30–50 inch)?

Question

I'm about to develop an application for a large touch screen (around 40″). Now to my question, are there any special design guidelines for such a large screen? I have read Android/iOS/Windows RT design guidelines, but most of them focus on mobile and tablet screens (although some of them are mostly usable even on larger displays).

Unfortunately I haven't decided which language to implement my application in (maybe Python or HTML5 but who knows).

If you have any resources or other threads where this topic is covered it would be most welcome =)

Thanks in advance.

Answer 1

The same basic principles apply whether it is a tablet, smartphone or a touchscreen, they just translate differently.

Although your touchscreen may be massively larger than a smartphone, you aren't going to have it as close to you as you would a smartphone, so the relative visual size isn't as different as you may think.

I would personally follow the sizes and dimensions for a tablet, and then scale them up a little less than is proportional. So something on an 11 inch tablet that would be say 10mm, would be something like 30mm.

You need to keep in mind that your touch screen will likely have a comprable resolution to an iPad, but just be larger, so you need to translate guideline sizes into millimeters rather than pixels.

For example, the iOS HIG suggests that tappable items should be at least 44x44, and the Android design guidelines give 48x48. Both of these are based on the idea that the tappable area should at a minimum be about 8-12mm minimum on each side.

Answer 2

Designing and testing interfaces for touch-screen kiosks is my primary responsibility in my current role, so sorry if I get overly technical or too wordy (I could—and do—talk for hours about this stuff).

---

There are many, many differences between large format touch screens and mobile devices. My strongest recommendation is to not do any design at all until you have a prototype of the hardware you're building against, because unlike designing a mobile app you can't get any sense of scale when designing a large format interface on a smaller screen.

Some of the main things to consider:

1. Large format touch-screens use different technology than most smaller touch-screens

   This is the main one to remember. Large format touch-screens generally use either infrared grid (which is a frame that sits over any other screen and uses IR beams going in each direction to detect an object touching the screen) or projected capacitive touch (PCT), which are basically a grid of very thin wires mounted behind the touch surface, and which work similarly to the capacitive touch-screen in most mobile devices, but most large format applications rely on self-capacitance (rather than the more accurate mutual capacitance).

   Each of these technologies behave differently to your mobile device in meaningful ways. Most notably, both of these technologies are generally single-point touch (or 2-point touch with some significant limitations). That means the experience of, e.g., typing on a touch screen like this is very unusual for someone who might be used to using a touch-screen smartphone (which generally accept 10 or more points of touch).

   A great number of public-use touch-screens like kiosks choose to use PCT because it presents only a flat surface of glass (with no visible bezel to catch dust and other muck). That helps with aesthetics as well as cleaning. From a design perspective, though, PCT introduces a significant amount of parallax error (as I describe in more detail in this answer):

   

   That's despite the fact that manufacturers claim accuracy to within "0.1mm". In general that means you can't rely on things like the classic Apple "44px square" recommendation for interactive elements on a PCT device; you need to build your interface to accommodate the differences in perspective that a 4'6" user has compared to a 6'6" user, which means making touch targets much larger and separating them much more significantly.

2. Large format touch screens are generally mounted onto television screens instead of computer monitors

   This has a profound impact on the usability of touch-screen systems in larger formats. At least until 4K displays become cost effective, most touch interfaces designed for screens larger than around 27 inches are going to use 1080p TVs as the displays. In some cheaper applications you might even be asked to design around a 720p display.

   At either size, you're asking a person to read and interact with a display from closer than an arm's length away, while the display was never designed to be used in that way. The main thing that affects is text, which generally looks very blurry at large scale. The ability for anti-aliasing (especially sub-pixel anti-aliasing) to fool the eye is lessened because the actual sub-pixels are (relatively) enormous.

   Couple all that with the tendency for touch-screens over 30 inches to generally be mounted in portrait (longer edge vertical) rather than landscape (longer edge horizontal), and the sub-pixel arrangement is now running down the screen. This makes sub-pixel anti-aliasing like Microsoft's ClearType look downright bizarre because we're not used to text on computer screens being fringed on the top and bottom of the glyphs.

   All that means you need to be very cautious of the way you use text on screen, and even the colours you use for text and its background. You'll need to take special care with text sizes, which need to be small enough to be readable from a very close distance, while being large enough to be easily legible on a low resolution display.

3. You generally can't take in the whole interface at once

   Once you get over about 15 inches in either dimension, you can't really take in the whole display from the viewing distance of a touch-screen (which is generally closer than a computer screen). I often watch users interacting with large format screens and two of the main things I observe in poorly designed touch-screen interfaces are: users having to physically move their heads from left to right like watching a tennis match to take in a wide landscape screen as it changes; and users needing to step back to read the interface, then step forward to interact with it, then back again to read it again, and so on. The next main thing I observe (as a freakishly tall person myself) is issues with the height of the display (which dramatically affects parallax, and can introduce viewing angle issues too), but that's probably outside the scope of this answer.

   These issues are obvious when observing users interacting with a kiosk but practically impossible to design around without having the physical hardware to test against. Worse; as someone intimately familiar with each screen of the application, you have the curse of knowledge; by knowing what each screen contains and where, you know just where to look, and as such you can't really empathise with someone who's never seen it before.

   That means you have to depend even more on the use of hallway usability testing during the design stage (and the only way you can really test that is on the real hardware device).

4. There's no standards in this market

   Your users will invariably have used other large format touch devices; parking ticket machines, ATMs, information and wayfinding kiosks, etc. All those separate systems built by separate people with separate needs provide context for your users that you'd probably rather they didn't have. For example, one system might locate the "back to start"/"home" button in the top right, and now your users are (at least a little) confused as to why your equivalent button is in the bottom left.

   These other systems will have varied in quality, too; many of these hardware systems are assembled very cheaply in China and end up in front of users with poor touch-screen calibration and/or very poor touch response. Expect your users to be unsure whether or not your device registered their input if it doesn't react immediately. Expect them to apply an unreasonable amount of force to the screen if their first press didn't activate the button they expected it to.

   The single best trick we have to fix this issue is to add a "touchpoint" cursor that shows up when the user clicks on the screen. Ours is just a simple white circle, slightly bigger than the user's finger that shows up when the user taps on the screen, then fades out fairly quickly. The other, incredibly obvious and important thing is to build "depressed" states on all your buttons.

Answer 3

You might want to consider how you require the user to use gestures and swipes. Touch alone might be fine - but imagine if the user needs to keep dragging stuff around a 50 inch screen.

Bigger screens will make the user feel they have to make equally big gestures, and prolonged use that requires frequent gestures and repeated touch will be rather wearing on the arm muscles, (not to mention the finger tips), since the angle of the screen is likely to be vertical or flat horizontal for example, rather than held in the hand at a position that makes it convenient for the user.

It's also likely to involve use of both left and right hands rather than a continued foot shifting movement, so think about location of interactive areas and inter-relation between them.

I would suggest watching some videos of large screens like the Microsoft Surface and TouchWall in use to see how people engage with it, because it's a much more physically tiring technology to engage with.