Design Principles at the Cinema: a UX Consultant’s tale

As a UX consultant I often find it difficult to avoid or ignore poor design, particularly in the digital world. One rather damp weekend back in August I was taken to the cinema to watch the Pixar film Inside Out. On arrival, none of the traditional ticket windows were manned leaving me in the hands of the self-service ticket machines. The resulting experience led me to conclude that the designer(s) failed to adhere to some of the most basic design principles, as I will now demonstrate.

Things started well; it was easy enough to pick the film and time. It was here however that things started to get uncomfortable.

Vue cinemas require you to pick your seat when purchasing tickets, and to do this they follow a relatively common pattern of showing a clickable representation of the auditorium and individual seats. If implemented correctly, this can be a very successful and easy way for a user to choose a seat because of the context it provides; I can see how far away I am from the screen and how central to it I am. However, in this particular instance the machine presented me with a screen of brown and grey seats. Without a key, these colours did little to make it clear which were free and which were already booked. In addition to this odd colour coding system, the individual clickable seats were rather small targets to accurately hit, even for one with fingers as svelte as mine.

Note: I believe the newer Vue self-service machines do indeed use a more obvious colour scheme so my experience may have come from an older machine.

These machines only accept payment by card. When asked to insert my card I noticed that the integrated PIN machine is very low down on the machines, meaning an average sized adult cannot see half of the number buttons or the PIN machine display when standing. You are therefore ‘forced’ to awkwardly crouch in front of the machine in order to enter your PIN, before flicking your gaze between the two screens (the large touchscreen and the PIN machine screen) to see if the payment has been accepted. A colleague of mine quite rightly pointed out that the positioning of the PIN machine is likely to be for users in a wheelchair. While this may be true, the logic is somewhat flawed as the screen is too high to allow wheelchair users to comfortably operate the machines anyway.

After completing the payment a whirring sound implied my tickets were printing. No more than three seconds and my tickets are on floor. The machine has no ‘holding slot’ for printed tickets, so it is either up to the customer to react quick enough and catch them (which is trickier than it sounds) or watch them fall to the floor. After scooping my tickets off the floor from around the feet of those queuing behind me I shuffled into the cinema feeling rather embarrassed. This is not how anyone should feel after buying cinema tickets. Overcharged maybe, but not embarrassed and annoyed.

Although this experience is not specifically web related, it does fall foul on a number of fairly basic usability and design principles that can, and in most cases should, be applied universally to digital interactions be these experienced via websites, apps, self-service machines or other channels. Below I’ve picked out the three that struck me as most culpable for disrupting my experience.

The first principle relates to how a design reflects the cultural values of its users. This means ensuring a design is appropriate and mindful of the local norms, at a cultural or society level. Much of this is so embedded within our subconscious we may often interact with objects without really considering why it works the way it does. The poor colour choices used to communicate the available and booked seats in my cinema example appears to imply that the designer overlooked a cultural norm in the UK (and the majority of the Western world). Red, for booked, and green, for available, would be far more intuitive to users as they subconsciously associate these colours with the available actions (stop/no and go/ok). This proposed solution does however have its drawbacks. Red and green are notoriously bad for those who suffer from colour blindness. Maybe then, a better solution would be to incorporate the use of colours with another, clear visual cue. The following example demonstrates how this could be achieved and satisfies both accessibility standards and reflects the cultural values of its users.

Feedback is the second principle that the self-service ticket machine ignores. Don Norman describes feedback like so:

“Feedback is about sending back information about what action has been done and what has been accomplished, allowing the person to continue with the activity.” (The Design of Everyday Things)

Feedback is therefore crucial in supporting a user and allowing them to feel confident that what they intended to do, or not, is or isn’t happening. The particular moment in this example where a lack of feedback struck me as a serious issue was whilst scraping my tickets off the floor. Other than the mechanical whirring that suggested something was happening in the machine I was given no indication that my tickets were about to be printed.

Appropriate feedback was also lacking after I had entered my PIN. The main screen with which I had completed all prior interactions displayed no confirmation that my payment had been accepted. As a key step in the journey of purchasing a ticket, this lack of payment information introduced a level of uncertainty that meant I had to keep checking the PIN machine for confirmation. In the grand scheme of things this may seem like a small issue, but the lack of consistency across input devices and poor levels of feedback caused several interruptions, resulting in a ‘staggered/broken’ process and experience.

Both of the above could be addressed, or at least improved, through the introduction of clear instructions and messaging on the main screen. During the payment process this screen could provide a status update to inform the user whether their payment has been accepted or if an error has occurred. Even mirroring the information displayed on the small PIN machine would enhance the process (e.g. enter PIN, PIN confirmed, payment confirmed, remove card) so that the user has one consistent reference point for information. A similar alert message prior to the tickets being dispersed would also prepare the user for the forthcoming action. Despite this, the way in which the tickets leave the machine would still likely mean a number of people don’t catch them in time. A simple addition to resolve this would require the introduction of a physical ticket holding tray.

Finally, the system had a number of ergonomic related issues. Most of these were linked to the physical layout of the machine, but from a digital perspective the sizing of certain buttons on the touchscreen were bordering on the unusable, particularly when selecting a seat. Apple’s minimum recommended size for buttons on a touchscreen is 44×44 pixels (although as the number of devices with retina screens increases this has since been updated to a points rather than pixels spec). The spacing between elements can also significantly impact how easy it is to hit the desired target without error. Microsoft, for example, suggest a minimum spacing between elements of 2mm/8px in an attempt to reduce error rates.

There are a great number of fundamental design principles not mentioned in this post.

I do believe however that it is important to stress that the vast majority of these design principles are still of critical importance when designing digital systems. This is because despite the rapid advances in technology, from wearable devices to evolving interaction dimensions (think Apple’s 3D Touch), these key design principles are tied to human behaviour. Perhaps somewhat luckily for us as designers, human behaviours are far slower at evolving and adopting than technology. Here at Nomensa, we put our awareness of human behaviour and these fundamental principles at the heart of our user centred design approach. It is because of this that we can create positive interactions and experiences, unlike my experience with the cinema ticket machine.