“Creating Visual Hierarchy with Type” and “Using the Gestalt Theory to Guide Layout”

READING SUMMARY

The “Creating Visual Hierarchy with Type” video tutorial explains how visual hierarchy is important in creating a sense of order. It leads viewers to where they should start, move text, and end, as well as lets them know what the most and least important visual information is. Headlines can pop out with larger text size and a bolder font. Adding space between text helps group similar things together and makes them more readable. The “Using Gestalt Theory to Guide Layout” video tutorial discusses the four Gestalt theories and how they are used. The theories are based on the fact that the brain automatically seeks to organize visual information. The four Gestalt theories are proximity, similarity, continuity, and closure. Proximity means that items that belong together should be placed or grouped together, and similarity states that things that look alike must be related somehow. Continuity involves flow, meaning a line always seems to be pointing from one place to another. Closure is that we as humans fill in blanks for missing visuals; we see negative space as positive sometimes, and vice versa.

OUTSIDE EXAMPLE

While writing this blogpost, I had the book White Space Is Not Your Enemy next to me. I looked at the cover and noticed the design work actually put into it (which, funnily enough, it explains how to do). First, you look at the big colored letters W, S, I, N, Y,  and E. Then, you read the smaller (but still large and bold font) right beneath it, reading “White Space Is Not Your Enemy:” and next, the small font below that explaining what the book is in a few words. Lower down on the cover are the names of the authors, with the same font and size as the book’s explanation. It’s a visually pleasing cover, but I just happened to actually look at it today.

READING CONNECTION

The cover of White Space Is Not Your Enemy uses both visual hierarchy and the Gestalt theories. As viewers, we first look at the big, bold, colorful letters, and then look below it to figure out what they mean with the bold, large-font title of “White Space Is Not Your Enemy”, with the larger colorful letters being its acronym. We then automatically look below that to the smaller font explaining what the book is, then lower down the cover to the authors’ names. The cover was purposely designed so that we would look at the title and its colorful acronym first, then to the explanation and names. This is visual hierarchy. The letters, title, and short explanation are all placed together in the middle/top of the cover (proximity), and all the letters that make up the acronym look similar (although they are different colors) and are therefore related (similarity). Our eyes also follow a line, though not an actual line, when we look at the cover, moving down as the text gets smaller and less bold. The title lines up below the letters, and the explanation is off to the side a bit but lined up with the authors’ names further below (continuity). Overall, I noticed how the Gestalt laws and visual hierarchy are used in real life on simple things like book covers.

One thought on ““Creating Visual Hierarchy with Type” and “Using the Gestalt Theory to Guide Layout”

Leave a comment

Design a site like this with WordPress.com
Get started