Exercise: Grid Analysis & Sketching
Grid Analysis Exercise:
Find four grid examples (a. novel; b. magazine; c. textbook; d. website) and explain the type of grid.
What is the purpose of the grid and what how does it help organize the information?
Example 1: Novel
My first example is a photography book I have had for a long time.
Here are photos of the layout on the inside:
This book uses the Golden Section to constrain the main text and the images, with highlights or notes off to the side. I believe this layout is simple yet effective, as it focuses on the photography itself and it’s analysis. It allows for one to skim through the book by only looking at the images and highlighted notes for inspiration without impeding a deeper read.
Example 2: Magazine
Here is the layout for a couple of different articles from TIME magazine:
TIME magazine uses a 3-column layout, as shown above. I like how they break up the layout different ways to highlight certain graphics or quotes. Sometimes the text is isolated to one column or to all three columns on one vertical section of the page (often with a title or large image occupying the rest of the page), which allows them to create variety while sticking to the grid.
Example 3: Textbook
This is the inside of my Human Biology textbook.
On first glance, it looks like a simple two-column layout.
Zooming out though, it becomes more apparent that the layout varies depending on the content. For content within the chapter, we still see the two-column layout. However, the content is broken up with different colored sections to indicate the type of content one is looking at. For example, the green section with a more modular grid indicates that it is a story relevant to the content in the textbook. Similarly, the study tool and review material at the end of the chapter is also organized modularly. This variation of color and structure enables the reader to skip or find the information they are looking for faster.
Example 4: Website
The website you are reading this on.
Here are the two main layouts for Medium pages I found. The one on the left is the front page, and the one on the right is a page for specific topic. The grid on the left is modular, consisting of a header with featured articles and the list on articles down below with special sections on the right of the articles. This layout works by dividing up all the information one might want on the front page and highlighting certain articles one might want to click on immediately. The grid on the right alternates between two and three columns, highlighting the article in the two-column section with a larger image.
Here is the single-column layout of the Medium post. I believe this is the most effective of the layouts not because it’s really easy to read, but that it’s also really intuitive to write with which makes it easy for anyone to start writing on Medium.
Sketching 101:
Completed sketching worksheet.
