A Reinterpretation of "Didactics by Sonnenzimmer"

A Reinterpretation of "Didactics by Sonnenzimmer"

Description
A project created for Stephan Farrell's and Alan Rhodes' class "From Page to Screen" at the School of the Art Institute of Chicago, with permission by Sonnenzimmer A redesign of the 2014 book Didactics, translated for an interactive tablet experience. The goal was to explore the device's capabilities in order to translate a print experience into the mobile format, while still giving the center stage to the artists' work. Team Members: Ravee Deshpande, and Dani Reis.
Date
Timeframe: 1 month December 2017
Tags
Interaction Design
Table of Contents
Table of Contents
Warp and Weft: Posters
Warp and Weft: Posters
Poster View
Poster View
Guided Exercises
Guided Exercises
Completed Exercise Gallery
Completed Exercise Gallery
Extras page
Extras page

Preliminary information:

notion image
About the book:
Didactics by Sonnenzimmer is a collection of two former publications, Warp and Weft: Poster Construction (2012) and Formal Additive Programs (2010) combined anew. With this publication, Sonnenzimmer open a window into their creative process, revealing the thought and processes behind their work as an exercise in teaching.
About the authors:
Sonnenzimmer are a Chicago-based artist duo whose work is often a merging piece of typography and abstract illustration. Established in 2006 by Nick Butcher and Nadine Nakanishi, Sonnenzimmer has been creating wide-ranging projects including hand-crafted and digital posters, books and music packaging for a wide array of clients, as well as experimental music and sculptural work.  Their practice is rooted in idiosyncratic imagery and experimentation which is achieved through an improvisational approach.

Process

Persona
Persona
Proposed content structure
Proposed content structure

Visual Strategy

notion image
notion image
notion image
The app takes cues from early interface design:
  • All UI elements are presented in B&W, or in special cases red.
  • All shades are bitmap patterns;
  • The typeface is monospaced (except where a long-read option is available.
Sonnenzimmer's posters are very colorful, fluid, and dimensional; a stark contrast to the barebones interface in use.
Xerox Alto
Xerox Alto

Features

View mode: none
View mode: none
key
key
color
color
image
image
title
title
K+I
K+I
T+I+C
T+I+C
I+C
I+C
View mode: Key + Image + Color
View mode: Key + Image + Color

Gallery View

Viewing modes in the gallery work in order to encourage exploration.It makes the viewing experience more fun, allowing for the user to pick what kind of information will lead their discovery process.
  • If you want to pick a poster to focus on at random, you can de-select all options.
  • if you want to focus on the composition of the poster without knowing who was the client, you can toggle the key and image option
  • or even if you just want to see just the title, to be surprised by what the poster looks like, you can toggle the title option.
The gallery can also be arranged through year, editions and colors, accessed by the see by menu.

 
Main poster view
Main poster view

Poster view

connection with key activated
connection with key activated
The poster view creates a space for deep connection with the work at hand.
One of the limitations of the print edition of Didactics is that due to the medium it was published on, the nuances that can be seen on the individual posters are lost.
This issue is dealt through a full screen mode, in which a high-resolution copy of the poster can be zoomed and panned around. This allows for the user to see the artifacts created by the handmade nature of the process, and enables a deeper exchange with the creators.
Full screen mode; panning
Full screen mode; panning
project info
project info
 
Metadata Drawer
Metadata Drawer
This page also contains easily accessible information about the creation and rationale about the work at hand as well as its metadata (edition, size, etc).
It is through the poster view that one can access guided exercises.

Guided Exercises

Each poster on the Warp & Weft chapter of Didactics contains one related guided exercise created by Sonnenzimmer as a teaching tool.
They are lessons in creativity, encouraging the user to leave their state of passive consumption in order to become active producers. This form of guided creativity has a feeling akin to adult coloring book.
The exercises have custom animations, breaking the static of the poster, created with care to not bias the user so they can make their own interpretations to guide their decisions.
Users are encouraged to document their work, both as a way of keeping an archive of creativity and also as a way to unlock additional content.
basic exercise view
basic exercise view
Camera view
Camera view
Documented
Documented
Options
Options

Exercise Gallery

notion image
Allows for easy access to your completed exercises, creating an archive for your art.
Provides options for sharing and bookmarking.
As the user completes more exercises and becomes more familiar with the work, the page turns more colorful, more dynamic.
 
Before Completion
Before Completion
Individual Exercise
Individual Exercise
notion image
Individual Exercise

Extras Page

notion image
extras gallery
extras gallery
Displays supplemental content to the original publication, such as suggested readings, behind the scenes, collaborators, etc.
Page can be panned around to allow for more exploration. The navigation also allows for a more experimental approach to layout, allowing for a more personal, less regimented communication between the author and the audience