Skip to main content
Web ApplicationInProgress
2025
December 2025
ListenLine

ListenLine

ListenLine is a personal data visualisation project that transforms Spotify listening history into an interactive timeline, helping users explore patterns, routines, and moments in their music over time.

MusicData VisualisationPersonal AnalyticsSpotify
Next.jsSpotify APITypeScriptVercel
View Project
ListenLine - Image 1
ListenLine - Image 2

Overview

ListenLine is a personal exploration of music listening behaviour over time. Rather than treating Spotify history as raw data or rankings, the goal was to turn it into something more reflective — a timeline you can browse, search, and emotionally interpret.

The application visualises listening history as a continuous “listening line”, allowing users to explore tracks by date, time of day, artist, and listening context, with direct links back to Spotify.

It's designed to feel closer to browsing memories than analysing statistics.

Key Features

Interactive Timeline

  • Scrollable timeline view for chronological browsing
  • Vertical and calendar views for alternative ways of spotting patterns
  • Navigation designed to feel calm and exploratory rather than analytical

Filtering & Search

  • Filter by date range, time of day, and content type
  • Search across tracks and artists
  • Real-time feedback on filtered track counts and unique artists

Spotify Integration

  • Built on the Spotify Web API
  • Fetches listening history and track metadata
  • Each entry links directly back to the track on Spotify

Experimental Mood Layer (In Progress)

  • Tracks are currently prepared for mood-based tagging
  • This is an experimental feature and not yet fully implemented
  • The intention is to add emotional context without reducing music to rigid labels

Technical Architecture

ListenLine is built as a modern web application with a focus on clarity, performance, and simplicity.

Frontend

  • Next.js for routing, data fetching, and rendering
  • TypeScript for maintainability and safety
  • Component-based UI with a strong emphasis on layout and interaction

Backend & Data

  • Spotify Web API for listening history
  • Lightweight server-side logic via Next.js API routes
  • No heavy persistence — designed as a personal, privacy-conscious tool

Deployment

  • Deployed on Vercel
  • Continuous deployment from GitHub

Challenges & Learnings

One of the main challenges was balancing data density with calm UI. Music history quickly becomes overwhelming, so a lot of attention went into spacing, typography, and interaction patterns to keep the experience reflective rather than noisy.

Another challenge was supporting multiple views (timeline, vertical, calendar) over the same dataset without fragmenting the mental model — each view needed to feel like a different lens, not a different product.

Future Enhancements & Nice-to-Haves

ListenLine is intentionally open-ended, with several ideas planned or being explored:

AI-Driven Insights

  • Mood inference over time, using audio features and listening context
  • Detecting emotional "phases" or shifts rather than per-track labels
  • Natural language summaries such as:
    • "You tend to listen to calmer music late mornings"
    • "This period shows a strong reflective pattern"

Location & Context Awareness

  • Optional location mapping to show where music was listened to
  • Visualising listening history across cities, travel, or routines
  • Combining time + place to surface moments (e.g. commutes, trips, routines)

Listening Sessions & Moments

  • Grouping tracks into sessions based on time gaps
  • Naming or inferring moments such as “Morning focus”, “Late-night wind down”, or “Travel”
  • Highlighting repeated routines or streaks

Sharing & Reflection

  • Shareable snapshots of a day, week, or period
  • “On this day” style throwbacks
  • Exporting filtered views for personal archives

Results

ListenLine has become a tool I regularly use myself to reflect on listening habits — spotting routines, phases, and moments rather than chasing top-played stats.

More broadly, it serves as an example of how personal data can be presented in a way that feels human, thoughtful, and story-driven rather than purely analytical.