Known Item
Published in

Known Item

Understanding Architectural Scale: Tabletops and landscapes

In my last article, I asked if you could remember where your grandparents kept their telephone. Our brains are usually very good at this kind of thing, so most of us can. Not all spatial memories are so easy, though. I also asked if you knew where your most recent copy of your resume is on your laptop. That’s much harder for most of us.

Even keeping to the physical world, changing the scale of your memory can make it much harder to remember. If you can remember where your grandparents kept their telephone, can you remember what else was on the table? How about everything on your bedside table right now? As the scale gets smaller, it gets harder to remember. That shift is your brain shifting which kind of memory and reasoning it uses.

It’s important to understand these two different kinds of memory, because handling them correctly can make novel experiences feel natural. In general, digital experiences don’t have to be familiar in order to feel natural. They do, however, have to follow deep rules about human behavior and ability.

Two reference systems

Your brain has two different systems to make sense of space. One system tracks objects relative to your own body in space. The other tracks objects relative to other objects in space. Neuroscience calls these egocentric and allocentric spatial reference systems. For information architecture, these correspond to two different scales of experience. Experiences where we’re tracking objects relative to ourselves are tabletops. Experiences where we’re tracking objects relative to other objects are landscapes.

A screenshot of Personal Capital, a money management web app is shown on the left, labeled “Tabletops.” A screenshot of BBC news, a content-based website is shown on the right, labeled “Landscapes.”

In the digital world, most software and apps function like tabletops. Examples include:

  • Trello
  • Gmail
  • Sketch
  • Mint
  • Bank portals

Tabletops tend to consist of small, controllable objects in your immediate vicinity. They rely on continuous sensory input, because you can see most of the experience at once. They also reward poking around to see what buttons do and are personal to you.

In the physical world, anything larger than a person verges on landscape territory. This includes rooms, houses, theme parks, neighborhoods, and cities. In the digital world, large content-based websites are landscapes. Examples include:

  • BBC News
  • Gov.co.uk
  • Harvard Business School
  • AllRecipes
  • Microsoft Docs

Landscapes tend to consist of large, impassive objects that are far away from you. They need more working spatial memory, because you have to reason about the locations of things you can’t see at the moment. They also tend to reward moving from place to place as a method of exploration and feel “public.”

A hand-drawn table detailing the ways in which Tabletops and Landscapes differ. Tabletops are small, controllable, close, rely on sensory input, reward interaction, and personal. Landscapes are large, impassive, distant, rely on spatial memory, reward navigation, and are public.

Evaluating an experience

The first time you encounter an experience, your brain decides whether it is a tabletop or a landscape. To do that, it evaluates three aspects of the objects in that experience: Their size, how operable they seem, and how far away they are from you.

Size

A screenshot of Keynote showing the many small elements of the interface. A screenshot of Serious Eats contrasting its fewer, larger elements.

The objects in a tabletop tend to have small referents in physical space, and they have small representations on a screen. In a complex application like Keynote, there are many objects on the screen, like slides, buttons, and rulers, that keep many tools at hand in a small space.

The objects in a landscape tend to have larger or more nebulous referents, and they have less dense representations on a screen. On a large site like Serious Eats, a small number of objects take up screen space, encouraging you to look around on other pages for specifics.

Interaction

A screenshot of Trello, showing how every element of the interface affords an interaction, like creating a card or a list. A screenshot of The Wall Street Journal showing how it affords movement, rather than interaction.

The objects in a tabletop tend to be interactive and encourage you to do things to them. In a web app like Trello, nearly everything you do will be a verb acted on one of these objects: Add a card, edit a description, create a list, delete a board.

The objects in a landscape tend to be impassive and allow very little interaction. On a website like The Wall Street Journal, you will move between pieces of content and the content itself will remain the same. While you might also read an article or share a link, these verbs are not features of the site and don’t change the objects. Landscapes are mostly for consumption, and tabletops are mostly for interaction or creation.

Distance

A screenshot of Twitter showing how all the elements are accessible from the main screen. A screenshot of the Adobe Help and Support site, showing how content disappears into the distance.

