movement

M OV E M E N T

THE PRINCIPLES OF DESIGN

LESSON OVERVIEW

• In this lesson, you will:• Explore the principle of movement on a Web site.

GUIDING QUESTION

• How can you create the illusion of movement with text? • Answer this by creating a new thread in the discussion

forum; title it Movement

MOVEMENT

• Movement in a Web site can be created in two ways.• The first type of movement is the natural movement of

the eye as someone views the site.• The second type of movement is one that is purposely

created by the designer.

NATURAL EYE MOVEMENT

• When a Web site is viewed, there is a natural movement of the eye through the site.• This movement makes the shape of an F on the

page.• Starts at the top left of the page• Moves left to right• Returns to the left side of the page• Moves down the left side of the page• Moves left to right• Returns to the left side of the page• Moves down the left side of the page

NATURAL EYE MOVEMENT

• Use this link below to view the results of studies on eye movement on Internet pages.• This information points out the areas that a Web

designer should pay special attention to in a site as those areas will be the ones most often seen.• F-shaped pattern for reading content

DESIGNER CREATED MOVEMENT

• A Web designer can attempt to change the natural eye movement through the use of shapes.• By using shapes in a repetitive and progressively smaller

size, the viewer’s eye is drawn to another section of the site.

• The designer may also choose to use arrows or lines to create the same effect.

DESIGNER CREATED MOVEMENT

• Creates a hierarchy of information• A ranking of the importance of things

• Changes the natural eye movement to cause the viewer to take notice of other areas of the page. Viewer reactions:• This is important!• Check it out!

LESSON REVIEW

• You should be able to:• Describe the principles of movement as it applies to Web

design.

ASSIGNMENT

• Use the Web site that you selected• Analyze it according to the principles of movement • Begin writing your justification