1. Technology

Flow in Design - Layout and Artwork that Conveys Motion


1 of 7

What is Visual Flow?

Visual flow carries the viewer's eye through the document in a way that all the important elements receive prominence, and nothing snags the vision or causes the viewer to lose sense of the piece. Using obvious flow elements like arrows or numbers is the most common way Web designers use flow, but there are other types of elements that can be used and mis-used to direct your readers to move along a specific path. The steps in this tutorial will show you examples of good and bad flow and help you learn the vocabulary of visual flow in design.

Visual flow can be achieved in many ways:

  • Arrows
  • Sequential images or text elements
  • Perspective
  • Gradients
  • Size changes
  • Curves
  • Motion in images
  • Faces - especially the eyes

The following images will show you some common mistakes in flow on Web pages and how to correct them.

©2014 About.com. All rights reserved.