The interface of an interface
It has been said that a novel user interface idea is not a durable differentiator for a product. The cycle is like this. An idea is conceived and integrated into a product. It provides value to the users of the product, and, initially, brings market differentiation and success to the product. But then it’s copied into other products and the market differentiation is lost.
However, an innovation is not universally adaptable. For example, the New York Times could not integrate pull to refresh into the traditional layout of their front page.
Pull to refresh is a set of interlocking interfaces -
- A single column
- …on a touch screen
- …of pieces of content
- …with the same structure
- …arranged in chronological order
- …that can be scrolled vertically
The front page is extremely well suited to these sub-interfaces. Its interface can integrate with four of the six pull to refresh sub-interfaces - 2, 3, 4 and 6. But it’s not structured as a single column (1) and it’s not arranged in order of newness (5). These mismatches are enough to make it difficult to integrate pull to refresh.
But not impossible. Thinking of the traditional New York Times front page as a single interface isn’t quite right. Just like pull to refresh, it’s really a set of interlocking interfaces -
- Pieces of content that are headlines and blurbs.
- Lists of pieces of content
- Images
- Navigation
The most important interface, the headline and blurb, is compatible with pull to refresh. Take a bunch of them, put them in scrollable column, and, boom, they’re ready to integrate with pull to refresh.
So an old interface can be reconfigured to integrate with a new interface. A few observations.
First, integrating interfaces can be more or less harmonious.
In the case of pull to refresh and the New York Times front page, the integration was reasonably harmonious. A grid-like front page became a list. The pull-to-refresh spinner lives at the top. The fact that the list of content items that gets refreshed is separated from the spinner by the unrelated masthead, date and ticker only brings a small amount of discordance.
The integration of disappearing photos into Instagram was less harmonious. Stories live in a separate part of the product to the old posts interface and bring a new set of interface conventions for interacting with them. The differences between the post interface and stories interface were so great that they had to be made separate.
Second, in integrating a new interface, some of the advantages of the old interface are lost. The grid-like front page of the New York Times made important things prominent whilst still showing less important things. The pull-to-refresh version is able to show one most important thing. But the hierarchy of importance has been lost.
Third, in integrating a new interface, some of the advantages of the new interface are also lost. In the pull-to-refresh version of the New York Times, unless the newest piece of content is also the new top headline, the newest content is hidden below the top headline.
Fourth, every product is trapped in the past. Each part of a product’s interface was designed for the world of that moment. But the world changes. So the product is designed for a world that, to some extent, no longer exists. The product can be changed to meet the conditions of the new world, but this is a painful process.
Further, it’s even difficult to stay up to date by copying innovations. Those innovations are adapted for conditions that the product is not adapted for. Pull to refresh is adapted to a world of large volumes of regularly updated content. That’s not the world of the New York Times.
So, seeing an interface as a set of sub-interfaces, each of which needs to integrate with other interfaces, has helped me understand why it’s not easy to successfully copy a UI innovation. And why products get stuck in the world in which they were born.
Subscribe to my newsletter to hear about my latest work