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 use it constantly - a dialog must appear on top of the page, not blend into it.
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.
