A COLLABORATIVE INTERACTION DESIGN PROJECT

Black
Imagination

96 conversations become a constellation of time, language, memory, and image.

Animated overview of the Black Imagination oral history archive
ENTER THE ARCHIVE ↓
01 / ORIGIN

How can oral history become easier to see, explore, and remember?

The project began with a class visit to the Institute of Black Imagination and conversations with its founders. Their emphasis on oral history led to the Institute's podcast archive, a rich collection of voices that was difficult to understand as a whole through a conventional episode list.

TEAM
Angel Wang and Roy Zhang
SCOPE
Research, creative direction, data visualization, interaction design, and prototyping
FORMAT
Interactive podcast timeline and audio-visual archive
02 / BUILDING THE DATASET

Structuring the
podcast archive

AI-assisted extraction organized the existing podcast episodes and transcripts into a workable dataset. Episode length, labels, and transcript content could then be compared and visualized.

Podcast episodes organized into a structured digital archive
THE PODCAST COLLECTION ORGANIZED FOR RESEARCH
96 podcast episodes visualized as bars based on duration
EPISODE LENGTH TRANSLATED INTO VISUAL DATA
03 / DURATION VISUALIZATION

96 voices.
One visual rhythm.

Each episode became a vertical bar whose height represents its length, allowing the scale and rhythm of the oral-history collection to be understood at a glance.

04 / EPISODE CONTEXT

Move closer.
Find a story.

Hovering reveals the title, duration, and a 100-word transcript summary, giving every voice context without losing the overview of the archive.

● HOVER TO REVEAL
Hover interaction revealing an episode title, duration, and summary
05 / KEYWORD DISCOVERY

HEAR → SEARCH → SEE

A vibe-coded interface connected transcript language to visual research. Visitors can enter a keyword and discover images, stories, and historical context related to the subject being discussed.

Transcript keywords changing the related visual results
01 · SEARCH THE TRANSCRIPT BY KEYWORD
Exploring related archival images and contextual information
02 · EXPLORE RELATED IMAGES AND STORIES
06 / AUDIO-VISUAL COLLAGE

Listen and see
at the same time.

The transcript-driven images move with the audio, turning oral history into an audio-visual experience. Visitors can zoom, change image density, organize materials alphabetically, and reshape the collage.

Audio accompanied by a transcript-driven visual collage
AUDIO AND VISUAL MATERIAL PLAY TOGETHER
Visual collage arranged into a donut form
SHAPE AND DENSITY CAN BE ADJUSTED
Archival images organized into an interactive collage
VISUAL MATERIALS CAN BE REORGANIZED
07 / OUTCOME

Oral history becomes more memorable when listening is paired with visual discovery.

The final concept transforms a difficult-to-scan podcast archive into a layered experience that can be understood through duration, explored through language, and remembered through image.

AW
RZ
COLLABORATION & CONTRIBUTION

Co-created by Angel Wang and Roy Zhang.

The collaborative scope included institutional research, conversations with the founders, podcast extraction, transcript analysis, data visualization, creative direction, interaction design, image research, digital collage, and vibe-coded prototyping.