SlideShare a Scribd company logo
1 of 26
PRINCIPLES OF DESIGN
GESTALT
Unity and Harmony

Saad Aqeel Alzarooni




                © 2012 s a a d a q e e l a z l a r o o n i
Introduction
                    According to Gestalt theory, human naturally look for order or a relationship between
                    various elements. They observe and analyze individual parts of an image as separate
                    components and have the tendency to group these parts into a larger image that may
                    be very different from the components.
Alan Hashimoto and Mike Clayton: Visual Design Fundamentals (2009).

                                                      © 2012 s a a d a q e e l a z l a r o o n i
G E S T A L T
UNITY
Unity expresses the idea that things belong together. Harmony is another word that
might be used in place of unity. The idea that we tend to group similar elements and
try to find a relationship that exist between them is an example of how the design
principle of unity is incorporated into the Gestalt theory of visual perception.




                         © 2012 s a a d a q e e l a z l a r o o n i
Unity
                    This is an example of how grouping similar elements creates harmony in
                    design.

Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Lack Of Unity
                    This is an example of design that is chaotic and uncomfortable to view.



Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
G E S T A L T
UNITY AND PLACEMENT
USING LINE
The placement of lines of type that are organized to group information that
is related.




                      © 2012 s a a d a q e e l a z l a r o o n i
Unity and Placement Using Line
                    This is example of a page that uses the placemat of lines of type and
                    surrounded space to create a relationship between various forms of
                    information.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Unity and Placement Using Line
                    This shows the shapes and values that are formed by lines of type.



Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
G E S T A L T
UNITY AND PLACEMENT
USING SHAPE
The placement of elements next to each other is one way to create unity.




                     © 2012 s a a d a q e e l a z l a r o o n i
Unity And Placement Using Shape
                    This example shows shapes are placed far apart and all are too close to
                    the picture frame. When this happens, the edges of the composition will
                    receive the attention, and the middle feels open and empty.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Unity And Placement Using Shape
                    All of the shapes are placed in the center of the frame and close to each
                    others.

Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Unity And Placement Using Shape
                    This example shows chaos. Shapes placed at random.



Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Unity And Placement Using Shape
                    This example show a unifying design. Shapes placed with similar line
                    direction and related aspects of the shapes themselves.

Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
N W O S EIT
                         O YU E

NOW YOU                                         S EE             I T


Unity And Placement Using Shape
Type set close together and the same type set loose.




                    © 2012 s a a d a q e e l a z l a r o o n i
NOW YOU                                        NOW YOU
SEE IT:                                                SEE IT:
VISUALIZATION TECHNIQUES                  VISUALIZATION TECHNIQUES




Unity And Placement Using Shape
Unity between type and lines of type.




                    © 2012 s a a d a q e e l a z l a r o o n i
G E S T A L T
REPETITION USING LINE
Repetition is a characteristic of unity that can be applied to any element of design.
The idea is that a part of a design repeats somewhere else in a composition to
create unity.




                       © 2012 s a a d a q e e l a z l a r o o n i
Repetition Using Line
                    This is an example of how repetition of a line can unify a composition.
                    The design is made up of three shapes. The shapes seem to feel unified
                    but the circle seems out of place.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Repetition Using Line
                    This example illustrates how repeating a line similar to the circle can
                    make the entire composition more harmonious. The newly added line is
                    large to give the design variety and interest.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Repeated Line Direction and Unity
                    This example of how repeating the vertical line directions of primary
                    shapes unifies a design. However, the design contains shapes that seem
                    unrelated.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Repeated Line Direction and Unity
                    This example shows that through the use of vertical line direction, the
                    shapes appear to be more unified.

Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
G E S T A L T
REPETITION USING SHAPE
There are two types of shapes: rectilinear and curvilinear. Designs that consist of similar types
of shapes are usually harmonious.




                          © 2012 s a a d a q e e l a z l a r o o n i
Repetition Using Shape
                    This example shows design with similar rectilinear shapes.



Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Repetition Using Shape
                    This example shows design with similar curvilinear shapes.



Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
Repetition Using Shape
                    The design makes use of both shapes in one composition, illustrating the idea
                    that both types of shapes can be present in a unified design. The idea that
                    these shapes are different from each other but can exist in the same design is
                    a good example of balancing unity with variety.
