Namrata Kannan

User Experience & Design

NStructure: iPad Magazine

This was our final assignment for the class Interaction Design Fundamentals at Carnegie Mellon.

  • Role: Interaction and Concept Design
  • Class: Interaction Design Fundamentals at Carnegie Mellon
  • Team Members: Ying Wang and Alan Chatham
  • Year: 2012

Nstructure iPad Magazine
NStructure: iPad Magazine

Design Opportunity: Architecture magazine for high-school teenagers

We were asked to create a hi-fidelity prototype of an iPad magazine and had to choose between three topics for articles namely Architecture, Cooking and Birds. N-Structure is an iPad e-magazine aimed at high school teenagers interested in architecture and design.

Design Process: Making architecture edgy, colorful and fun

We analyzed existing architecture and teenage magazines to understand our market. The difference was stark; Architectural magazines tend to be minimal and austere while teenage magazines are loud and colorful. Most architectural magazines cater either to architects or are more along the lines of a home improvement magazine. Teenage magazines are based around current trends and gossip and are designed for the fickle and frivolous teen crowds. We wanted to create a magazine which helped teenagers familiarize / keep themselves updated with the field of architecture without talking down to them.

Competitive Analysis of Architecture Magazines Competitive Analysis of Teen Magazines
Moodboard

We created a moodboard to capture the essence of what we wanted our magazine to be. We wanted our magazine to be edgy,colorful and fun and images which exemplified these words were used to form a collage. This moodboard gave direction to our design language.

Moodboard
Moodboard
Personas

We came up with three personas to help us understand the goals,desires and limitations of our potential customers. It also helped us empathize with our target audience.

Personas
Personas
Design Language and Typography

We chose bright colors and a geometric sans serif font. We chose Futura Medium for headings and Futura Oblique for regular text.

Design Solution: NStructure

N-Structure is an iPad Magazine which seeks to make architecture more fun and approachable to a teenage crowd. The articles are classified keeping our personas in mind; Inspiration for readers looking for design insights,Elevation for aspiring teenage architects and Recreation consisting of trends and fun architectural information for the general audience.

Table of Content Article Preview Content pages Photo preview
Navigation and Layout

The magazine's main navigation is the table of content which rests at the bottom of the page. It can be pulled up to allow the user to navigate to a different series of articles and user can touch to scroll through articles in each section. It was designed to produce the effect of rising buildings. The preview allows the users to navigate through the content page-wise akin to a paper magazine. The user can preview pages by pinching inwards on the iPad. We also explored interactions such as clicking on the images to share on various social networks. The article pages have pull quotes and huge pictures to break the volume of text.

The final project documentation can be accessed here. I also created a click-through prototype .