Elements and Principles of Design

The elements of art are important; we all know this.  But how, specifically, do these elements affect graphic design and especially web design?

SPACE

screen2bshot2b2011-04-302bat2b9-52-122bpm
link

Negative space is made use of here; it is not just a grey screen but a dark, filtered photograph.  The white contrasts against it and is easy to see.  The shapes are clean and sleek.

COLOR

palette_3-530x257
link
palette_25-530x275
link
palette_6-530x306
link

Each of these websites has a different color scheme based on the aesthetics and purpose of the site.  The first site and third site also show two different options for making a muted color scheme work; black and white with a very subtle pop of a neutralized gold versus quiet, moody grayish blues and purples.  The second site shows a good way to make a loud color like bright yellow work.

TEXTURE

textures01
link

The beauty of texture here is not just that the background is textured but that the icons are textured as well.  The black and white color scheme makes it contrast without being overly busy or distracting from the beauty of the textures.

FORM

3d-website-design-31
link
3d-website-design-10
link

One way of showing form in design is through the use of 3-dimensional objects like people in photographs.  Another way is to create 3D graphics of, say, chocolate that also function as buttons.

LINE

lawineagency
link

The lines in this design form a repeated motif that lead the eye throughout the piece.  There are thinner and thicker ones, some in lighter colors than others, and both diagonals and horizontal/vertical lines.

SHAPE

11-websites-with-extraordinary-geometry-elements
link

This “honeycomb” shape made up of hexagons has been a popular design trend for the last few years.  This design is sleek and makes use of icons, lines, and colors.

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s