The objects in a tabletop tend to be in your immediate vicinity and are accessible without changing position. In a web app like Twitter, you can access everything the app can do from a main home screen without changing contexts.

The objects in a landscape tend to extend into distance and over the horizon, requiring locomotion to interact with them. On a site like Adobe.com, layers of navigation show what’s in each direction without showing you all the options. It’s clear that the site may have many kinds of content and functionality that are not visible from this vantage point.

In the real world, differences in physical scale are very obvious. Objects around you are either bigger than you, or they are not. (Amusingly, the sizes of things relative to your own body seems to be the cue for your brain to move away from tabletop-scale toward landscape-scale. I haven’t seen any research on whether this holds for very small children.) Because so many digital experiences take place in a single glass rectangle, you usually have to construct your understanding of scale in a digital space from these cues we have discussed above: Size, interaction, and distance. If these cues conflict, your brain has a very difficult time figuring out how to process this space, and it makes the experience much harder to use.

There is a demonstrable neurological component to this understanding of scale. Many animals, including humans, have “place cells” in their brains. These cells fire when you understand your location as a place and when you find yourself in a new place. They don’t fire when small objects in your environment move. They do fire when you move through a house (or more realistically, a maze, because most of these studies are on rats).

A diagram of a rat in a maze, with different colored dots showing when place cells in the rat’s brain signify a space as a new place. Each section of the maze has a different color of dots, signifying eight different defined places through the maze.
Each color of dots shows the rat’s understanding of a new place. Place cell — Wikipedia

Expectations

The difference between tabletops and landscapes matters because our expectations differ. You are likely to expect differences in the ways in which you know things, what you can do to learn more, and how intimate the experience will be depending on whether it’s a tabletop or a landscape.

Ways of knowing

A screenshot of Personal Capital, indicating the colored graphs and simple indicators visible in your peripheral vision as you use it. A screenshot of Serious Eats, showing how you have to read the navigation and form a plan to find a specific recipe.

Your experience of a tabletop relies on continuous perceptual input. As you use a tabletop, the experience stays constant in your peripheral vision, and very little of it is likely to require in-depth reading. It is easy, low-viscosity information that allows you to act via reflex, rather than deliberate thought. Tabletops rarely require you to reason about parts of the experience you can’t see. In an app like Personal Capital, the main dashboard has small versions of all the sub-dashboards. You don’t need to determine a structure to find things.

Your experience of a landscape, by contrast, relies on much more logic and guessing. Your brain takes in information about landmarks and boundaries in space as you move. It aggregates that information, allowing you to make judgments about things you cannot currently see. On a site like Serious Eats, if you want a recipe for Black Cod with Miso, you have to decide where it will be. There is no direct cue to that particular recipe.

Ways of learning

A screenshot of Gmail, showing how you need to click on things to see what they do. A screenshot of BBC news, showing the “map” the navigation affords you, so you can learn how it works.

To learn how a tabletop works, you expect to interact with it. You need to hover over icons, open drawers, and perform test actions. In an app like Gmail, the best way to figure out how it works is to try the actions it seems to afford. Most of us have clicked away from an overlay explaining new features so that we can try it out ourselves. In a tabletop, experience is more helpful than representations of the space.

To learn how a landscape works, you need to find some kind of representation of the space. You can learn a small landscape by navigating through it. Once it gets larger than a few pages, you need a map showing you what’s there and how those things relate to each other. Websites like BBC News use firm patterns for global navigation to show that “map.” A hierarchy across the top of each page teaches you what’s there and what you can do.

Intimacy

A screenshot of a video reporting on Twitter’s new design that added a blue line connecting replies to the original tweet.

Tabletops are likely to use personalized content or contain intimate information about you. You may be able to customize the information or its display. You’re also more likely to get annoyed at changes that happen without your permission. Twitter users have famously strong reactions to small interface changes, like the addition of a blue line to connect replies. Those kinds of reactions are stronger in experiences you can think of as yours.

