DESIGN BASICS PART VI – Unity, Variety & Harmony
It’s finally here. This is it. The moment we’ve been waiting for- UNITY, VARIETY and HARMONY in design. We’ve talked about all of the ELEMENTS that are used to create a design. And we’ve talked about all the PRINCIPLES used to make those elements work well in a design. Now with this final principle we are hopefully going to learn to put it all together in a design that looks and complete and works well.
WATCH THIS:
Elder Christofferson talks about Unity and Harmony. He also talks about how that doesn’t mean that we all need to be exactly the same, or have the same opinions. We can be different. In fact variety within our unity is a good thing. How do the principles, examples and definitions he uses in this talk also apply to visual art and design? How can you apply these principles to help you communicate your ideas in a way that is pleasing and easy to understand?
What is UNITY?
Unity is a sense of oneness (a cohesion or agreement) found in the artwork. This is a sense that all the parts fit together visually; that the whole artwork is greater than the forms or any other parts of the work.
What is VARIETY?
Variety refers to how artists and designers add complexity to their work using visual elements. Contrast, difference and change, and elaboration all add visual interest to an artist’s work. Variety is a good thing in design. It keeps things interesting.
How can you use Variety and Unity together? This is where HARMONY comes in. Unity can be achieved by making everything similar, but also by making things that are different work together well. Variety makes design less boring. Think of this in terms of an orchestra. The conductor directs the musicians who are playing many different instruments, but together, the notes that are played come together to form one, comprehensible sound. When unity is seen, all the visual elements (or ideas) in the artwork are joined together to create a harmonic work of art.
There is word often used in the design / art world that you may hear sometime when discussing Unity. That word is GESTALT. Gestalt is a wonderful word that I should have included in your notecards but, alas, I have failed miserably to do so. Why do I like this word? It is a German word and often times German words don’t have an exact equivalent word in English- thus the need for us to use the German word. My favorite German word is Schadenfreude- Schadenfreude is a word that means: the experience of pleasure, joy, or self-satisfaction that comes from learning of or witnessing the troubles, failures, pain, or humiliation of another. Schadenfreude is the reason that Fail videos exist. When you enjoy watching someone slip on the ice, or fall off a rope swing and miss the lake, or watching a kid try to drink a slurpee but the whole thing comes out of the cup and covers his face in instant frozen deliciousness – and because proper english blokes don’t have a good word for it- you are experiencing schadenfreude. A perfectly wonderful word.
Anyway – GESTALT is a word like that. In the simplest terms, gestalt theory is based on the idea that the human brain will attempt to simplify and organize complex images or designs that consist of many elements, by subconsciously arranging the parts into an organized system that creates a whole, rather than just a series of disparate elements. Our brain puts stuff together. I found the following article online on the manypixels.co website. I copied and pasted what I wanted here for your studies. Enjoy- It’s a beginners guide to Gestalt principles.
To understand how it works in practice, it’s best to look at the Gestalt principles in design one by one.
What are the gestalt principles?
The gestalt principles are an important set of ideas that, when implemented correctly, can significantly improve the aesthetics, user-friendliness, and functionality of a design.
Gestalt psychology is a school of thought looking at the human mind and behavior as a whole. It suggests that we don’t simply focus on every small component in the world around us but rather see it as an entirety.
In the simplest form, the theory is based on the idea that the human brain will attempt to simplify complex images by organizing multiple elements into a whole rather than a series of disparate elements.
Our brains are built to see structure and patterns to better comprehend our environment.
1. Similarity
Grouping together similar things is human nature. We like to order things alike, whether by shape, color, or form. The gestalt principle of similarity is when we see elements sharing characteristics as more related than those that don’t.
In graphic design, this principle of similarity is used more often than you think. It works both ways: grouping things together by color to show they correlate or in contrast leaving one element out to draw attention.
A call-to-action button often differs in color so that it stands out. The same goes for a link in the text, usually colored and underlined. Then again, each link and call-to-action button is formatted similarly, allowing viewers to make that instant connection.
2. Good figure
The theory of good figure in gestalt design is when we perceive ambiguous shapes as simple as possible. It’s also known as the law of good figure, or prägnanz in German.
The Olympics logo is a classic example of gestalt design. How would you describe it? If you’d describe it as five overlapping circles, that’s the law of good figure in action. Seeing it as a combination of curvy lines would be more complicated to comprehend, so we automatically perceive it as overlapping circles instead.
3. Proximity
The principle of proximity in gestalt psychology relies on the fact that we define whether elements are related based on distance. Elements placed close to each other are deemed more related than elements set far apart.
Your audience will recognize individual elements clustered together in one area or group as one entity.
4. Continuation
The gestalt principle of continuation posits the human eye will follow the smoothest path. We see elements that are on the same line or curve as more related than those outside of the path.
This continuity perception is a valuable tool for directing your visitors through elements a certain way.
Our eyes naturally follow lines, so if you want to draw attention from one item to the next, it’s wise to quite literally put them in line. Horizontal sliders and social media carousels are both examples that take advantage of this principle.
5. Closure
Closure is the idea that your brain can automatically fill in the blanks when looking at an image or design.
We try to bring meaning and order to any meaningless chaos. Our eyes do that via reification: making sense of something by filling in missing data.
A simple example is your eyes following along with a dotted line. The World Wildlife Fund logo is a famous example of a more complex application. The outline of the panda isn’t complete; large chunks are missing. However, your brain has no problem filling those in automatically.
6. Figure/ground
Also known as the principle or law of perception, this gestalt idea posits that people instinctively perceive objects as either figure (the focal point) or ground (background). This means our brain automatically distinguishes elements in the foreground or background of an image.
Things get interesting when the foreground and background both contain distinct images, like this film poster for Peter and the Wolf.
The wolf poses in a way that the negative space creates the profile of a boy, presumably Peter. This is an excellent example of gestalt design showing how to use negative space creatively.
Newer principles
Most lists of gestalt principles of design will include the ones mentioned above. However, there are also a few newer principles which you should know about.
Common fate
More recently, the principle of common fate or synchrony was added to the gestalt principles. The principle states that we group things that are either moving or pointing in the same direction.
It often refers to a group of individual elements, but since they move seemingly as one, human perception groups them and treats them as a single stimulus. Elements don’t necessarily have to move, but they do have to give the impression of motion.
An example in our surroundings is a flock of birds. Rather than processing every bird as a distinct element, we see the flock as an entity.
Parallelism
This principle is quite similar to the one of proximity. Simply put, it suggests that elements parallel to each other are likely to be seen as related, as opposed to ones that are not.
One of the most common examples of this gestalt principle of design is in ecommerce web design. You’ll often see products in the same group appearing in parallel lines, as this helps viewers consider different options for the same/similar product.
On the other hand, a landing page explaining a single product or service in more detail, usually has a top-down layout to allow viewers to concentrate on each feature separately.
Inclusivity
So, gestalt principles of design explain how several design elements can create a single picture. Well, inclusivity is a principle that gives that idea a more pragmatic twist.
It suggests that elements enclosed in a common boundary are perceived as a single element.
This principle is often used in combination logos. This type of logo combines text and graphic elements. So, to ensure the two elements are perceived as a single entity many designers use some sort of framing or borders.
One of the most famous examples is certainly the Starbucks logo.It includes three different graphic elements (two stars and a mermaid) and two words. Yet, neatly packed together inside a circle, it’s impossible to imagine this logo without any of the elements.
Gestalt principles in graphic design
From the 1920s, designers began incorporating gestalt principles in their work. It led designers to believe that we all share specific characteristics in perceiving visual objects. Therefore, we all have a natural ability to see ‘good’ design.
After all, gestalt psychology and graphic design have a lot in common. Both rely heavily on creative problem-solving. Gestalt design is a natural forthcoming combining the two.
Embracing gestalt design can positively affect your design and how others perceive it. Similarity can create cohesiveness, leading to recognition of your brand, for example.
It allows for visual hierarchy, ensuring that the most critical element attracts attention first. Additionally, gestalt principles help take the guesswork out of design, minimizing confusion and frustration among viewers.
We hope this helps you understand more about gestalt theory in graphic design and why it’s important.
These principles also give you a glimpse of what is happening behind the scenes of a design process. It goes to show how much more graphic design is than just a pretty image.
Watch these:
FIND: Look for other examples of art/design that has good unity, variety, and/or harmony. They can utilize Gestalt principles but do not need to.
- Bring 3 examples to class with you. Be prepared to explain how unity is achieved, what creates the harmony, and how variety helps or hurts the overall design.
CREATE: Create 3 still life photographs. Each photograph must contain at least 3 objects. the first photograph should communicate UNITY. The second should communicate VARIETY. And the third should communicate HARMONY. How will you communicate these different principles.
Please email the images to me so we can show them on the screen.
my email address is <jaydfontano@gmail.com>
– !!!MOST IMPORTANT!!!-
HAVE FUN!! Design is fun.
WATCH:
