Elements and Principles of Design

The elements and principles of design will be central to every assignment in this course. These elements and
principles are the tools an artist uses to communicate feelings and ideas visually. They are applicable to all of
the visual arts - whether you are a painter, sculptor, architect, choreographer ...or using a computer.

Elements

The elements of design, are the building blocks used by the designers to create the designs. They are the
parts, the components that can be isolated and defined in any visual design, they are the structure of the
work, the objects to be arranged and used as part of any composition. Although without referring to a specific
design (editorial, web, etc.) we can say that the general Design Elements are composed by:

Point
A point is the smallest and most basic element of design and it can be used alone or as a unit in a group
(forming a line or a shape). It has position, but no extension, it is a single mark in a space with a precise and
limited location and it provides a powerful relation between positive and negative space.

Line
If we place many points one next to the other we obtain a line, which can have length and direction, but no
depth. Lines, besides to be used to create a shape, can be used to create perspective and dominant
directional lines (which create a sense of continuance in a composition). Also, they can be grouped to create
a sense of value, density or texture.

Shape
Shape is an element defined by its perimeter, a closed contour. It is the area that is contained within implied
line and it has have two dimensions: height and width. A shape can be geometric (triangle, square, circle,
etc.), realistic (animal, human, etc.) or abstract (icons, stylizations, etc.).
Form
The Form is derived from the combination of point, line and shape. A form describe volume, the 3D aspect of
an object that take up space and it can be viewed from any angle (a cube, a sphere, etc.), it has width, height
and depth.

Color
The color is the response of the eye to differing wavelengths of radiation within the visible spectrum. Colors
are used to generate emotions, define hierarchy, create interest, etc. There are many different kinds of color
systems and theories but we will focus on the 3 properties: Hue, Value and Saturation.

Hue: is the color name.

Value: it refers to the lightness or darkness, to how close to black or white the Hue is.

Saturation: It refers to the intensity of a hue, the less gray a color has in it, the more Chroma it has.

Value
Is defined as the relative lightness or darkness, which suggests the depth or volume of a particular object or
area, it is the degree of light and dark in a design, the contrast between black and white and all the tones in
between.

Texture
Texture is the surface quality (simulated and/or actual) that can be seen and felt, can be rough or smooth,
soft or hard, etc. It exists as a surface we can feel, but also as a surface we can see and imagine the
sensation we might have if we touch it, is both a tactile and a visual phenomenon.
Space
Is the area between and around objects (negative space) but it also refers to variations in the perspective
and proportions of objects, lines or shapes and it is used for the comparative relation between different
objects or areas. The real space is three dimensional, but in Design when we create the feeling of depth we
call it space.

Balance
Balance means a good distribution of elements, whether it is color, texture or shapes to create a sense of
equalization. It comes in 2 forms: Symmetrical (when the weight of a composition is evenly distributed around
a central vertical or horizontal axis) and Asymmetrical (when the weight of a composition is not evenly
distributed around a central axis). One way to achieve balance in an asymmetrical design is to offset a
dominant element with a group of smaller elements. There is also the radial balance which can be
symmetrical or asymmetric, in radial balance, elements radiate out (in a circular shape) from one main center
point.

Symmetrical balance Asymmetrical balance

 Radial symmetrical balance Radial asymmetrical balance

Polyhedra, three-dimensional objects, Flowing Balance, stainless steel

Emphasis
It marks the location in a composition which most strongly draw the viewer attention, it is also referred as the
focal point. It is the most important area or object when compared to the other objects or areas in a
composition. There are three stages of emphasis, related to the weight of a particular object within a
composition: Dominant (the object with the most visual weight), Sub-dominant (the object or element of
secondary emphasis) and Subordinate (the object with the least visual weight, which is usually the
background).

Movement
Is the visual flow through the composition, where (depending on the elements placement) the designer can
direct the viewer´s eye over the surface of the design. The movement can be directed along edges, shapes,
lines, color, etc and the purpose of movement is to create unity with eye travel. By arranging the composition
elements in a certain way, a designer can control and force the movement of the viewer's eyes in and around
the composition.
Pattern
An object or symbol that repeats in the design is a pattern. It can be a pattern with a precise and regular
repetition or an alternate pattern, which uses more than a single object or form of repetition. We can say that
is simply keeping your design in a certain format. Classes of pattern include mosaics, lattices, spirals,
meanders, waves.

