Watch
Figure-ground 0:38
A 38-second explainer of Figure-ground, narrated over the same demo you can try yourself.
Try the interactive Figure-ground demo
What this video covers
Figure-ground is how our eyes distinguish what’s in front (the figure) from what’s behind (the ground). Interfaces rely on it - a dialog must stand out, not fade into the page.
With weak separation the panel dissolved into the page and you couldn't tell what was on top of what; add a dimmed backdrop and a lift and it snapped forward as a clear figure. Same panel, same words - the difference is purely whether your eye can tell foreground from background.