Inspired by: Alan Hashimoto and Mike Clayton (2009).

                                                       © 2012 s a a d a q e e l a z l a r o o n i
saad aqeel alzarooni
Saad is passionate social designer and
ethnographic researcher. His current
research interests fall mainly in applied
knowledge modeling for planning and
evaluation and visual thinking for design
research.

Links:
linkedin.com/in/saadaqeelalzarooni
contextualresearch.wordpress.com
ideaviz.wordpress.com
saadaqeelalzarooni.wordpress.com
issuu.com/saadaqeel




                                       © 2012 s a a d a q e e l a z l a r o o n i
END


© 2012 s a a d a q e e l a z l a r o o n i
                                             26

More Related Content

Viewers also liked

Redesigning learning space at gulfstream building scad 2009
Redesigning learning space at gulfstream building scad 2009Redesigning learning space at gulfstream building scad 2009
Redesigning learning space at gulfstream building scad 2009SAAD ALZAROONI, CM
 
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...SAAD ALZAROONI, CM
 
The role of community art programs in building social capital thesis prospec...
The role of community art programs in building social capital  thesis prospec...The role of community art programs in building social capital  thesis prospec...
The role of community art programs in building social capital thesis prospec...SAAD ALZAROONI, CM
 
Social impacts of participation in cultural events
Social impacts of participation in cultural eventsSocial impacts of participation in cultural events
Social impacts of participation in cultural eventsSAAD ALZAROONI, CM
 
Bayawan and Basay Cultural Mapping
Bayawan and Basay Cultural MappingBayawan and Basay Cultural Mapping
Bayawan and Basay Cultural MappingMonte Christo
 
Exploring the use of cultural mapping
Exploring the use of cultural mappingExploring the use of cultural mapping
Exploring the use of cultural mappingSAAD ALZAROONI, CM
 
Cultural Mapping Dumaguete City
Cultural Mapping Dumaguete CityCultural Mapping Dumaguete City
Cultural Mapping Dumaguete CityMonte Christo
 
Gestalt Laws and Design
Gestalt Laws and DesignGestalt Laws and Design
Gestalt Laws and Designchelsc
 

Viewers also liked (8)

Redesigning learning space at gulfstream building scad 2009
Redesigning learning space at gulfstream building scad 2009Redesigning learning space at gulfstream building scad 2009
Redesigning learning space at gulfstream building scad 2009
 
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...
Initial Findings from Field Research: Ellis Square in Savannah by Huey Park &...
 
The role of community art programs in building social capital thesis prospec...
The role of community art programs in building social capital  thesis prospec...The role of community art programs in building social capital  thesis prospec...
The role of community art programs in building social capital thesis prospec...
 
Social impacts of participation in cultural events
Social impacts of participation in cultural eventsSocial impacts of participation in cultural events
Social impacts of participation in cultural events
 
Bayawan and Basay Cultural Mapping
Bayawan and Basay Cultural MappingBayawan and Basay Cultural Mapping
Bayawan and Basay Cultural Mapping
 
Exploring the use of cultural mapping
Exploring the use of cultural mappingExploring the use of cultural mapping
Exploring the use of cultural mapping
 
Cultural Mapping Dumaguete City
Cultural Mapping Dumaguete CityCultural Mapping Dumaguete City
Cultural Mapping Dumaguete City
 
Gestalt Laws and Design
Gestalt Laws and DesignGestalt Laws and Design
Gestalt Laws and Design
 

