Gestalt Principles
Gestalt principles describe how the human eye perceives visual elements—in particular, they tell us that complex images tend to be reduced to simpler shapes.
In UX design and interaction design, Gestalt principles play a large role in making interfaces usable and easy to understand. Designers can use the Gestalt principle of proximity—where elements that are arranged together can form a more complex image—to group conceptually similar elements together in a website. An example would be grouping an image, a title, and an excerpt together in an “article card” design.
The Law of Similarity - Gestalt Principles (1)
The Law of Similarity - Gestalt is a German word that carries much importance, especially for us as designers. Let’s have a close look at its principles so that we can see how much information this little word encompasses!
The central principle to the Gestalt theory was neatly summarized by the Gestalt psychologist Kurt Koffka: "The whole is other than the sum of the parts." The human eye and brain perceive a unified shape in a different way to the way they perceive the individual parts of those shapes. This global whole is a separate entity that is not necessarily formed by the sum of its parts. When we fully understand Gestalt design principles, we can utilize them to create more interesting and engaging visual experiences for website and app users. You can take advantage of these laws to design more thoughtfully and effectively, knowing exactly how your work can impact your users.
2. Laws of Proximity, Uniform Connectedness, and Continuation – Gestalt Principles (2)
In this, the second part we’ll look at another Law called - The Law of Proximity. This one is especially useful as it deals with how our eyes and brains draw connections with design images. Of course, connecting is also important to us – that’s what we want to make happen between our users and our designs!
“The eye tends to build a relationship between elements of the same design,” is a crucial saying to keep in mind. Our brains build connections between disparate design elements based on laws of visual perception. These are influenced by the way in which elements in a design are laid out. The laws that apply are those of proximity, uniform connectedness, and continuation.
What Is the Law of Unified Connectedness?
The law of unified connectedness states that elements that are connected to each other using colors, lines, frames, or other shapes are perceived as a single unit when compared with other elements that are not linked in the same manner.
Implementing this connectedness in your designs is easy; there are many ways to indicate grouping within a design. Some common examples include:
1. Connecting related links or buttons by adding them to the same drop-down menu.
2. Using the same bullet shapes, colors, or numbering system (such as Roman numerals, Arabic numbers, etc.) on list items to group them with each other.
3. Displaying functions of a similar nature, such as login, sign up, and forgotten password, so that they are related, inside a frame or colored rectangle.
What Is the Law of Continuation?
The Law of Continuation asserts that the human eye follows lines, curves, or a sequence of shapes in order to determine a relationship between design elements.
--------------------------------------------------
Take Away for this slide is -
Similarity (also known as Invariance): The human eye tends to build a relationship between similar elements within a design. Similarity can be achieved using basic elements such as shapes, colors, and size.
Continuation: The human eye follows the paths, lines, and curves of a design, and prefers to see a continuous flow of visual elements rather than separated objects.
Proximity (also known as Emergence): Simple shapes arranged together can create a more complex image.
Uniform Connectedness: This Law deals with a “grouping effect”: we perceive elements as connected to each other thanks to colors, lines, frames, or other shapes.
