Inconsistent direction breaks the spatial model
Aliases: mixed directions · competing transition axes · broken spatial model
What it is
If some pages arrive from the right, some well up from the bottom, and some fade in place, people cannot rehearse where the next one will appear or where return will send them. What is inconsistent is not one ugly clip; the axis is swapped mid-path, so the spatial model never closes. Once it breaks, even a hierarchically correct direction on a single step will not transfer to the next.
Why it happens
A spatial model is an expectation compiled from repetition: this kind of jump takes this axis. One exception puts expectations in competition. On the next jump people prepare both right and bottom, so whichever side actually appears is wrong half the time. The wrong bet shows up as a brief loss on return, doubt about still being in the same product, and reluctance to use a back gesture.
Inconsistency often comes from components shipping their own defaults: a dialog that scales up from centre, a sheet that rises from below, a navigation controller that pushes from the right. Each story can be locally coherent; stacked in one task they become three geometries. People do not bring three body directions to one task.
This is not the same claim as “the spatial model must be unified across the product.” The break here is an axis change on a single task path. Even if the rest of the product is tidy, that path is enough to interrupt the model.
Where it stops holding
- Two genuinely different structures can use two axes if the structure is statically recognisable — stack on horizontal, system-level modal on vertical — and they are never mixed inside one gesture.
- On first entry there is no model yet to break; the cost of inconsistency is delayed until the second visit and after.
- A pure fade has no direction, so it does not invent a wrong axis, but it also cannot help build one. Dropping a fade into a product that already has an axis temporarily switches the grammar off.
Applying it
- Along one real task, list the incoming edge of every transition. A third edge means cut back to at most two structural axes.
- Default transitions from third-party components must be remapped onto the product’s existing axes; they cannot bring their own direction into the main flow.
- Check: ask people to predict where the next screen will come from and where return will go. Scattered predictions mean the axes are already competing on that path.