This is Not a Setlist

Medium: Microsite, Web Design Tools: Figma, Adobe After Effects, v0 Role: Designer, Developer
(React, Next.js, Typescript, Tailwind CSS)

Because I believe that there is always so much to explore in music, my conversation with Noah about the general topic of music inspired me to make my microsite an interactive map with areas that represent the different topics we talked about. This concept is all about intuitive discovery and drawing a greater connection between music and exploration/discovery.

Concept & Approach

Music discovery is inherently exploratory — people wander between genres, follow recommendations, and make unexpected connections. The design needed to mirror this organic experience.

Core Metaphor: A map where spatial navigation mirrors musical discovery

Conversation topics become explorable territories
Song references act as landmarks with timestamps
Progressive disclosure rewards curiosity

Information Architecture

Conversation Topics: Concerts, Taste, Emotion, Learning, Identity
Song References: 15+ songs mapped to specific timestamps in dialogue

Navigation Design

Typewriter-style menu reveal: Areas appear progressively as user explores
Breadcrumb memory: Visited areas added to side menu for easy return
Contextual guidance: Pop-ups suggest related areas to explore next

Typography & Visual Language

Courier New & Courier Prime: Evokes dialogue transcripts and conversational authenticity
Typewriter animation: Reinforces the sense of unfolding conversation
Gradient fills on hover: Suggest depth and hidden content to explore

[hover state is a gradual gradient fill which also reveal “song landmarks/markers” with a time stamp of when they were reference in the recording]

[Clicking on different areas triggers dialogue pop-ups of the part of the convo belonging to that topic - plus a guide to new area]

[new area in hover state, notice the last visited area was added to the side menu]

[pull quote]

prototype demo

(Close)