Continuity
Eyes naturally follow smooth paths, aligned or flowing elements guide attention effortlessly
Visual Flow
Eyes naturally follow the smoothest path between elements, creating visual connection
Design for Scanning
Arrange content in predictable patterns (like F-shape or Z-shape layouts) for intuitive navigation
Line Completion
The mind connects elements that form continuous lines or curves
Directional Force
Elements aligned on a path appear related and sequential
Smooth Transitions
Gradual transitions between states or elements maintain context and flow
When to Use
- •
Guide users with arrows or directional cues
- •
Align text and buttons for visual flow
- •
Use natural reading patterns in layouts
- •
Design progress bars to show sequential steps
- •
Arrange forms logically to reduce cognitive load
When Not to Use
- •
When unrelated data or elements are presented
- •
If the flow conflicts with user expectations
- •
When the layout needs equal attention across items
- •
If continuity detracts from critical CTAs
Common Pitfalls
- •
Overusing paths that confuse the user
- •
Disrupting flow with misaligned elements
- •
Ignoring cultural reading directions
- •
Creating unnecessary complexity in flows
Become a better designer
Sign up for Links for Thinks — a weekly roundup of design resources sent straight to your inbox.
*VIDEO* Continuation: Gestalt Principle for User Interface Design
Nielson Norman Group / Megan Brown
*VIDEO* Continuation: Gestalt Principle for User Interface Design
Nielson Norman Group / Megan Brown
The Law of Continuity
Interaction Design Foundation
The Law of Continuity
Interaction Design Foundation
UX Psychology: Gestalt’s Law Of Continuity
tl;dv / Dani Jones
UX Psychology: Gestalt’s Law Of Continuity
tl;dv / Dani Jones