When Copying The Physical World Helps The UI, and When It Doesn't

Wait 5 sec.

When Apple revealed the Liquid Glass design system last year, the design community went back to an argument it had been having since iOS 7. Some designers welcomed the return of depth, material, and texture after years of flat design. Others saw it as unnecessary decoration and argued that legibility and convenience were traded for pure form, without adding much function. The argument went nowhere in 2013, and it went nowhere this time, because the debate mostly focused on whether interfaces should look like the physical world. But that's not the most important question here.\Every few years, Apple gives its interfaces a new look. In 2007, we had a leather-bound Contacts book and a yellow notepad for Notes. It was the style of one era, and the era's end. A look that felt current when the iPhone shipped looks dated now simply because trends have changed. Later, the icons became flat and minimal, and now shadows and depth are back again. But the same thing will happen to Liquid Glass look.\The way the screen responds to your fingers, however, has stayed nearly the same. The rubber-band bounce (when you reach the end of a list and keep pulling, the content stretches past the edge and then snaps back) is almost 20 years old, and nobody has ever called it dated. Inertial scrolling (when content keeps gliding after your finger leaves the screen and slows down as if it had mass) is about the same age and feels just as right now as it did in 2007.\The behavior lasts because it mimics the way real objects move, and that never goes out of fashion. Flick a list, and it keeps moving after your finger lifts, then slows to a stop, the same way a glass slides and settles when you push it across a table. Flick harder, and it goes farther. Nobody has to learn this, because it behaves like the physical objects you handle every day. A list that scrolls this way will feel just as right in twenty years as it does today.\This is why iOS 7 actually wasn’t such a drastic change as it looked. The flat redesign removed the images of the physical world but kept the physical behavior underneath, and Apple kept refining that behavior in the years after. Animations are the clearest example. A screen sliding in or an app opening is no longer a fixed sequence that has to finish. You can catch it with your finger mid-motion and push it back, the same way you can stop a real object that is still moving.\Pull-to-refresh shows how a movement borrowed from the physical world turns into a habit people stop thinking about. When Loren Brichter created it for his Twitter app, Tweetie, in 2009, it behaved like a physical object. You are at the top of a list, you drag it down with your finger, it stretches and resists like a rubber band, and when you pull far enough and let go, it snaps back and loads new posts. Today, nobody doing this thinks about rubber bands. The movement became a standard affordance that people simply know, and the physical feeling behind it faded while the muscle memory remained.\None of this would have surprised Jef Raskin. He started the project that became the Macintosh and spent his career studying how ordinary people use computers. In a 1994 paper, Intuitive Equals Familiar, he argued that no interface is ever truly intuitive, only familiar, which means it’s built on a skill the user already learned somewhere else. The physical world is a rich store of such skills that everyone already has. But you also have to know when to use them, and the look is usually what tells you. This is where skeuomorphism can be useful.\Nielsen Norman Group ran eyetracking studies on flat interfaces and found that weak clickability signifiers made people scan more elements and spend more time finding targets, a state they called click uncertainty. The shadows and bevels that flat design treated as decoration turned out to be useful. A button that looks slightly raised provides a physical affordance ("press me and I will depress"), and removing the affordance costs seconds and causes doubt.\However, there is a fine line between borrowed looks and borrowed physical behavior that are worth keeping and those that are merely decoration.\The rubber-band bounce is a great example. You cannot see where a list ends, so the bounce shows you. Bas Ording, the Apple designer who created the effect in 2005, built it for exactly that purpose. The snap-back tells you that you have hit the end of the list and that the app has not frozen. A text label could tell you the same thing, but the bounce tells you instantly, and you understand it without reading a word.\Inertial scrolling, which Ording built around the same time, is another example. It keeps a useful behavior from the physical world, where pushing something harder sends it farther. Flick the list harder, and it scrolls farther, so you control it the way you would a real object, without ever being taught how.\Google wrote it into a doctrine. Material Design arrived in 2014, one year after the “Great Flattening”, and its founding document is very precise about which parts of reality are worth keeping in the UI and UX. The core idea was to treat every surface on screen as a sheet of paper. But Google was careful about which properties of real paper to keep and which to drop. Digital paper can do things real paper cannot, so in Material, a sheet can split in two and merge back together, and a small button can grow into a full screen. \At the same time, two sheets can never occupy the same space, and one sheet can never pass through another. Matías Duarte, who led the work, said the digital material could "expand and reform intelligently" while still casting shadows like a real object. Nobody would ever call the material skeuomorphic, yet it was built almost entirely on behavior borrowed from the physical world.\Copying the physical world makes an interface easy to learn, but it can also limit what the product can do. One of the best examples of this is the iPhone keyboard. Were it to follow the actual rules of the physical world, you'd constantly press several of the tiny keys at once and type utter gibberish.\That is what happened with the first prototypes, and it risked derailing the whole iPhone project, so in late 2005, Apple stopped all other work on the phone and put every engineer on the keyboard.\The fix works by separating two things that in the physical world are one and the same. The first is the key you see: a small picture of a letter in a box. The second is the tap zone that actually registers as a press of that letter. On a real keyboard, there is no difference between them, because the key you see is the key you press. On screen, there can be a difference, so while the picture of a button stays exactly as it is, its tap zone can grow and shrink.\And that is exactly how the iPhone keyboard works. As you type, the software looks at the letters you've already entered and predicts which letter is likely to come next, then it widens the hidden tap zone for the likely letters and shrinks the ones it doesn't expect. Say you type "t" and then "h." The most likely next letter is "e," because "the" is the most common word in English, so the tap zone for "e" grows. If your thumb lands a bit to the right of the "e," in the gap toward "r," it still registers as "e," because the "e" zone has stretched out to meet your aim. The "e" you see on the keyboard has not moved at all. \This happens on every keystroke, and it is why you can type quickly on a small screen and still get mostly the right letters. A real key cannot do any of this. It is the same size and in the same place every time you press it, and you cannot make the "e" bigger just because "e" is probably coming next. Apple kept the familiar look of a physical keyboard and threw out all the physical rules behind it, because keeping them would have made typing worse.\The danger of borrowing too much from the physical world into the UI is that the same thing that makes an interface intuitive and familiar is also what preserves the status quo. Anything genuinely better than the existing paradigm will, by definition, be unfamiliar at first contact. A borrowed visual metaphor might help you understand the present, but it might also limit what the future is allowed to become.