DDP: Lesson - Graphical Elements and Appropriate Use

A highly stylized triangle with the word design in the middleGraphical Elements and Appropriate Use

A familiar adage states that “beauty is in the eye of the beholder.” This means each of us has our opinions of what is beautiful or visually appealing. Sometimes we can see an advertisement, game platform, or webpage that we like or prefer over others. We may be able to identify what caught our attention or we may not be able to state why we prefer a particular video or website over the other.

Graphical Elements

When evaluating websites and other digital products for appropriate use there are specific graphical elements we should give our attention to. We will highlight five basic graphical elements:

  • Line: A shape that connects two or more points. A line adds emphasis, divides and organizes content, and guides the viewer's eyes.
  • Shape: Any 2-dimensional (2-D) area with a recognizable boundary (i.e. circles, squares, triangles, etc.). There are two distinct categories: geometric and organic. Shapes communicate ideas visually (i.e. street signs, symbols, etc.), organize and separate content, create simple illustrations, and add interest to one’s work.
  • Form: Any 3-D shape. Forms can be 3-dimensional (3-D) and exist in the real world or they can be implied using techniques like light, shadow, and perspective to create the illusion of depth. Makes realism possible in 2-D designs.
  • Texture: The physical quality of a surface. Textures can be 3-D, something that can be seen or touched, or implied. Adds depth and tactility to otherwise flat images. Objects can appear smooth, rough, hard, or soft. Makes great background images and adds interest to one’s work.
  • Balance: An equal distribution of visual weight - how much any one thing attracts the viewer’s eye. Balance is affected by many things such as color, size, number (of objects, for instance), and negative space (the area of the image without objects). Symmetrical designs are the same or similar on both sides of an axis. Asymmetrical designs are different, but the weight is still evenly distributed while drawing attention to the right things.

Video Lesson

In this lesson, we will explore each of these graphical elements and their undeniable importance when creating digital products, such as websites. Watch the following video to visualize each of these elements at work.

All GCFGlobal.org® content is available for free at edu.gcfglobal.org Links to an external site..

Practice Activity

[CC BY 4.0] UNLESS OTHERWISE NOTED | IMAGES: LICENSED AND USED ACCORDING TO TERMS OF SUBSCRIPTION