Lessons on Jakob’s Law from an inflight entertainment system
Good design is invisible. This was a great lesson for me recently when I was on a long-haul flight struggling to navigate the inflight entertainment system’s interface. I was trying to choose a movie to watch to pass the time, but the system’s design was different enough that I recognized that there was a mental load needed to learn how to use it. That was when I decided to do a quick analysis of the screen in front of me as a UX design challenge. I mean, how else was I going to spend the 11 hours left on the flight?
It was luxurious that even in economy class, we all had large, iPad-like touch screens in front of us to watch movies, TV shows, listen to music, or play video games for free. I tapped the movies tab to check out my choices for the evening. The first thing I noticed was how small the window for the selected movie was. The window was in the center of the screen with plenty of empty space around it. A horizontal row of even smaller thumbnail images extended from both sides of the window for the selected movie, indicating horizontal scroll to select other movies.
The inflight entertainment screen
My first instinct was to tap on the sides of the window to get to the next movie option, but nothing happened. I then had to tap around to discover that I had to horizontally scroll the row of thumbnail images to see other movie choices.
One issue with this method of choosing movies is the precision needed to accurately tap on the row of thumbnails in order to be able to scroll it. Furthermore, since there is no error prevention to stop the horizontal scroll from overshooting, even more precision is required to stop at the right movie. This is an awkward design decision, since we were in an unstable environment with possible turbulence at any time, which would make tapping with precision difficult. Requiring precision in the interaction is also a poor design from an accessibility point of view, considering the vast range of ages and needs among airline passengers. For example, some passengers have dexterity issues that require larger touch targets.
Here is a video example of me interacting with the screen trying to choose movies
I kept wondering why this user interface was designed in a way that was both different and unintuitive. Then I realized that this was a real-life example of Jakob’s Law: the principle that users prefer to have sites work the same way as other familiar sites, as that decreases the mental load for the user. It was one thing to learn about this in class; but to actually see it happen in person was really exciting.
Thinking about the issues with the inflight entertainment system in front of me, I began to think of how I would redesign the user interface to be more like other sites that I am more used to, such as Netflix, Apple TV, or Spotify, and to consider designing for accessibility.
Regarding accessibility, the small size of the thumbnail images creates a challenge for people with low dexterity or vision, especially in a darkened environment like the plane. Furthermore, since the thumbnails don’t include the names of the movies, the user is required to take the additional step of scrolling the image to the main window (with precision, I might add) in order to see the name of the movie.
One more source of confusion for me was the lack of clues like page numbers to indicate how many other movie choices are in the horizontal scroll bar. Without the indicators, users can end up with a feeling of confusion or decision fatigue as they scroll seemingly endlessly.
I decided to create a quick mockup of what I think could be a better design based on more familiar user interface patterns. Some of the original design elements were kept for consistency but the changes I made are listed below:
Increased the image and typography size for increased visibility
Moved the thumbnail images to the bottom so they no longer hide behind the main window
Changed the thumbnail images to actual movie posters so users have more information about the movies immediately
Added large caret symbols so one can just tap to get to the next page. No precision required and no overshooting
Added page indicators on the bottom to show the page number
Combined the Play and Pause buttons for simplicity
The redesigned screen
Of course, actual usability testing will be needed to confirm that my mockup is more intuitive and accessible. That said, it was a fun exercise I gave myself to practice some design skills and try to improve an experience that made Jakob’s Law come to life for me. Sometimes I think designers want to be creative and design something that is unique. It is good to be creative, but in actuality, good design also has to be invisible so that users won’t even notice it because of how easy it is to use. This was a good lesson to learn while on my long-haul flight across the Pacific Ocean.