Landscapes, by contrast, tend to belong to the commons. You’re less likely to be able to customize a landscape, and even if the capability is there, few people will use it. You’re unlikely to expect landscape experiences to personalize content, even if they do. Landscapes like WebMD deal with intimate subjects but feel as impersonal as an encyclopedia.

Tablescapes and Landtops

This may seem like a very long way of saying that apps and websites are different. Even most of the experiences I have cited, though, are not only one or the other. Most experiences need to juxtapose both scales in the user journey. A complex application like Adobe Lightroom is several tabletops strung together.

A screenshot of Adobe Lightroom, with arrows pointing to the navigation, which affords movement across the landscape, and the section of the app that’s a complex tabletop to work in.

E-commerce sites like Etsy or ASOS are large landscapes of products with a simple tabletop check out. Different expectations at different scales in the same experience make it harder to design well.

Two screenshots of Etsy. On the left, the navigation-based landscape experience where you find products. On the right, the interactive tabletop where you check out.

This matters because our brains aren’t ambivalent about whether something is a tabletop or a landscape. There are no tablescapes in the hippocampus. Uncertainty about what kind of experience we’re designing can cause us to make disastrous compromises, focus on the wrong part of the design process, and use incorrect patterns.

Many difficult digital experiences are difficult because they haven’t decided whether they are tabletops or landscapes. Unfortunately, your brain still has to choose. When a reference system seems to be failing, your brain will switch to its other option. It can switch, but it cannot blend the two together. This switch comes with a cognitive cost, and study participants asked to do it think more slowly than those allowed to use one reference system. You can feel this difficulty whenever you use Microsoft Teams, a tabletop that can’t quite stop acting like a landscape (or possibly the reverse, nobody quite knows).

A screenshot of Twitter, where information architects discuss how broken Microsoft Teams’ IA is. Full thread: https://twitter.com/movito/status/1366871431519346689?s=20
Nobody understands how Microsoft Teams works, no matter how many IA experts you get in a thread.

Tabletops and landscapes also need more attention at different stages of the design process. In a tabletop, you need to spend your time designing a rock-solid object model with clear interaction design. It’s nice to have good wayfinding cues, but suboptimal landmarks are not going to sink your experience. In contrast, landscapes need to be navigable above all else. Landscapes still need a content/object model, but a few idiosyncrasies will not render them unusable like a lack of landmarks will.

Both of these scales are older than the internet and a lot of this is intuitive. Because of that, there is a robust tradition of patterns appropriate to either tabletops or landscapes. While some are shared, using most tabletop (app) patterns for a landscape (website) will not work, and vice versa. Product designers tend to know this intuitively, but articulating why you can’t use that part of your design system in this part of your experience is easier with neuroscience on your side.

Hybrid experiences also make it complicated for even experienced product designers to determine exactly when one set of patterns needs to give way to another. Assessing the experience you’re designing by looking at its objects, just like your brain would, can bring sudden clarity.

In the previous article in this series, I argued that we have to do four things to make our experiences mappable. In this article, we’ve covered understanding your scale, to deliberately build tabletops and landscapes.

In the next three articles, we’ll focus on making landscapes mappable. To do that, you need to:

  • Leverage the principles of naïve geography. A person doesn’t have to have taken a physics class to instantly calculate where a thrown ball will go, based on force and angle. Similarly, people don’t have to be geographers to make complex and accurate assumptions about space. If your experience is a landscape, you can assume your users will make sense of space using a few principles.
  • Check your wayfinding. Not all real-world experiences are easily mappable, as anyone who has gotten lost in an office building can attest. Once you understand your scale and the mapping skills your users are using, you can make sure it’s intelligible by assessing your wayfinding in the same way people who design supermarkets and museum exhibits do.
  • Use standard elements intentionally. None of this is a call to overhaul your design systems! As we go through this process, you should be recognizing lots of roles that standard elements like persistent navigation or breadcrumbs can play. We’ll finish with a method to check your experiences to make sure those elements are covering everything they need to without redundancy.

Many thanks to Rachel Price, for co-developing the workshop that these articles are based on.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store