Mosaics create patterns from tesserae, small pebbles or cut pieces of stone or glass (traditionally) in
different colors. The lines between tesserae, and small areas of a composition, may form random patterns,
but viewed from a distance, their arrangement unites to form an image.

Basilica San Vitale, Ravenna – Italy; Empress Theodora, 547 A. D.

Lattices are used in art and design, lattices are (or resemble) screens of thin woven carved materials that
usually display a regular structure.

Jali, Humayuns’Tomb, Delhi – India (c. 1570)

Spirals
Volutes are a fancy name for flat spirals.

Entrance Stone, Newgrange, County Meath, Ireland Terracotta jar with three handles - Minoan, 1600-1500 B.C.

Gustav Klimt - The Tree Of Life, 1909, mural

Meanders
Meanders are the sinuous bends that streams and rivers sometimes make, which lend the name to anything
with a snaking, winding, convoluted path. Meanders can be thought of as irregular waveforms, as opposed to
regular sine waves.

Repetition
Repetition creates unity and consistency in the composition; it is the reuse of the same, similar or different
objects throughout the design. Repeated use of a shape, color, or other art element or design in a work can
help unify different parts into a whole. The repetition can be irregular, regular, uneven or even and can be in
the form of Radiation (where the repeated elements spread out from a central point) or Gradation (where the
repeated elements become smaller or larger). It often works with a pattern to make it seem active and along
with the Rhythm helps to create different types of it.

Proportion
Proportion is the comparative relationship in between two or more elements in a composition with respect to
size, color, quantity, degree, etc, or between a whole object and one of its parts. The purpose of the
proportion principle is to create a sense that has order between the elements used and to have a visual
construction; and it can occur in two ways: Harmonious (when the elements are in proportion) or Unbalanced
(when the disproportion is forced).
Rhythm
Rhythm is the alternation or repetition of elements with defined intervals between them, it creates a sense of
movement and it is used to establish a pattern and/or a texture. Rhythm is described as a beat, tempo,
pattern, time, recurrent, pulse. In visual rhythm, design motifs become the beats. Rhythms can be broadly
categorized as Random, Regular, Alternating, Flowing or Progressive.

Random Rhythm - Groupings of similar motifs or elements that repeat with no regularity create a random
rhythm. Pebble beaches, the fall of snow, fields of clover, herds of cattle, and traffic jams all demonstrate
random rhythms. What may seem random at one scale, however, may exhibit purpose and order at another
scale.

René Magritte - Golconde, 1953, oil on canvas.

Regular Rhythm - Like a heart or song with a steady beat, regular rhythm is created by a series of elements,
often identical or similar, that are placed at regular or similar intervals, such as in grids. Simple regular
rhythms, if overused, can be monotonous.

Alternating Rhythm - Two or more different motifs may be alternated, such as the black and red squares in
a checkerboard; a single motif might be flipped, mirrored or rotated every so many iterations; or the
placement or spacing between motifs can be alternated. This is essentially a regular rhythm that has more
complex motifs, or meta-motifs. The added variety can help lessen the monotony of a regular rhythm.

M.C. Escher – fish and birds M.C. Escher - Lizard, 1942

Flowing Rhythm - Flowing rhythm is created by undulating elements and intervals, bending and curving motifs and
spaces. Natural flowing rhythm can be seen in streams and waterways, beaches and waves, sand dunes and glaciers,
rolling hills and wind-blown grasses.

Gloria Petyarre - Bush Medicine Dreaming, 2008, acrylic on canvas.

ART+COM - kinetic sculpture

Progressive - In progressive rhythm, each time a motif repeats it changes a little, transforming and
translating in a steady sequence - the motif progresses from one thing to another showing a successive
change in size, placement, and form.
Variety
Variety is the principle that refers to the combination of elements in an intricate and complex relationship
using different values, lines, textures, shapes, hues, etc. It is complementary to unity and often needed to
create visual interest or to call the attention to a specific area in the composition.

