NEW YORK PUBLIC LIBRARY

Biblion: Frankenstein

 

PROJECT TYPE: New Product

PLATFORMS: iPad app, Website

SECTOR: Education

SKILLS USED: ux/ui design, information architecture, content strategy, product strategy, user research

THE PROJECT

Biblion: Frankenstein, the follow-up to NYPL's Biblion: World's Fair, is an iPad app and website, created to give users an immersive experience into Mary Shelley’s masterpiece, Frankenstein, as well to explore the life and times of the Shelley family. The app features photographs, prints, source documents, and maps from the NYPL collection as well as Oxford University’s Bodleian Library. The app won a Parents Choice Award, a Communications Arts Interactive Award, and was named by Apple as one of top education apps of 2012.

MY ROLE

I served as the product lead, working closely with internal stakeholders and the development firm to create a unique user interface and new features. I was responsible for planning content strategy, leading user research (survey design, focus groups, observation testing), creating user flows, and researching and developing technical specifications, particularly in relation to the several API's for the new social features in this edition.


MATCHING THE CONTENT TO FORM FACTOR

Initially, we planned to use the same information architecture as the first Biblion to reduce the development time. As we dug into the content for Frankenstein, it quickly became apparent that this wasn’t the right approach. While Biblion: World’s Fair featured many captivating photographs, this release was much more focused around source materials, most notably Shelley’s handwritten manuscript of Frankenstein. Below are studies comparing the content between the first and second edition.

 

INFORMATION ARCHITECTURE

After thorough content review in this edition of Biblion, we decided to re-architect the application to best use the form factor of the iPad, utilizing portrait mode for story content and landscape to view the source documents.

I created a new hierarchy to allow the user to quickly access the different content and sections of the app.

biblion1-design-for-2.png

I streamlined the entry flow to allow the user quicker access to content than the first Biblion.


CREATING THE INTRODUCTION ANIMATION

First impressions matter. I worked closely with the animation team to create an introduction to the app which provided an immersive user experience. 

Below is 3D study we did. Click on any picture to view it larger.

Here is the final animation sequence:


SOCIAL READING

From the survey and user interviews I conducted, we created new features to allow the user to engage and interact with the community of Biblion users as well as other library services. 

 

THE FINAL PRODUCT


VERGE'S REVIEW