Principles Of Design Part I Gestalt Laws

  • 1. PRINCIPLES OF DESIGN GESTALT Unity and Harmony Saad Aqeel Alzarooni © 2012 s a a d a q e e l a z l a r o o n i
  • 2. Introduction According to Gestalt theory, human naturally look for order or a relationship between various elements. They observe and analyze individual parts of an image as separate components and have the tendency to group these parts into a larger image that may be very different from the components. Alan Hashimoto and Mike Clayton: Visual Design Fundamentals (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 3. G E S T A L T UNITY Unity expresses the idea that things belong together. Harmony is another word that might be used in place of unity. The idea that we tend to group similar elements and try to find a relationship that exist between them is an example of how the design principle of unity is incorporated into the Gestalt theory of visual perception. © 2012 s a a d a q e e l a z l a r o o n i
  • 4. Unity This is an example of how grouping similar elements creates harmony in design. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 5. Lack Of Unity This is an example of design that is chaotic and uncomfortable to view. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 6. G E S T A L T UNITY AND PLACEMENT USING LINE The placement of lines of type that are organized to group information that is related. © 2012 s a a d a q e e l a z l a r o o n i
  • 7. Unity and Placement Using Line This is example of a page that uses the placemat of lines of type and surrounded space to create a relationship between various forms of information. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 8. Unity and Placement Using Line This shows the shapes and values that are formed by lines of type. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 9. G E S T A L T UNITY AND PLACEMENT USING SHAPE The placement of elements next to each other is one way to create unity. © 2012 s a a d a q e e l a z l a r o o n i
  • 10. Unity And Placement Using Shape This example shows shapes are placed far apart and all are too close to the picture frame. When this happens, the edges of the composition will receive the attention, and the middle feels open and empty. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 11. Unity And Placement Using Shape All of the shapes are placed in the center of the frame and close to each others. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 12. Unity And Placement Using Shape This example shows chaos. Shapes placed at random. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 13. Unity And Placement Using Shape This example show a unifying design. Shapes placed with similar line direction and related aspects of the shapes themselves. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 14. N W O S EIT O YU E NOW YOU S EE I T Unity And Placement Using Shape Type set close together and the same type set loose. © 2012 s a a d a q e e l a z l a r o o n i
  • 15. NOW YOU NOW YOU SEE IT: SEE IT: VISUALIZATION TECHNIQUES VISUALIZATION TECHNIQUES Unity And Placement Using Shape Unity between type and lines of type. © 2012 s a a d a q e e l a z l a r o o n i
  • 16. G E S T A L T REPETITION USING LINE Repetition is a characteristic of unity that can be applied to any element of design. The idea is that a part of a design repeats somewhere else in a composition to create unity. © 2012 s a a d a q e e l a z l a r o o n i
  • 17. Repetition Using Line This is an example of how repetition of a line can unify a composition. The design is made up of three shapes. The shapes seem to feel unified but the circle seems out of place. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 18. Repetition Using Line This example illustrates how repeating a line similar to the circle can make the entire composition more harmonious. The newly added line is large to give the design variety and interest. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 19. Repeated Line Direction and Unity This example of how repeating the vertical line directions of primary shapes unifies a design. However, the design contains shapes that seem unrelated. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 20. Repeated Line Direction and Unity This example shows that through the use of vertical line direction, the shapes appear to be more unified. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 21. G E S T A L T REPETITION USING SHAPE There are two types of shapes: rectilinear and curvilinear. Designs that consist of similar types of shapes are usually harmonious. © 2012 s a a d a q e e l a z l a r o o n i
  • 22. Repetition Using Shape This example shows design with similar rectilinear shapes. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 23. Repetition Using Shape This example shows design with similar curvilinear shapes. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 24. Repetition Using Shape The design makes use of both shapes in one composition, illustrating the idea that both types of shapes can be present in a unified design. The idea that these shapes are different from each other but can exist in the same design is a good example of balancing unity with variety. Inspired by: Alan Hashimoto and Mike Clayton (2009). © 2012 s a a d a q e e l a z l a r o o n i
  • 25. saad aqeel alzarooni Saad is passionate social designer and ethnographic researcher. His current research interests fall mainly in applied knowledge modeling for planning and evaluation and visual thinking for design research. Links: linkedin.com/in/saadaqeelalzarooni contextualresearch.wordpress.com ideaviz.wordpress.com saadaqeelalzarooni.wordpress.com issuu.com/saadaqeel © 2012 s a a d a q e e l a z l a r o o n i
  • 26. END © 2012 s a a d a q e e l a z l a r o o n i 26