Upload
roberto-dadda
View
522
Download
0
Tags:
Embed Size (px)
DESCRIPTION
Gestalt elements for web designers
Citation preview
WEB DESIGNMater of Arts in Communication Design
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 2
Gestalt (applied to design)Visual perception theory
Gestalt
"The whole is other than the sum of the parts" Kurt Koffka
WEB DESIGN NABA 2014 Roberto DADDA 3 Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 4 Gestalt
WEB DESIGN NABA 2014 Roberto DADDA
Zeotrope
Gestalt 5
WEB DESIGN NABA 2014 Roberto DADDA 6 Gestalt
WEB DESIGN NABA 2014 Roberto DADDAGestalt 7
WEB DESIGN NABA 2014 Roberto DADDAGestalt 8
WEB DESIGN NABA 2014 Roberto DADDAGestalt 9
WEB DESIGN NABA 2014 Roberto DADDAGestalt 10
S.Dalì, 1935, Mae West
WEB DESIGN NABA 2014 Roberto DADDA
GestaltPrinciple of form perception
Gestalt 11
WEB DESIGN NABA 2014 Roberto DADDA 12
Gestalt grouping
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 13
The law of proximity posits that when we perceive a collection of objects, we will see objects close to each other as forming a group.
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 14 Gestalt
WEB DESIGN NABA 2014 Roberto DADDAGestalt 15
WEB DESIGN NABA 2014 Roberto DADDA 16
The law of symmetry captures the idea that when we perceive objects we tend to perceive them as symmetrical shapes that form around their centre.
Gestalt
[ ][ ][ ]
WEB DESIGN NABA 2014 Roberto DADDA
Similarity occurs when objects look similar to one another. People often perceive them as a group or pattern.
Gestalt 17
WEB DESIGN NABA 2014 Roberto DADDA 18 Gestalt
Opera
WEB DESIGN NABA 2014 Roberto DADDAGestalt 19
WEB DESIGN NABA 2014 Roberto DADDA
When similarity occurs, an object can be emphasised if it is dissimilar to the others. This is called anomally.
Gestalt 20
The figure on the far right becomes a focal point because it is dissimilar to the other shapes.
WEB DESIGN NABA 2014 Roberto DADDA 21
Aka common fate
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA
The law of closure posits that we perceptually close up, or complete, objects that are not, in fact, complete.
Gestalt 22
WEB DESIGN NABA 2014 Roberto DADDA 23 Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 24Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 25 Gestalt
WEB DESIGN NABA 2014 Roberto DADDAGestalt 26
WEB DESIGN NABA 2014 Roberto DADDAGestalt 27
WEB DESIGN NABA 2014 Roberto DADDA
Closure: let’s use it!
Gestalt 28
WEB DESIGN NABA 2014 Roberto DADDA 29 Gestalt
WEB DESIGN NABA 2014 Roberto DADDA
Continuation occurs when the eye is compelled to move through one object and continue to another object.
Gestalt 30
WEB DESIGN NABA 2014 Roberto DADDA 31
Aka good curve
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 32
Aka good figure
Gestalt
WEB DESIGN NABA 2014 Roberto DADDA 33
The figure & ground phenomenon captures the idea that in perceiving a visual field, some objects take a prominent role (the figures) while others recede into the background (the ground).
Gestalt
Figure-ground ambiguities. (a) Ambiguous face–vase (31). (b) Normally, trees are seen as figure, and the space between as ground. However, when the space is attended, or when it has a meaningful shape, it also can be seen as figure. (Courier & Ives, ca. 1835).
Edgar Rubin
WEB DESIGN NABA 2014 Roberto DADDA 34 Gestalt
WEB DESIGN NABA 2014 Roberto DADDA
Experience
Gestalt 35
WEB DESIGN NABA 2014 Roberto DADDAGestalt 36
WEB DESIGN NABA 2014 Roberto DADDAGestalt 37
WEB DESIGN NABA 2014 Roberto DADDAGestalt 38
Maurits Cornelis Escher(Leeuwarden, 17 giugno 1898 – Laren, 27 marzo 1972)
WEB DESIGN NABA 2014 Roberto DADDAGestalt 39
WEB DESIGN NABA 2014 Roberto DADDAGestalt 40
WEB DESIGN NABA 2014 Roberto DADDAGestalt 41
WEB DESIGN NABA 2014 Roberto DADDA
Ambiguity
Gestalt 42
WEB DESIGN NABA 2014 Roberto DADDA 43 Gestalt
WEB DESIGN NABA 2014 Roberto DADDAGestalt 44
WEB DESIGN NABA 2014 Roberto DADDA
You should always start with the container, or the overall structural shell of a design. Forget the details and individual components for now.
Gestalt 45
WEB DESIGN NABA 2014 Roberto DADDAGestalt 46
WEB DESIGN NABA 2014 Roberto DADDAGestalt 47
Roberto Dadda
[email protected]+39 338 775 22 03Twitter, facebook, linkedin: robertodadda