Gestalt theory and website design

by Amani Alanazi3139566

EDGE903 Spring09

Outline

1- Why use Gestalt for web design?

2- The Gestalt laws

3-Tips for effective web design for your course

4- References

- Gestalt theory is simply a scientific foundation describing how the mind organizes visual data. The stronger the clarity of form, the better the design.”

http://www.firstcoastcreative.net/index.php?p=18

- Gestalt is “not a combination of elements but something new in relation to these, which exists together in their combination, but it distinguishable from it” (Lyons, 2001)

1. Why use Gestalt for web design?

1-Why use Gestalt for web design?

- Usability: using white space to effectively distinguish between elements.

- Easily scanned designs.

- Accessibility: easier for those who are visually impaired to understand a page.

2. The Gestalt laws

• 2-1. Similarity• 2-2. Proximity• 2-3. simplicity• 2-4. Good continuation• 2-5. Closure

2-1. Similarity

Objects that are similar, with like components or attributes are more likely to be organised together (Schamber, 1986).

2-2. Proximity

The closer objects are to each other, the more likely they are to be perceived as a group

2-3. simplicity (Symmetry)

people will visualise according to the simplest way of grouping items – and the effort to simplify complex items is unconscious (Chang, 2002).

2-4. Good continuation

Objects will be grouped as a whole if they are co-linear, or follow a direction (Chang, 2002)

2-5. Closure

In perception there is the tendency to complete unfinished or partially obscured objects.

Similarity/Proximity

Proximity/SimilarityGood Continuation

An example of a website using Gestalt laws…

3-Tips for effective web design for your course

A- make it simple.

B- Maintain Webpage Design Consistency across the Website.

C- Avoid too many Flashy Graphics and Animations.

D- keep the background white

E- clear site structure

3.a- make it simple ( don’t crowd your website designs with unnecessary images)

3.b- Maintain Webpage Design Consistency across the Website

Ensure your WebPages are consistency, This will help with viewer comfort when browsing your website.  

3. c-Avoid too many Flashy Graphics and Animations

Too many flashy graphics and animations can distract the viewer from the content of your website

3.d- keep your website’s background white

( which make the text information on your website to stand

out and be readable)

3.e- make the site’s structure easy to follow

Remember to be your self

References

Chang, D., Dooley, L., & Tuovinen, J. E. (2002). Gestalt Theory in Visual Screen Design – A New Look at an Old Subject. Paper presented at 7th World Conference on Computers in Education, 29th July – 3rd August, Australian Computer Society, Copenhagen

Schamber, L. (1986, August). A Content-Driven Approach to Visual Literacy: Gestalt Rediscovered. Paper presented at 69th Annual Meeting of the Association for Education in Journalism and Mass Communications, Visual Communications Division, Norman, Oklahoma.

Lyons, A. (2001). Gestalt Approaches to the Virtual Gesantkunstwerk. Unpublished Paper. from http://www.tstex.com/gestalt.htm

http://www.netstarter.com.au/Content_Common/pg-web-site-design-tips-sydney.seo

http://shannonebarry.blogspot.com/2008/12/dare-to-be-yourself.html