The Atlantic: Structure, System, Form
Project 1: Grids
Introduction to Grid Systems:
September 1, 2020
–––––
We were introduced to the basics of a grid system: columns, gutters, rows, headers, page headers, footers, etc. With the provided example, we divided the composition into grids.
Sections
The page is divided into three main sections/columns.
Columns
Within the three main sections, there are three columns that define the placement of text and images.
Running Head
The running head can be found at the top of the page (green boxes), in sync with the main sections.
Header
The header is above the body text.
Body Text
The body text is right below the text header.
Images
The images can be found next to the text providing balance.
Markers
The marker is at the bottom of the page providing additional information.
Final composition of spread
Analyzing The Atlantic:
September 5, 2020
–––––
View Figma Board for process work
Core Questions
- How does The Atlantic’s mission as a company (its content) explain or justify the formatting and the composition of the publication?
- What does the choice of advertisements in the publication say about the brand and its mission?
First Impressions
- Very serious and informative: The use of serif fonts make it more trustworthy as a reader.
- Seems very politics heavy with its content because of the conservative and consistent use of columns.
- “Post-tragedy”
Background Research
“Who, what, when, why?”
- Founded in Boston early 1857
- Founded on abolishing/against slavery
- Focus on “free ideas” and “American thought experiment”
- Included “urgent essays” and “vital literature” tackling “important issues”
- Focus on “pursuit of truth” — politically neutral
- David G. Bradley (born 1953) bought The Atlantic from its original founders and refashioned it as a general editorial magazine.
The Atlantic’s Mission Statement
“The Atlantic will be the organ of no party or clique, but will honestly endeavor to be the exponent of… the American idea.”
The Audience
For print publications
Physical Specifications
- Number of pages, number of words per feature?
- Print/binding?
- Difference between old/new?
- Size of spread/page?
- Material of paper?
Content Specifications
- What are the repeated elements? (glossary, contact, publishing, copy right details etc.)
- Average number of features per publication?
- Demographic of writers, creators — publishing process?
- Trends in topics?
Design/Layout Specifications
Along with the launch of the December 2019 issue, “How to Stop a Civil War,” The Atlantic’s new visual identity was released, led by Peter Mendelsund.
View full interview with Peter Mendelsund regarding the redesign.
Using History to Design
Mendelsund: “ interesting thing to me about the first cover in 1857 is how clear the hierarchy of information is. The forthrightness, the omitting of needless information, the seriousness of purpose and mission — I would say those are all components of the design that represent what The Atlantic, as an institution, does well.”
Digging Through the Archives
Mendelsund: [maximalism or accretion?] “It’s both. You have these ornaments and rule sizes and type conventions that aren’t serving a function anymore, but sort of stick around. And before you know it, the page is this kind of hodgepodge.”
Searching for a Logo
Mendelsund: “It seemed obvious to us that what we needed was an emblem — a logo. A “swoosh,” if you will. But what could that logo possibly be? At some point, we noticed that we had already been clicking on that very logo . . . although the A seems radical, it is in fact historically grounded. Like The Atlantic itself.”
Legibility and Urgency
Mendelsund: “Atlantic Condensed is the typeface that we commissioned based on the type forms that the founders chose for the first issue. . . It is an extremely legible, classical kind of typography, but also transmits a certain kind of vehemence and urgency that works nicely for our contemporary purposes.”
- Extremely legible
- Classical
- Vehemence and Urgency
Redefining the Layout
Mendelsund: “I come to this work at The Atlantic primarily as a reader. And the things that were interesting to me as a reader were those designs that could best suit the language on the page.”
- Design needed to be readerly
- Feel confident
- Pages that aren’t clamoring for your attention
How it is Accomplished
Mendelsund: “I really wanted to frame our images so that they weren’t full bleed — they didn’t go off the edge of the page. The idea of imagery in magazines for decades now has been that bigger is bolder. But I find that when a picture has a frame around it, it allows you to focus more on the thing itself.”
- Use of good grids: the page itself has a rigorous, a Euclidean logic to its composition.
- Ensuring type is interrupted as little as possible. And when it is interrupted by imagery, the imagery is contained within its own cordoned-off space.
Theory of Cover Design
Mendelsund: “I would say that a cover can accomplish, maximally, three things at once. As soon as you try to make more than three moves in any visual space, there’s a real diminishment of effect.”
- Push the fact that you are reading a particular magazine (branding aspect)
- Something vibrant and attention grabbing (that represents the cover story or the issue as a whole)
- Room for typography that will push other stories that will be added to that space
Consider: is the imagery or the typography doing the heavy lifting — all the elements should be in proper proportions.
Redesigning the Colophon
Mendelsund: “Who is Poseidon, and what has he to do with this whole endeavor?”
- The meaning of Poseidon in this context is not important.
- The engraving itself signified “old” — the medium was the message. The old Poseidon told the reader that The Atlantic had been around for a long time.
The Atlantic’s New Look
An insight to The Atlantic’s redesign process
Dissecting the September 2020 Issue:
September 6, 2020
–––––
Analyzing the Advertisements
What does the advertisement tell the reader about the company?
Old vs. New
The redesign and its impact
The old cover suffers from a lack of hierarchy with its cover stories, attention to the wrong information, lack of negative space between type and image. There is no balance between the image and the type.
The new cover introduces a cleaner composition that activates the negative space and allows the eye to effectively move through the space. The relationship between the image and the type is balanced, giving focus to the right element.
The Grid System:
September 7, 2020
–––––
I have selected a few key pages in the September 2020 issue of The Atlantic, and over-layed shapes to show its grid structure
Margins
Columns
Gutter
Spatial Zones
Markers
Planning for Presentation 1
Before the first iteration of the presentation, I wrote down some key points that we should cover/consider.
The driving content for our presentation is the redesign. Viewers will have a better understanding of why The Atlantic is formatted and branded in a way today when they learn about the purpose and the goal of the redesign process. Not only, but showing The Atlantic before and after the redesign is crucial in understanding the effectiveness of their new design principle. We will start with introduction, grid and layout, content and visual language; all connecting back to the redesign and showing cohesion between print and web.
Presentation Draft 1:
September 8, 2020
–––––
Below we have the first iteration of the presentation analyzing The Atlantic.
Class/Professor Critique:
Overall, the narrative and the visuals in the presentation was done well. The presentation was clear and engaging. Here are some important points:
- Some sort of visual at the end of the presentation that ties everything together
- Decreasing content and/or combining slides for a more cohesive narrative
- Think about how we are going balance covering broad strokes of their design or the nitty-gritty
- How does the audience play into the role of the redesign?
Final Presentation:
September 10, 2020
–––––
Before our final presentation, we worked hard to reduce our presentaion from 16 minutes to under 10 minutes. We had to edit, condense and reduce the narration of our slides.
Guest/Professor feedback
Carl:
- Good intro to the presentation
- Good flow overall, but missed some history between the migration from print to media
- Takeaway is a good summary to wrap things up
Rachel:
- More about how web grid have contrasts with each other and how modules have to be reformatted when you transition between web and print
- Highlights enlarged which is good
- When taking about the header/gutter, column, etc could be highlighted better — maybe through animations
- Very clean aesthetic overall
Vicki:
- Well scripted and practiced
- In typeface, it would’ve been interesting to see WHY they were used
- More info about custom design font would be good
Hannah:
- Really good at the end, tying it all together
- Simple and clean aesthetic
- San-serif contrasts with serifs which is good
- Narrative was clear and flow was good
Andrew:
- Grey was made darker, making it more legible
- Simplicity of red was nice, but the Atlantic uses red as well so it was confusing what we were drawing attention to vs. what was actually a design element of the Atlantic.
Reflection
Looking back, although this project was very technical and detail-oriented, there was a lot to learn. I believe that starting out by analyzing already existing publishers and how they use grid/layout to emphasize their brand identity is a great start before creating out own composition. It was very rewarding to study and discover the amount of detail that designers put into things that we as readers and consumers oftentimes overlook and take for granted. By studying and understanding the use of grids and layout, I can look at publications with a deeper appreciation that I have ever had before.
In the future, I would love to focus more of my attention not only on the technical aspect (grid/layout) but more on the psychological aspect of design and composition. Throughout the project, I had questions like: how is the magazine curated in a way that keeps the readers engaged? Is there a consideration of pacing, and placement of text-heavy articles near the front, and visual-heavy reads near the back? What method of composition evokes a certain mood? If so, why is that evoked? In all, it was a great project to start off the year.