Unity
Unity it is used to describe the relationship between the individual elements and the whole of a composition
(which creates a sense of completeness, that all of the parts belong together) and it is a concept that comes
from the Gestalt theory of visual perception and psychology. Three of the most well-known concepts of this
theory are the Closure (is the idea that the brain tends to fill in missing information when it perceives an
object is missing some of its pieces), Continuance (is the idea that once you begin looking in one direction,
you will continue to do so until something more significant catches your attention) and Similarity, Proximity
and Alignment (is the idea that elements of similar size, shape and color tend to be grouped together by the
brain).

Components of an art work

Subject the depicted object(s)

Form visual organization

Content impact or meaning

Works of art have subject, form and content. We often identify a work by its subject: a landscape painting, a
sculpture of a young woman, a lithograph of a cat. Form (or design), is the visual organization of the art work
-how the artist has used line, shape, value, color, etc. Content is the impact or meaning of this work. A
horse's head is the subject of both works (below). However, the artists have used form very differently.
Picasso's painting (left) has gestural lines, high value contrast, and exaggerated proportions to create a
highly emotional content. Conversely, the harmonious rhythms and more naturalistic proportions in the
ancient Greek sculpture create a very different feeling. The differences in content were created by the
differences in form, not the subject matter. The decisions you make regarding form (type of line and shape;
selection of value and color; size of the work; type of balance, etc.) shape the work's impact and meaning.
Elements of Design

Line path of a point

Shape perceivable area

Value relative light and darkness

Color color theory basics

Space (2D) height, width and the illusion of depth

Texture actual or simulated tactile quality

The Elements of Design are the language of the visual arts. This introduction focuses on the elements that
are most relevant to two-dimensional (flat) art works. Other elements include point, motion and elements
related to three-dimensional art such as mass and volume.

Line - the path of a point. In the first image, Leonardo da Vinci used a soft, sensitive soft line to create a
graceful image. The center image has the same subject. However, the artist Willem DeKooning has created
a very different feeling by using a heavy, gestural line. The woman's face in the third image is created with a
mechanical line creating an emotionally-detached feeling. Although the subject matter is the same in all three
works, the differences in line quality have created works with very different impact. How you use line is one of
the most important decisions to be made in creating a work of art - this is true whether you are using a pencil
point or a cursor on a monitor.
Shape - perceivable area. Shapes can be created by line, or by color and value changes which define their
edges. As with line, the decisions you make concerning shape are important. The shapes in the image on the
left are clearly defined. By contrast, the ship's shape on the right is barely discernable. This difference in
clarity of shape is part of the meaning of these works - one conveys a sense of orderliness and confidence,
while the other communicates a sense of vulnerability and uncertainty. The shapes of the objects that you
create or place in your images are positive shapes. The spaces around these shapes are the negative
spaces. It is just as important to be attentive to the negative space as the positive shapes.

Value - relative light and darkness. The overall lightness and lack of contrast in the left image conveys a
sense of spirituality and harmony between the tree and the circular sky. The dramatic mood of the other work
by Gustave Dore is created, in large part, by the high contrast of light and dark.

