- Content distribution — to what extent should the booklet be modified to fit the mobile experience?
- What qualities of my booklet are appropriate for an interactive experience?
Because I had little experience designing for an interactive experience, these questions were hard to answer at first. I was, however, excited to include recurring elements such as color, artifacts, and (grid) lines.
To gain more clarity on how I would incorporate these visions into my mobile experience, I went through many attempts to plan out a user flow via site maps.
After a few attempts to abbreviate Aicher’s work into a few sections, I decided to stay with the “life journey” approach I did with my booklet.
Everything in between
To give a sense of cohesion with my booklet, I decided to keep the home screen monochromatic, with the emphasis on the grid lines that are fundamental to Aicher’s design philosophy.
To offset the plainness of the monochrome, I leveraged color for the navigation bar. The rectangle forms are inspired by the folios in my booklet! After experimenting with some strictly horizontal/vertical treatments of the rectangular form, I decided to play with angles to offset the rigidity of the grid background.
I intend to animate the nav bar so it looks like the rectangles file out like cards — this would be a nod to the tactility of the artifacts that make up a lot of Aicher’s work in the mid to late 20th century.
The rest of my mobile experience was a guided walkthrough of Aicher’s life journey.
Some elements I carried through from my booklet:
- limited but distinct color scheme per section
- playing with fill vs. line
- playing with dark vs. light
- typefaces (Univers Condensed + Rotis Semi Sans)
- educational/informational approach
Final Mobile Experience
For final submission, I added more interactive elements such as the ability for users to flip through 1972 Olympics artifacts and see pictograms in motion. I also cleaned up the transitions and tweaked compositions in all screens.