filahf / r3f-spotify-game

A music game built with react-three-fiber and the Spotify API

next-audio-game

Demo video »

This game was made with the ambition of getting more familiar with 3D content on the web. The game itself draws inspiration from the classic game AudioSurf.

A Spotify Premium subscription is required to play the game.

Technologies

• Next.js 12
• NextAuth.js
• react-three-fiber
• glsl shaders
• Spotify API
• Chakra UI

Getting Started

1. Clone the project
2. Create a .env.local file in the root of the project. Instructions can be found in .env.example
3. Install dependencies by running yarn
4. Start the game by running yarn dev

Screenshot

Controls

Change lane with A,S,D or ⬅️ ⬇️ ➡️

Contributing

Contributions are more than welcome!

Attributions

This project was bootstrapped with create-r3f-app

Road shader by Daniel Velasquez via tympanus

Space Craft Speeder by Kenney CC0 via Poly Pizza