From aedb666cbf969cd56442424af63a4163393fc430 Mon Sep 17 00:00:00 2001 From: Yuval Adam <_@yuv.al> Date: Thu, 27 Feb 2025 14:41:11 +0100 Subject: soundscape is crazy good --- README.md | 2 + index.html | 9 + soundscape/index.html | 275 +++++++++++++++++++++++++ soundscape/soundscape.js | 515 +++++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 801 insertions(+) create mode 100644 soundscape/index.html create mode 100644 soundscape/soundscape.js diff --git a/README.md b/README.md index 2d2f218..41d502e 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,7 @@ A collection of cute & creative web experiments and visual experiences. - [Digital Zen Garden](/zengarden/) - A meditative drag-and-drop experience where users can arrange elements with subtle animations. - [BTC Ticker](/btctick/) - Live Bitcoin price visualization with a cool animated chart showing price history. - [Interactive Particle System](/particles/) - A full-screen interactive particle system where particles respond to cursor movement, clicks, and device tilt. +- [Ambient Soundscape Generator](/soundscape/) - Create beautiful, generative ambient soundscapes with customizable musical scales and parameters that play continuously in the background. ## 🚀 Local Development @@ -23,6 +24,7 @@ To view the experiments locally: - Digital Zen Garden: `zengarden/index.html` - BTC Ticker: `btctick/index.html` - Interactive Particle System: `particles/index.html` + - Ambient Soundscape Generator: `soundscape/index.html` ## 💻 Technologies diff --git a/index.html b/index.html index ebfbc82..440b5b7 100644 --- a/index.html +++ b/index.html @@ -33,6 +33,7 @@ .container { max-width: 800px; padding: 2rem; + margin: 2rem; background-color: rgba(255, 255, 255, 0.85); border-radius: 20px; box-shadow: 0 10px 25px rgba(90, 61, 92, 0.2); @@ -148,6 +149,14 @@ device tilt. + + +
Ambient Soundscape Generator
+
+ Create beautiful, generative ambient soundscapes with customizable musical scales, modality, and + parameters that play continuously in the background. +
+