Project One: Questions about the grid
· Define Grid: A structure made up of horizontal and vertical lines, and on it the designer places components such as headings, text, images, captions etc. (Squire, pg 100).
· Why do we use a grid: A grid is essential, as it is the basis on which information is organized and clarified, ensuring legibility. The grid provides a framework where text, images, and space can be combined in a unified and cohesive manner (Squire, pg 100).
· Define Modular Grid: An area calculated in depth by the text leading and width by the text line length (Squire, pg 102). A grid made with horizontal and vertical gutters creating modules.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_3bBggvXrQwwA47lBjtPySZ0Gjoh2gWRowek2gZvDsdej7kMhzEqzhU4sEnvX019c_8P6J0q6dU0D52iZiN6kiRAzktJuuG_9Eyq5yuZ2gag7STYEkzoLhdfJrc24cwauxbLbpddhs7c/s200/margins.jpg) |
Margins. |
· Define Margins: The area that is not accommodated by the text (Squire, pg 102).
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigyR_N7Kk3GEMQhEueg4OJ3CbHs_FlIThxmgRsXjha8OQsLC1SM6HMoXDhXjCk3x4DknhpoxEp2_e3orDpNWep40fR-Jb60_JT7S-u_ifhv63R2X1FS-lPEEqb7zleynAt6V2G-8A6XUU/s200/columns.jpg) |
Columns. |
· Define Columns: Text positioned within the grid and formed by modules. Enables the designer to maintain consistent line length (Squire, pg 104).
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLwUF86v71Fx65ZXdSLG3o54JXIVU1AvDfcUQUJBO_VtTdNWNq3AcXb5wgNhfJbv-vRzN0dpCauvjT6-dG4NNEIoMWLaGI7XvBbmEyy0HQDsOUW_WM7NCrqwxX4hqlmzI9vsHSLM3azyU/s200/gridmodules.jpg) |
Grid Modules. |
· Define Grid Modules: An area calculated in depth by the text leading and width by the text line length (Squire, pg 102).
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSOnzSleiwzIjq2OVOlzVrk_ied3PhRv_DDi0GmyxhE0yl1hfmI6n8hoDo05pU5DoT4EtIHVbC_1ESMwroGno2eO_dIAOQqojddWuE2eaTEbaqNyfVV_8SN1p2V6KF28-b-W6iDC2eg-Y/s200/flowline.jpg) |
Flowline. |
· Define Flowlines: Horizontal line that appears on a layout within the text so your eye goes through the page.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWD5marLI2VE4qS4IEV1FL144q6Z76lffNSI-DL1i2YSQxjGQa-WzfoFsfNzJEeBNU_KrI-ZKxbcYARVZ8ebNdz4Ps2r3JOfGGasipnT8ApIZ6MihZGRrYlx9iinpUuMFiwDtdKJqVuxo/s200/gutter.jpg) |
Gutter. |
· Define Gutter: Inner margins of the page that separate modules from one another (Squire, pg 102).
· Define Hierarchy: An order of importance, placing text/items on a page so that one appears more prominent than the others and so on (Squire, pg 108).
· Define Typographic Color: The optical "grayness" of text type, particularly visible while squinting when viewing a block of text. The overall typographic color of a block of type is affected by the weight or boldness of the typeface, as well as the x-height and the contrast of the typeface used (PicaStudio.com)
· Ways to achieve a clear Hierarchy: Hierarchy depends on the nature of the text but a good rule of thumb is: 1. Heading, 2. Subheading, 3. Text, 4. Footnotes, 5. Headers/footers, 6. Folios. The following criteria should be used to emphasize hierarchy: 1. Choice of typeface, 2. Paragraph Spaces, 3. Use of type styles, 4. Alignment (Squire, pg 108).
· Define White Space: Negative space, space where no image or text exists. Enables hierarchy and can add tension or dramatic effect (GDR, pg 54).
· Define Contrast: Operates on two levels: first, how the elements within the layout contrast, and, second, how the layout itself contrasts within its context. Done through various uses of visual comparison (GDR, pg 55).