1. Home
  2. Computing & Technology
  3. Web Design / HTML

Flow in Design - Layout and Artwork that Conveys Motion

By , About.com Guide

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.

Explore Web Design / HTML
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Web Design / HTML
  4. Web Design
  5. Principles of Web Design
  6. Design Flow - Composition Flow - Motion in Layout - Motion in Artwork>

©2009 About.com, a part of The New York Times Company.

All rights reserved.