The days of designing for a single medium such as paper are long gone. With the availability of social media, email, and other screen based methods of mass communication very few designers will have a niche specialization. Not even interactive designers can specialize. Content that may originate on a website will also be displayed via an Android or iOS app. You will even find content that spans from paper, web, app, to eReader, and you will have to create designs that maintain consistency across all of these mediums.

The Washington Post is a perfect example of this multimedia approach to content delivery. Currently you can read an article from the Washington Post as a printed newspaper, on their website, on Android and iOS devices, and through digital subscriptions on Kindle and similar eReader devices.

Maintaining consistency across a single design can be tricky. Maintaining consistency across mediums and devices is hard even for the most experienced designer. The is especially true when you understand the fact that you won’t be producing the design. Rather, a team of developers and printers will bring your design choices to life. Your job as designers is to give the producers of your visual designs enough instructions so they can accurately replicate your design choices. This task will be much easier if you work with a Grid!

The Grid

Before the necessity of guiding developers with the visual interpretation of your designs, the grid has been a mainstay in the graphic designer’s toolbox since the 1920’s if not earlier. Graphic Design pioneers such as Herbert Bayer of the Bauhaus and the Russian Constructivist El Lissitzky utilized a grid to organize the content of their designs. These pioneers used the grid not only to create relationships between content, but on a spiritual level as a response to the rebuilding of a society devastated by World War One.

Kandinsky zum 60. Geburtstag by Herbert Bayer, 1926
Kandinsky zum 60. Geburtstag
Herbert Bayer, 1926

While the early pioneers used more of an implied grid—one often broken—by the 1940’s a strict adherence to a grid structure took hold. Often referred to as the Swiss, or International Style of Design the minimalist grid based designs were used to meet the needs of a post war global marketplace. Perhaps its greatest practitioner was Joseph Müller-Brockmann who’s complex grid based designs inspired many contemporary designers.

Josef Müller-Brockmann Posters
Josef Müller-Brockmann
1955 (left), 1960 (Right)

If Joseph Müller-Brockmann is considered the grandfather of the grid, Massimo Vignelli should be considered the father of the modern grid and design system. Vignelli’s 1977 Unigrid system for the National Park Service is a predecessor for many of the design systems existing today, including Bootstrap, the internal turned open-source HTML/CSS framework started at Twitter to keep documents consistent.

Unigrid National Park Service by Massimo Vignelli, 1977
Unigrid National Park Service
Massimo Vignelli, 1977
Unigrid National Park Service by Massimo Vignelli, 1977
Unigrid National Park Service by Massimo Vignelli, 1977
Unigrid National Park Service by Massimo Vignelli, 1977
Unigrid National Park Service by Massimo Vignelli, 1977

The Assignment

Working with a 12 or 16 column grid create an article layout for the following scenarios.

Part 01

With the supplied text create the following using a single font family of your choosing.


Upload your files for Part 01 with this link!

Part 02


Upload your files for Part 02 with this link!

Things to Consider