Harlem Renaissance 100 by Carlie

» Work @Teachers College Columbia University

» Role: Visual/Concept Designer & Front End Development

» Collaboration: TC Librarians, Develop Team

» 2020 March - April

» Collaborative Drawing App

» GitHub Code

» Gottesman Libraries Website

Classics of the Harlem Renaissance is a special digital book display in celebration of the 100th anniversary of the Harlem Renaissance. It seeks to help audiences understand not only African American history and culture, but the Harlem Renaissance as a significant step towards the American ideal of freedom and opportunity.

The design is to provide innovative solution to promote the curated Gottesman Libraries Book Colletion and to create online education experience in a short time, when the scheduled onsite display and events were postponed in light of the COVID-19 outbreak.

I led the concept development, design and front-end/creative code development. The project includes web multimedia interactions, a collaborative drawing app, and email marketing campaign.

Main Tools

Concept Development

User Research

» Targeting Audience: Teachers College students, faculty, and alumni and broader community in education industry

» Big range of user generations: From Baby Boomer, who are still learning digital tools, to Gen Z, who are mostly digital natives

Identify Problems

» Users are used to get resources from the physical library space and usually only use online platforms for specific demands

» Many of them are overwhelmed by different online resources and platforms during the COVID-19 quarantine

Challenge and Goals

1. How to still deliever the book display as scheduled in limited time

2. How to promote the book collection in a way that users would like to spend more time and keep coming back

3. How to design an attractive experience that is also user-friendly to different generations

Platforms Study

Contraints:
» Gotteman Libraries has its own CMS. The page style, UI components and layout of any new webpage needed to comply with the existed structure.

» College needs to dealt with many unexpected changes in face of the COVID-19 crisis, which makes it slower to process new approaches.

Opportunities:
» Users stay on digital platforms more often and are more willing to accept new products during the special time

» People have stronger desire to connect with each other and to be seen than usual. The digital platform can provide more space for users to create, customize and collaborate with others.

Solution

WHAT IF
launching and promoting multiple approaches step by step

TO
gradually help users who are not familiar with technoloy to get comfortable with the interactions.
and keep them coming back to the book collection.

Step 1: Library Subpage - Music

Inspired by the topic, Harlem Renaissance, where jazz music is big part of the cultural movement, I decided to use music as the main concept and add sound effects as part of the interaction.

Jazz musical instruments become book stands, and when a book is "flipped", the corresponding instrument sound will be played. The design seeks to bring some fun and freedom to create music for users in the difficult time, while showing the topic from multiple dimensions.

Step 2: Microsite - A Collaborative Drawing App

Highlight one Harlem Renaissance artworks each day.

Users can draw together on a shared canvas, based on original art painting.

Further Promotion: Email Marketing Campaign

Promote the online display and product through newsletter.

Visual System from Harlem Renaissance

Color Study

Visual Style Study

Interaction and Responsive Design

While hover/mouseover is a more intuitive interaction on desktops, it is not very accessible on touchscreens. Thus, the "Flip" button is designed to deliever the same fun.

User Feedbacks and Outcome

In the Collaborative Drawing App, users can save and submit their drawings through "save"/"submit" button. At the same time, in order to collect further data and study the user behaviour and expereince, a feedback system is built which sends canvas info to AWS.

Images below are some of the submissions. (Users have agreed to share the info)

Creation based on The Migration Series: Panel 58, Jacob Lawrence, 1941.

Creation based on Textile Design for Cretonne, Loïs Mailou Jones, 1928.

Creation based on The Judgment Day, Aaron Douglas, 1939.

Final Links

The book display can be checked at Gottesman Libraries Book Display Page.

Come draw at Collaborative Drawing App.

Collaborative Drawing App got promoted in TC Come Together Email Campaign.

Online Book Display - Classics of the Harlem Renaissance

» Work @Teachers College Columbia University » Role: Visual/Concept Designer & Front End Development » Collaboration: TC Librarians, Develop Team » 2020 March - April » Collaborative Drawing App » GitHub Code » Gottesman Libraries Website