Thinking about grids

What’s a grid?

A grid is a two dimensional mix of horizontal and vertical lines with the purpose of structuring content.  The simplest grid design is a single column surrounded by margins.  With more complex information, multicolumned grid designs are better by further dividing the space for images and different types of texts.

What are margins and why are they important?

Margins are spaces left at each side of a page that surround the main body.  Margins can symmetrical or asymmetrical with respective to a single page or the facing page depending on style.  Margins are important because it determines how much of a page is devoted to conveying information.  In addition, with varying spaces that surrounds the page, different feel can be portrayed.

Which sample design do you like best from this chapter? Why?

I liked the design under “Modular Grid” because it combines the “hangline” and consistent vertical and horizontal division.  This is how most textbooks are designed, which is why I find them extremely easy to read and conveys the needed information very well.  Designs that deviate from the “Modular Grid” like most magazines I find difficult to read, because the parts are just everywhere.

What grid(s) are used to layout the “Grid” chapter of this book?

I think the chapter is designed using a modular grid system, with the columns split with the golden ratio proportion and the rows based on the height of the heading.  It’s much easier to see how the column is split vs the rows, since all the text seems to all stop at the golden ratio (some pictures don’t go all the way).  Horizontally it’s a tough call because it’s hard to see what’s the largest spacing that consistently divides all portions of the chapter.

What type of grid is best for simple documents?

For simple documents, the single column grid works great.  It’s the most default one (aka how most people write papers for class).


Resume and business card final

Final Resume

Took in the suggestions from Tuesday’s critique and changed the name to be in one color with heavier stroke.  Additionally, added more space between Courses and Language.  The area between the left and right column has also expanded for clear separation.  Arrow bullets were removed due to distraction, and the overall resume was slight adjusted in location.

Final Business Card

Keeping with the clean design of the resume, name is colored and bolded in Garamond with title, affiliations, and contact information in Helvetica.  Carnegie Mellon logo adds prominence to institution association.

Resume rough draft


Sketches were aligned to the two thirds, one third rule.  Played around ideas stemming from the classical resume layout.

Resume Draft

Used Garamond for name to differentiate from the rest of the resume.  Coloring highlights the main parts of the resume (along with all caps).  Following the two thirds, one third rule to focus attention on employment experience.  Four levels of hierarchy to further classify personal information.