Week 9 Page 8: Visual Unity/Gestalt

Why Is Unity Important and What is Gestalt Anyway?

unity/gestalt slide

 

Your site is done. You've diligently applied contrast, repetition, alignment and proximity to all the design elements. And you've planned and organized the material, given it a focal point, and added negative space and kept it simple. Now it's time to ask "Do the diverse elements in my design come together as a whole?"

Without unity/gestalt, a design is chaotic and distracting. A unified design synthesizes the elements into a cohesive whole. It looks and feels complete. That is what gestalt theory is... "The whole is more than the sum of its parts."

The designer's task is to create unity while avoiding monotony. You need to balance the use of contrast (used to create variety) with the use of repetition (used to create consistency and unity).

Repetition and Consistency are essential to achieving unity/gestalt.

How to Improve Your Design's Unity/Gestalt

If your design is not unified, don't put a border around it and call it a day. Boxes just add clutter! Instead look for where you might have been inconsistent. Unity rides on the coattails of consistency. Check your text formatting: subheads, body text, etc., should all be consistent. Check the spacing between elements - it should be the same between similar elements and varied elsewhere. Ask yourself if you can strengthen or add repetitive elements. Most importantly, don't panic, and don't give up! Just patiently examine the design. Often only small improvements are necessary to bring it all together. Then you can savor it!

Unity/Gestalt Examples

Let's look at two screen shots of web pages. How about a unified example first?!!

This site has good unity and gestalt as a result of its use of consistency and repetition. This doesn't mean to say that every element is monotonous... they have a visual relationship (color and style, for example) that creates connection and cohesiveness. Look at the graphics on this page... They are visually united by a common style and color. Some are actually linked by lines! While there is strong contrast in this design, the contrasting elements (large type, for example) are connected by color to the rest of the content. The final unity is achieved by placing the elements on a common, well-defined background shape. Here's a link to the actual site (see if the other site pages continue the same unity): http://www.pointlesscorp.com/ Links to an external site.
 (Note: this is an archived version)

good unity example

 

This lecture wouldn't be the same without an example of a site that lacks unity and gestalt. Take a look at this site and see if you can figure out why the different parts of the design have little or no visual connection. One problem is the lack of any consistent edge alignment which scatters the elements. Another is the lack of a background shape to contain the design (see example above!). The negative space just disappears off at the bottom so the design has no concrete area definition to hold the elements together. Unfortunately (or fortunately), this site has been taken down and hasn't been archived.

bad unity example 

 

And lastly...

Successful Unity/Gestalt or Not?!!

Look at the following sites and decide: Successful or Not Successful?

• Astrology Online (brace yourself!): Links to an external site.http://www.astrology-online.com/ Links to an external site.

• Poppies Flowers: http://poppiesflowers.com.au/ Links to an external site.

You can post your comments to our class Weekly Class Discussion, Discoveries and Questions Forum if you want to discuss these sites with other students.

 This ends the lecture on lines and shapes! Now go back to the Modules page and look at the Module 14 materials.