MIT Tech Review: Holding it All Together: Structure, System, Form
9/1/2020: Project Introduction
- Research and analyze the context of the publication/website
- Analyze and consider the typographic elements/systems used in the publication/website — why did the designer choose to do this?
- Final deliverable: 7 min presentation on assigned publication/website
My group, consisting of me, Caitlyn, Chris and Dorothy, worked together to grasp a better understanding of MIT Technology Review by researching and analyzing both the website and printed publications. In order to put together a ~7 minute presentation, we had to be highly selective in picking out what is most relevant to understanding the company.
To start, we learned about grid systems and its terms as a preface prior to truly delving deeper into the actual design of the print and website.
Glossary of Terms:
9/3/2020: Brainstorming
In class, we met with our groups to discuss and brainstorm a general plan for the presentation. In our meeting, we mostly discussed ways we could structure our presentation so that it flows well and displays our information in an appropriate and compelling manner. We also looked at what type of ‘format’ we wanted to storyboard our presentation, whether its through a ‘weaved’ or ‘half-half’ format that Vicki mentioned.
After deciding that Chris and Dorothy will be charge of the website while Caitlyn and I will focus on the print, we also decided on a ‘weaved’ manner/format, where we would talk about both print and web interchangeably throughout the presentation. We believed that this would be a better way of presenting our work as it won’t be as linear if we were focusing on only print first half and then web second half.
Initial Impressions:
Since none of us have ever followed or read MIT Tech Review, we thought it was also important to first take a look for initial observations of the publication.
- Clean yet stylized — website embraces the use of white space and minimal accent colors to highlight the content.
- Modern—because the theme of MIT Tech is designed to be very sleek/clean (as mentioned above), overall visual design comes off as very modern. This adds to how credible the publication is and looks.
- Bold — whether it’s in print or on the website, the strong visual imagery used alongside the articles help create emotionally stronger narratives.
- Content primarily focuses on technology and science, however, that doesn’t mean all their articles are only focused on informing you of current issues and breakthroughs. There are plenty of investigative and analytic stories under the various selection of topics on the website and printed issues.
- Audience—since the publication is geared toward science and technology related topics, I could imagine the it being mostly for scholars, university students/faculty, tech and science elites or anyone interested in said topics and current world events.
Looking at MIT Technology Review:
To start, the first thing we each did was research MIT Technology Review while keeping these core questions in mind:
- What is MIT Technology Review? What do they strive for?
- What is MIT Tech’s mission as a company and how does that reflect in its publication design?
- Who is the target audience and why?
The Research:
- According to their website, MIT Tech Review’s mission statement is:
“…to make technology a greater force for good by bringing about better-informed, more conscious technology decisions through authoritative, influential and trustworthy journalism.”
- First printed publication originated in 1899 and relaunched almost 100 years later. It was originally published by the MIT Alumni Association.
- Prior to the relaunch in 1998, in which they decided to completely change the magazine, the historical magazine had a more intellectual tone and smaller reach of audience.
- The print came before the website with its initial release in 1899, the website was later created in ~2005–2007.
- MIT Tech releases six bi-monthly print issues per year.
- With the major redesign in 2018, the website shifted its focus to publishing original daily news + analysis (used to only republish print magazine stories) while the printed issues focuses on presenting longer investigative stories + colorful imagery.
- Looking at their Media Kit, their audience consists of mostly male technology and business elites that have an average of $499k average household income. (http://mediakit.technologyreview.com/#new-page)
- With the primary audience that follow MIT Tech being “a discerning group of technology and business elite”, it becomes clear that MIT Tech does indeed value/strive to be“authoritative, influential, and trustworthy journalism”.
9/5–9/6/2020: Redesign + Grid Layout
With the 2018 redesign changing how both the print and web is structured, we also did some research on what exactly changed and whether it changed its content and mission statement.
Modern Magazine: 2018 Redesign
Working with the design studio Pentagram, MIT Technology Review launched its redesign to the world alongside with its 2018 July/August issue. As stated on both Pentagram and MIT Tech Review’s websites, the redesign aims to extend its previous design heritage and transform it.
- Only six printed issues are released per year, with dimensions of 8 x 10.875 inches.
- The emblematic use of Helvetica in the old design has now changed to Neue Haas Grotesk. It is primarily used in the nameplate+cover along with headlines and display.
- The typeface TR Mono is used in supplement of the new text face Independent.
- New emphasis on bold imagery, including graphics and photography that make data visualization a compelling form of narrative journalism.
Layout Analysis:
Grids:
MIT Technology Review primarily follow a 12 column grid throughout the entire magazine. This gives them more flexibility in how they want to format their various types of content.
Even though the first page of the article doesn’t follow the same rules as the second page (four columns), the first page still fits neatly into 12 columns. To see it in a more simplified view, the columns it follows can be split into 7, 2 and 3 columns.
As shown in the spreads above, the magazine varies different grid types for different content. For example, the spread above following a 3 column grid was most likely formatted this way because the article has a bit more text to organize than text in a four column grid. Moreover, it’s also mostly adapted for data and the balance between body copy and graphics make it more readable overall.
Elements Within the Layout:
9/7–9/8/2020: Presentation Draft
After researching and doing our own analysis of MIT Technology Review, we came together to put together a very general deck of our plan.
In this deck, we dumped all our research and findings in different slides that we later organized them into a very general outline of our presentation.
We then created a separate presentation document as our first draft and began building on it with our findings.
General Structure of Presentation (Draft 1):
Adjectives + History:
- Started with the three adjectives we thought fit MIT Tech best: Technical, Credible, and Modern.
- History of both printed issue and website: chronological order of release and redesigns.
Grids: for print
- Looking and talking about how MIT Tech utilizes a 12 column grid for both print and web.
- Showing the versatility of 12 columns through presenting numerous spread examples with respective grid formats.
- Grid analysis for pages that aren’t all text: advertisements and article covers (bold imagery/typography pages)
Typography:
- What kind of fonts they changed to after their redesign and what effect it has visually.
- Helvetica —> Neue Haas Grotesk, Independent, TR Mono
- The san serif font makes it clean, modern, and easily read.
- Also maintains a formal, technical feel.
Visuals: macro + micro view for print
- Working with Caitlyn on this one, we took note of what types of content is placed throughout the magazine.
- Included: Magazine Cover, Advertisement, Table of Contents/Masthead, Article Covers, Text
- Ads + Article Covers: looked at how they were placed in the magazine to serve the purpose as either a supplement to the following article or spacer to transition from one topic to another.
- Took out some spreads to look at how the bright and bold graphics draws attention to the content.
Conclusion:
- Tying what was presented in the presentation (Grid, Type, Color, Imagery) together with the function it serves in the design of MIT Tech Review.
Critique of Draft Presentation + Dry Run:
- Overall very straight to the point, however left wanting more even though presentation finished in almost exactly 7 min.
- Objective slide unclear: less text more visual, make consistent with what we’re saying.
- TAKE ADS OUT THEY’RE UNRELATED TO MIT TECH REVIEW
- Take out the color palettes and put in more examples of spreads
- If slide content is not priority, take it out and put in something more worth talking about. i.e. Grid Anomalies slide
- Zooming in on content of the spread as you talk about it will make it clear to what you’re talking about to the audience.
- Emphasize the adjectives, also MORE CONTENT AND ANALYSIS!!
- Bigger images = easier to view
- Background color is too light, hard to see edges of spreads
- How visuals are used throughout print and web (don’t just explain what, explain why too)
- Distinguishing which slides are print and which are web makes it more clear to the audience.
9/8–9/9/2020: Final Presentation
Some of the major changes we did for the final presentation included:
- Visual aesthetic of the presentation: darker background color to make spreads more clear, adjusted navigation bar.
- Changed objectives slide into a slide that explains how MIT Tech strives to connect their content to audience.
- Added more analysis to emphasize grid versatility, imagery and color. (Also took out advertisement slide).
- Took advantage of transition animations to clearly convey our analysis.
- Conclusion: tied the four major themes of the presentation (grid, type, color, imagery) with the three adjectives from the beginning (technical, credible, modern).
The final presentation was finally done! It was nice to see how we progressed from the initial draft and getting uplifting feedback from everyone.
Feedback on final presentation:
- Thought that the way presented with voice and visuals and animation was very clear
- Could see what parts of the magazine they were calling out to with their magazine, helps them follow
- Like the use of large images.
- Liked the timeline: clear between each year.
- Liked how we showed the grid and then explained the grid.
- Liked the visual: clearly original theme but inspired by MIT Tech
- The pacing was a bit off at the end and a bit fast overall.
- Enjoyed how one example was presented and then overlaying to see the overall purpose.
- First half of presentation was very strong.
Additional feedback from guest audience:
Reflection:
Overall, I thought that our final presentation worked out really well. I enjoyed and missed working with everyone again, even if it was all remotely done. In addition to that, I also enjoyed learning about the formal technicalities of grid systems and how could be applied to publications all over the world. Even though I’ve have a few experiences with laying out content for projects and extracurricular activities on InDesign, I realized that there is so much more you can do with grids. To be honest, I’ve never even stopped to think about how there could be a whole system of rules you can apply to make i.e. a publication like MIT Tech Review.
Besides the technical analysis of the spreads themselves, I also enjoyed doing research on a company like MIT Technology Review. Learning about what their company is all about and what type of audience reads their publications, made me think more about what they put out and how they bridge/translate that to their audiences. This will definitely help me be more aware of how other companies (and I) may design products to give/present a certain message to the world in the future.
