1. PBA Front-End Programming Gestalt Laws

2. The standard page compo- sition ”pattern” seems to be well-established; it works! But…why does it work…? Because it employs many of the Gestalt Laws

3. Gestalt Laws Gestalt Laws are a part of Cognition Psychology – how we percieve things in the surrounding world Gestalt (from German) means ”a whole structure or form, that emerges when a set of smaller, simpler components are combined in a certain way” Not a perfect translation…

4. Gestalt Laws

6. The Gestalt Laws are a set of statements about perception of elements in a certain context About ten laws – we will discuss some of them in the following

7. Gestalt Laws Law of Proximity Elements that are close to each other will be perceived as one single structure

8. Gestalt Laws Is this… …four vertical columns… …or… …seven horizontal rows… …or… …28 unrelated dots…?

9. Gestalt Laws Is this… …four vertical columns… …or… …seven horizontal rows… …or… …28 unrelated dots…?

10. Gestalt Laws Law of Similarity Elements that look similar will be perceived as one single structure

11. Gestalt Laws Is this… …12 unrelated columns… …or… …six groups of two columns, alternating between white and yellow?

12. Gestalt Laws Law of Closure Humans have a tendency to perceive an incomplete structure as complete (to close or fill the gaps)

13. Gestalt Laws Is this… …five unrelated circle fragments… …or… …a circle?

14. Gestalt Laws Is this… …five unrelated circle fragments… …or… …a circle?

15. Gestalt Laws How many triangles do you see in the pictures…?

16. Gestalt Laws Law of Closure (variant) Elements within a bounding structure will be perceived as one single structure

17. Gestalt Laws Is this… …six groups of two columns, alternating between white and yellow… …or… …three boxes con- taining a varying number of dots?

18. Gestalt Laws These three laws… – Law of Proximity – Law of Similarity – Law of Closure …are used very often in web design!

19. Gestalt Laws Law of Proximity: These menu items are related, and are physically close

20. Gestalt Laws Law of Similarity: These menu items are related, and they look similar

21. Gestalt Laws Law of Similarity: These menu items are related, and they look similar (but different from the other types of menu items)

22. Gestalt Laws Law of Closure: Do we have a outline of a box here…?

23. Gestalt Laws Law of Closure: Do we have a outline of a box here…?

24. Gestalt Laws Law of Prägnanz (or Good Form) Humans tend to order a set of elements into one simple, recognisable form

25. Gestalt Laws Is this… …a triangle and a square.. …or… …three geometric figures… …or… 11 linies…?

26. Gestalt Laws Is this… …a mysterious face on the surface of Mars… …or… …just a random effect caused by light and shadow…?

27. Gestalt Laws Law of Isomorphism (or Past Experience) Past experience and context has an influence on how we perceive an element

28. Gestalt Laws Is this… …the letter ”B” …or… …the number 13…?

29. Gestalt Laws You are on a Danish website… What do you expect to happen, when you click on these icons…?

30. Gestalt Laws Law of Good Continuation When there is an intersection between two or more objects, we tend to perceive each object as a single uninterrupted object

31. Gestalt Laws How did we produce this figure…?

32. Gestalt Laws How did we produce this figure…? + =

33. Gestalt Laws How did we produce this figure…? +=

34. Gestalt Laws Law of Figure and Ground We tend to organize our perceptions by distinguishing a figure from a ground

35. Gestalt Laws Is this… …a vase... …or… …two faces in silhouette?

36. Gestalt Laws http://www.slideshare.net/rogerpitiot/gestalt-theory

37. Gestalt Laws