Design Principles - Kim Fletcher`s Professional Portfolio

Design Principles By: Kimberly Fletcher

Four Design Principles Proximity

Contrast

References Repetition Alignment

Contrast

Contrast adds visual interest to your document through: color, images, fonts, and size. This picture represents contrast through the use of color. Showing one white cat and one black cat on a black background.

Other examples of contrast:

Ex. 1

Ex. 2

Back to Main Menu

Ex. 3

Repetition

Repetition acts as a visual key that ties a piece together through the use of a repeated aspect in the document. This picture represents repetition through the use of repeating heart shaped cookies throughout the page.

Other examples of repetition:

Ex. 1

Ex. 2

Back to Main Menu

Ex. 3

Alignment

Alignment is the principle of lining every item on a page with another item on the page. This principle creates cohesion. This picture represents alignment because each person is sitting right in front of the other.

Other examples of alignment:

Ex. 1

Ex. 2

Back to Main Menu

Ex. 3

Proximity

Proximity is about placing related items physically together. The amount of separation tells the reader how the material is related. This picture represents proximity by having the name of the company grouped together and the logo grouped together but above the name. Other examples of proximity:

Ex. 1

Ex. 2

Back to Main Menu

Ex. 3

Contrast

This is a good example of contrast, because it is drawing your attention to the the black figure in front of the colored lines. The colored lines also add visual interest because of the intensity of the colors. Back to Contrast Menu

Contrast

This is a good example of contrast, because it is drawing your attention to the the light in the sky. At first look, you do not even notice the small figures in the water. I noticed the small figures after I took my eyes away from the light. Back to Contrast Menu

Contrast

This is a good example of contrast, because the black background is drawing your attention to the red. The second attention getter is the white. The black is the third color that you see.

Back to Contrast Menu

Repetition

This is a good example of repetition, because the straws are repeated and the same colors are repeated. Back to Repetition Menu

Repetition

This is a good example of repetition, because the lines and faces are repeating across the page. Back to Repetition Menu

Repetition

This is a good example of repetition, because several items are being repeated. The dog, color, and contrast are all being repeated. Also, the outline of the dog’s features are being repeated. Back to Repetition Menu

Alignment

This is a good example of alignment, because you have one person in the center and everyone else is to the right and left of the center. The center is the first point that most people align information around. Back to Alignment Menu

Alignment

This is a good example of alignment, because you have an item in center alignment and other items around it. By focusing on the center, you can see a cohesive unit. Back to Alignment Menu

Alignment

This is a good example of alignment, because the sun is at the center and the planets orbit around the center. Also, based upon their orbit, the planets visually look lined up. Again, this center alignment shows the universe as a cohesive unit. Back to Alignment Menu

Proximity

This is a good example of proximity, because it not only gives the definition but it shows the meaning. The words are grouped together according to how they relate to each other.

Back to Proximity Menu

Proximity

This is a good example of proximity, because items that relate to each other are close together. For example, the names are centered and kept together just like the when is grouped together and the where is grouped together. Back to Proximity Menu

Proximity

This is a good example of proximity, because the important information like the name of the company is grouped together and services offered are grouped together. Back to Proximity Menu

References http://us.123rf.com/400wm/400/400/maxkabakov/maxkabakov1206/maxkabakov120600130/13931432-security-concept-lock-on-digital-screen-contrast-3d-render.jpg http://www.gandex.ru/upl/oboi/u12952_9043_Creative_Wallpaper_Contrast_017140_.jpg http://blog.nyicd.com/storage/repetition%20cookies.png?__SQUARESPACE_CACHEVERSION=1317310608402 http://chiropractor-ranchocucamonga.com/wp-content/uploads/2013/04/MP900411715.jpg http://nashworld.edublogs.org/files/2009/05/comparecontrast.jpg http://shazimalik.files.wordpress.com/2012/04/high_contrast_beach_by_joefuss134.jpg http://farm7.staticflickr.com/6131/5956757772_efd3e93b6b_z.jpg http://2.bp.blogspot.com/-AxGoqf_BJ34/Ta2CkgLfGvI/AAAAAAAAAns/whtv0rPGpco/s1600/repetition2.jpg http://keystone54.com/blog/wp-content/uploads/2012/06/Warhol-Bridget2.jpg http://www.maastary.com/Portals/14679/images/Sales%20and%20Marketing%20Alignment-resized-600.jpg http://images2.wikia.nocookie.net/__cb20090330065435/wowwiki/images/2/2d/Band_of_Alignment.jpg http://www.2012prophecyends.com/wp-content/uploads/2011/08/planet-alignment-2012.jpg http://4.bp.blogspot.com/_c7JiLplPdUY/S74DEgzhpjI/AAAAAAAAAwo/M8AoHhQ4M0E/s1600/P3-4_Campi_POD_02_Proximity.jpg http://api.ning.com/files/yT4EhNKBkhm8Gq9c118QZagy1Sr2VG6pxSSiHM*gZlQHjhp6uhEgE*ewZ8slfnB9u5BlJ2*FNUD4pGjPtmKEXcFFXc5LYeMv/Invite1610.jpg http://www.smashingbuzz.com/wp-content/uploads/2011/04/Custom-Flyer-Design-for-SML-Studios.jpg

Back to Main