Color - basic color theory. We response to color on many levels. Color can be used simply to describe an
object. It can also be used emotional (blue for sadness or spiritually, red for angry), symbolically (associated
with a flag's color, corporation logo or sports team) and psychologically. The painting by Phyllis Bramson
(left) has intense, complimentary colors that equate to strong conflicting emotions. The other work, by
Alphonse Mucha, uses subdued, analogous color to create a very different feeling.

Introduction to Color

Colors displayed on a computer monitor are called additive colors. They are created differently than printed
or pigment colors. A color management system attempts to minimize this difference.
Additive Color - (computer monitor, television, theater lighting) direct light. A computer monitor uses three
phosphors that appear as red, green, and blue when activated. Other colors are made by combining different
intensities of these three colors.

Primary additive colors - red green and blue (RGB) are the primary colors. They can not be created by any
combination of other colors.

Secondary additive colors - The secondary colors are cyan, magenta and yellow.

Printing is based on CMYK color - the secondary colors of cyan, magenta, yellow and black (K)

Pigment Color - (paint) reflected light. Pigment color is created when a pigment absorb certain light
wavelengths and reflects others. For example, a blue shirt absorbs all wavelengths except blue, which is
reflected. The color wheel based on the three primary colors: red, yellow and blue, was developed in 1666 by
Sir Isaac Newton.

Primary pigment colors - red, yellow and blue are the primary colors. All other colors are derived from these
three hues.

Secondary pigment colors - green, orange and purple are created by mixing the primary colors.
Tertiary colors - yellow-orange, red-orange, red-purple, blue-purple, blue-green and yellow-green are the
colors created by mixing the secondary colors.
Complementary colors - opposite colors on the color wheel (pigment color example: red-green) create a
sense of excitement or disharmony.

Analogous colors - 'neighboring' colors on the color wheel (pigment color example: red-orange) create a
sense of harmony.
Space - height and width. A monitor display has two actual dimensions -height and width. In addition, an
artist can create an illusion of depth, using overlapping, diminishing scale, atmospheric perspective, vertical
placement, warm and cool colors, diagonals and linear perspective.

Space: Indicators of depth on a flat surface

Overlapping

Diminishing scale

Atmospheric perspective

Vertical placement

Color (warm/cool, intensity)

Diagonals

Linear perspective

We can create a convincing illusion of a three-dimensional space on a flat surface, if we establish our
vantage point and are consistent in our use of the indicators of depth:

Overlapping - when objects partially overlap other objects, we perceive them as closer than the covered
objects. Overlapping "overrules" the other indicators of depth - we know that the smaller pyramids are
closer because they overlap the larger pyramids. Overlapping most clearly establishes proximity.

Diminishing scale - the largest statue appears closest and the smallest appears further away.
Atmospheric perspective - close objects have greater intensity of color, detail and value contrast. The
rider and horse in this painting by Frederick Remmington have a higher color intensity, attention to details
and value contrast than the background cattle.

Vertical placement - we perceive objects that are placed lower in the image as closer to us, and objects
that are placed higher as being further away. The boat placed lowest in this work by Japanese artist,
Hokusai, is perceived as closest to us. As we move up vertically in the image, the boats seem further and
further away.

Color - we perceive warm colors (red, orange and yellow) as closer than cool colors (green, blue, violet).
Psychologically, the red and yellow objects in both works appear to be in the foreground, while the cool-
colored backgrounds recede.
Diagonals and Linear perspective - we perceive diagonal lines as receding into the distance. The diagonal
lines in this painting of a bridge create a extraordinary sense of depth. This painting is also an example of
linear perspective. As an example of one-point perspective (there is also two- and three-point perspective),
the diagonal lines converge on a single point on the horizon called the vanishing point. In one-point
perspective, the horizontal and vertical lines are parallel with the sides of the image.

Texture - surface quality. We experience actual texture when we touch objects and feel their roughness,
smoothness or patterns, which we can simulate or imply in digital imagery. Texture refers to the surface
quality in a work of art. We associate textures with the way that things look or feel. Everything has some type
of texture. We describe things as being rough, smooth, silky, shiny, fuzzy and so on. Some things feel just as
they appear; this is called real or actual texture. Some things look like they are rough but are actually smooth.
Texture that is created to look like something it is not, is called visual or implied texture.

Texture may be used in a work of art to:

create visual interest or a focal point in a composition
to create contrast within a design composition
to help visually balance a design composition

Real Texture

Visual or Implied Texture

Visual or implied texture can be simulated or invented.
Texture Balance
The feel, appearance, or consistency of a surface or a substance equal on both sides of a design.

Texture Contrast
The feel, appearance, or consistency of a surface that stands out against the background.

Texture Emphasis
The feel, appearance, or consistency of a surface that is the focal point of a design.

Texture Movement
The feel, appearance, or consistency of a surface that seems to be moving across the page.
Texture Rhythm
The feel, appearance, or consistency of a surface in a repeated pattern.

Car paint textures

Matte texture paint

Matte pattern paint

Me

Metallic paint

Effect chromed mirror Silver chrome plated paint

Chromed matt metalized

Diamond effect paint Shiny paint with small brilliant pieces

 Kolam design technique

Kolam designs are usually created by joining dots. With the help of dots, you can draw intricate designs and
patterns. Kolam is an ancient technique to create drawings, typical of southern India, State of Tamil Nadu,
Kerala, Goa. A kolam is a geometrical line drawing composed of curved loop, draw around a grid pattern of
dots. First you have to realize the grid made with points, the shapes of the grid can be varied, after that you
can start to realize the real drawing, combining the points between them. In india the realization of these
drawings is made with rice flour.

Example of grid pattern

Examples of Kolam technique drawings