Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Gestalt theory and  website design by Amani Alanazi 3139566 EDGE903 Spring09
Outline  <ul><li>1-  Why use Gestalt for web design? </li></ul><ul><li>2- The Gestalt laws </li></ul><ul><li>3-Tips for ef...
<ul><li>-  Gestalt theory is simply a scientific foundation describing how the mind organizes visual data. The stronger th...
1-Why use Gestalt for web design? <ul><ul><ul><li>-  Usability: using white space to effectively distinguish between eleme...
2. The Gestalt laws <ul><ul><ul><li>2-1. Similarity </li></ul></ul></ul><ul><ul><ul><li>2-2. Proximity </li></ul></ul></ul...
2-1. Similarity <ul><ul><li>Objects that are similar, with like components or attributes are more likely to be organised t...
2-2. Proximity <ul><ul><li>The closer objects are to each other, the more likely they are to be perceived as a group </li>...
2-3. simplicity ( Symmetry) <ul><ul><li>people will visualise according to the simplest way of grouping items – and the ef...
2-4. Good continuation <ul><li>Objects will be grouped as a whole if they are co-linear, or follow a direction (Chang, 200...
2-5. Closure <ul><li>In perception there is the tendency to complete unfinished or partially obscured objects. </li></ul>
Similarity/Proximity Proximity/Similarity Good Continuation An example of a website using Gestalt laws…
3-Tips for effective web design for your course   <ul><li>A- make it simple.  </li></ul><ul><li>B- Maintain Webpage Design...
3.a- make it simple ( don’t crowd your website designs with unnecessary images)
3.b- Maintain Webpage Design Consistency across the Website   <ul><li>Ensure your WebPages are consistency, This will help...
3. c- Avoid too many Flashy Graphics and Animations <ul><li>Too many flashy graphics and animations can distract the viewe...
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   <ul><li>Chang, D., Dooley, L., & Tuovinen, J. E. (2002). Gestalt Theory in Visual Screen Design – A New Look ...
Upcoming SlideShare
Loading in …5
×

EDGE903 task4

892 views

Published on

Published in: Education, Technology, Business
  • Be the first to comment

EDGE903 task4

  1. 1. Gestalt theory and website design by Amani Alanazi 3139566 EDGE903 Spring09
  2. 2. Outline <ul><li>1- Why use Gestalt for web design? </li></ul><ul><li>2- The Gestalt laws </li></ul><ul><li>3-Tips for effective web design for your course </li></ul><ul><li>4- References </li></ul>
  3. 3. <ul><li>- Gestalt theory is simply a scientific foundation describing how the mind organizes visual data. The stronger the clarity of form, the better the design.” </li></ul><ul><li>http://www.firstcoastcreative.net/index.php?p=18 </li></ul><ul><li>- 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) </li></ul>1. Why use Gestalt for web design?
  4. 4. 1-Why use Gestalt for web design? <ul><ul><ul><li>- Usability: using white space to effectively distinguish between elements. </li></ul></ul></ul><ul><ul><ul><li>- Easily scanned designs. </li></ul></ul></ul><ul><ul><ul><li>- Accessibility: easier for those who are visually impaired to understand a page. </li></ul></ul></ul>
  5. 5. 2. The Gestalt laws <ul><ul><ul><li>2-1. Similarity </li></ul></ul></ul><ul><ul><ul><li>2-2. Proximity </li></ul></ul></ul><ul><ul><ul><li>2-3. simplicity </li></ul></ul></ul><ul><ul><ul><li>2-4. Good continuation </li></ul></ul></ul><ul><ul><ul><li>2-5. Closure </li></ul></ul></ul>
  6. 6. 2-1. Similarity <ul><ul><li>Objects that are similar, with like components or attributes are more likely to be organised together (Schamber, 1986). </li></ul></ul>
  7. 7. 2-2. Proximity <ul><ul><li>The closer objects are to each other, the more likely they are to be perceived as a group </li></ul></ul>
  8. 8. 2-3. simplicity ( Symmetry) <ul><ul><li>people will visualise according to the simplest way of grouping items – and the effort to simplify complex items is unconscious (Chang, 2002). </li></ul></ul>
  9. 9. 2-4. Good continuation <ul><li>Objects will be grouped as a whole if they are co-linear, or follow a direction (Chang, 2002) </li></ul>
  10. 10. 2-5. Closure <ul><li>In perception there is the tendency to complete unfinished or partially obscured objects. </li></ul>
  11. 11. Similarity/Proximity Proximity/Similarity Good Continuation An example of a website using Gestalt laws…
  12. 12. 3-Tips for effective web design for your course <ul><li>A- make it simple. </li></ul><ul><li>B- Maintain Webpage Design Consistency across the Website. </li></ul><ul><li>C- Avoid too many Flashy Graphics and Animations. </li></ul><ul><li>D- keep the background white </li></ul><ul><li>E- clear site structure </li></ul>
  13. 13. 3.a- make it simple ( don’t crowd your website designs with unnecessary images)
  14. 14. 3.b- Maintain Webpage Design Consistency across the Website <ul><li>Ensure your WebPages are consistency, This will help with viewer comfort when browsing your website.    </li></ul>
  15. 15. 3. c- Avoid too many Flashy Graphics and Animations <ul><li>Too many flashy graphics and animations can distract the viewer from the content of your website </li></ul>
  16. 16. 3.d- keep your website’s background white ( which make the text information on your website to stand out and be readable)
  17. 17. 3.e- make the site’s structure easy to follow
  18. 18. Remember to be your self
  19. 19. References <ul><li>Chang, D., Dooley, L., & Tuovinen, J. E. (2002). Gestalt Theory in Visual Screen Design – A New Look at an Old Subject. Paper presented at 7 th World Conference on Computers in Education, 29 th July – 3 rd August, Australian Computer Society, Copenhagen </li></ul><ul><li>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. </li></ul><ul><li>Lyons, A. (2001). Gestalt Approaches to the Virtual Gesantkunstwerk. Unpublished Paper. from http://www.tstex.com/gestalt.htm </li></ul><ul><li>http://www.netstarter.com.au/Content_Common/pg-web-site-design-tips-sydney.seo </li></ul><ul><li>http://shannonebarry.blogspot.com/2008/12/dare-to-be-yourself.html </li></ul>

×