Graphic Design Basics in Motion/Web Design

Plot, Line, Plane:


Motion Design: http://www.eyeballnyc.com/ (under live action)

About half way through the clip point, line and plane (mostly line and plane) are used to create a moving plane in which the dancers move on. The lines and overall composition are what make the motion and transitions in the clip.

Web Design: http://yehrin.proteinos.com/typography/index.html

Although this is really on print, I liked it so much I posted it. The series of planes really sharpens the letters in a dynamic way. They also create a beautiful series of shapes the bring the eye right in to the main focus.


Rhythm, Balance:

Motion Design: http://www.imaginaryforces.com/featured/7/514

The rhythm in this clip follows a certain pace and is visually demonstrated through the movement of the Pepsi logo and the type. Each time the clip progresses of the letters, or logo, move there is a new balance for each shot.

Web Design: http://www.capacity.tv/

The little characters interacting with the word “Capacity” direct the viewer across the word in a very smooth “s-shape”.


Scale:

Motion Design http://www.capacity.tv/ (click the “Click here for rebrand montage”)

Throughout the clip, we see the characters close-up, far-away and them traveling in between which helps the motion progress from one character to another. If the character is going away from the viewer, then they become small to recede. The opposite occurs when the characters get close to pop out at the viewer, consuming the eye.

Web Design: http://www.abelic.net/

The large scaled background image of the sunken ship dominates the webpage compared to the small scaled navigation left of center.


Texture:

Motion Design: http://www.eyeballnyc.com/


The texture in this motion is very interesting because it communicates the carbon footprint idea and it interacts beautifully with the characters in the piece.

Web Design: http://www.melkadel.com/

This site was designed to look like a sketch pad and is successful in doing so through the use of texture representative of different kinds of paper.