DSGN6265 - Visual Communication Design 2 (New Media)

2015

THE GRID
Session 10-15
The Grid Basic
The grid is a basic design tool used as a guide for the
positioning and organizing of the various elements used
within a design.

Grids are the bone structure of a layout and serve as a

tool to help a designer achieve balance, while presenting a
potentially large degree of creative possibilities.
(Ambrose/Harris)
The Grid Basic

An invisible framework for all page elements.

A visual anchor for text and images.

A grid allows the designer to make informed decisions,
which eliminates the random placement of elements and
helps to ensure that the various elements work together
within the overall design.
A grid introduces systematic order to a
layout, distinguishing types of information
and easing a user’s navigation through them.
(Timothy Samara)
Grid can be loose and organic, or
they can be rigorous and
mechanical.
(Timothy Samara)
The benefits of working with grid:
Clarity, Efficiency, Economy, and Continuity.
(Timothy Samara)
> MANUSCRIPT GRID The block, or manuscript grid is structurally
> Column Grid
> Modular Grid the simplest kind of grid. Its base
> Hierarchical Grid
structure is a large
rectangular area that takes
up most of the page.
Even within such a simple structure, care
must be taken so the continuous type-
texture can be read comfortably page
after page.
> Manuscript Grid Column can be dependent on each other for
> COLUMN GRID running text, independent for small blocks of
> Modular Grid
> Hierarchical Grid or cross over to make
text,

wider columns…
The column grid is very flexible and can be used
to separate different kinds of information.
> Manuscript Grid A modular grid is essentially a column grid
> Column Grid with a large number of horizontal flowlines
> MODULAR GRID that sub divide the column into rows,
> Hierarchical Grid creating a matrix of cells called modules.
> Manuscript Grid Sometimes a hierarchical grid unifies
> Column Grid disparate elements or creates a
> Modular Grid
superstructure that opposes organic
> HIERARCHICAL GRID
elements in a single instance format like
poster.
A hierarchical grid can also be used to unify
sides of packages or to create new visual
arrangements if they’re displayed in groups.
Web pages are examples of hierarchical grid.
Tips:
The more units in your grid, the more
flexibility you will have to accommodate all
elements.
The End