Please enable JS

Projection Mapping: Illuminated Stories

PROJECT DETAILS

CLASS:Adobe DPS at Pasadena Art Center

ROLE:CONCEPT, DESIGN, DEVELOPMENT

I have a strong interest in interactive storytelling and I'm always trying to learn new things, so I took a class on creating iPad publications with Adobe DPS.

THE FINISHED PRODUCT

Projection Mapping: Illuminated Stories from Marie Barr on Vimeo

Mini Interactive Magazine

The format was a mini interactive magazine that highlighted three projection mapping examples by some of the best artists working in the field. It begins with an introduction to the art of projection mapping and explains how it works.

Books to Buildings

I begin with a projection mapped story that is formatted as a pop-up book. Next, I move on to a performance that takes place in a room. Lastly, I showcase a project that encompasses the facade of an entire building.

THE CHALLENGE & THE JOURNEY

Sketching Screens & Flows

I sketched out the overall flow of the magazine to figure out what the directional swipes should be to make the content easy to follow while signifying start and end points. I also sketched out the general content layouts for each of the screens and refined them further once I started building them.

Sections & Titles

Since I decided I wanted to construct it in a way that demonstrated that this medium is the future of storytelling, I was constantly scribbling down storytelling conventions, along with lines from famous stories that would help reinforce this concept with the section titles.

Moving Into Screen Designs

You can see the basics I originally sketched out ended up being modified once I got into InDesign. I tried to keep in mind all the possible interactions that could be built to make the most of each screen.

Once Upon A Title

The storytelling conventions I had scribbled down were finally called into play for the page headlines.

Same Fonts, Different Graphics

For consistency, I kept the use of the same fonts on each page, but each section had its own look which reflected the particular piece I was showcasing.

Video

A paper magazine has static images, but with an interactive magazine, the images can be animated. Each page was brought to life with video backgrounds and animations to fully utilize the unique nature of this medium.

Illuminated Stories

I took inspiration from illuminated manuscripts for the title, contents, and credits pages. I used light animations in place of the traditional gold. I titled the publication "Illuminated Stories", as I felt it reflected what they really are - storytelling with light. Overlaying those elements on top of the modern images created a nice callback to the history of storytelling.

Illuminating Project

Learning to create this interactive magazine really helped push forward my thinking with interaction design, and gave me new ways to think about the display of information when constructing a story.