Spotify-Inspired Audio Player

‍

Type: Side Project

‍Stack: React, TypeScript, Vite, Tailwind CSS

‍

Overview:
A modern audio streaming interface inspired by Spotify’s core playback experience. Built as a take-home project to demonstrate frontend engineering skill, product intuition, and interaction design — without recreating Spotify feature-for-feature.

‍

My Role:
Sole developer responsible for the entire UI architecture, media playback handling, and custom interaction patterns. Designed and implemented the player from the ground up with a focus on UX smoothness and developer experience.

‍

Key Features:

• Full-featured audio player with play, pause, next/previous, shuffle, repeat, and volume control
• Progress bar with real-time syncing and click-to-seek
• Playlist support with dynamic rendering of track data
• Keyboard shortcuts for all major actions, improving accessibility and power-user flow
• Responsive UI optimized for desktop and mobile devices
• Built with React + TypeScript and powered by Vite for fast build performance

‍

UX Focus:Carefully designed the player to replicate the feel of a native desktop app. Prioritized smooth interactions, subtle hover states, and a layout inspired by Spotify’s design system. The result is a polished media interface that feels snappy, intuitive, and visually balanced.

‍

Outcome:
This project showcases my ability to architect a complex interactive UI, manage multimedia state, and deliver a design-aligned frontend experience from scratch — all within a scoped build.

‍

Links:
🔗 GitHub Repo • 🚀 Live Demo