konshu.xyz | Interactive WebGL & Audio Art Sandbox

Overview / संक्षिप्त विवरण

konshu.xyz is a dedicated experimental space for high-fidelity 3D graphics, generative art, and interactive soundscapes. Built directly inside the browser using cutting-edge APIs, it shows how modern web browsers can execute complex simulations on the GPU while maintaining fluid framerates.

konshu.xyz एक कलात्मक और तकनीकी सैंडबॉक्स है जहां 3D ग्राफिक्स, जेनरेटिव आर्ट, और ऑडियो-रिएक्टिव विजुअल्स का मेल होता है। यह दर्शाता है कि आधुनिक ब्राउज़र कैसे शक्तिशाली ग्राफिक्स और कण सिमुलेशन चला सकते हैं।

What it Does / इससे क्या-क्या होता है?

GPU Particle Simulation

Simulates thousands of floating particles in real-time, responding dynamically to mouse coordinates.

माउस के हिलने-डुलने के साथ ही हजारों 3D कणों का लाइव रिस्पॉन्स मिलता है।

Audio Reactive Visuals

Extracts raw decibel and frequency data from your microphone to mutate particle velocities and sizes.

माइक्रोफ़ोन की आवाज़ पर सिमुलेशन की स्पीड, आकार और रंगों को बदलते हुए विज़ुअल्स दिखाता है।

Dynamic Gravity Panel

Provides sliders to change friction, wind, gravity coefficients, and visual shaders on the fly.

स्लाइडर्स के ज़रिए ग्रेविटी, हवा, और फ्रिक्शन जैसे नियमों को एडजस्ट करने का विकल्प।

How to Use / इसे कैसे इस्तेमाल करें?

1

Launch & Enter Sandbox Click on "Visit Live Site" above to launch the application. Wait a moment for the canvas to load. ऊपर "Visit Live Site" पर क्लिक करें। लोडिंग समाप्त होने का इंतज़ार करें।

2

Interact with Canvas Drag, click, and swipe your mouse cursor across the screen. You'll see the particle swarm gravitate toward your cursor location. स्क्रीन पर माउस घुमाएँ या ड्रैग करें; सभी तैरते हुए 3D कण माउस की ओर खींचे चले आएँगे।

3

Activate Audio Sync Mode Click the "Mic Sync" button on the floating console and click "Allow Microphone". Play your favorite track or talk to see the audio wavelengths pulse live. कंट्रोल पैनल में "Mic Sync" दबाकर माइक्रोफ़ोन चालू करें और आवाज़ या गाने के ताल पर सिमुलेशन देखें।

4

Adjust Physics Constants Open the control drawer on the right side. Modify speed variables, friction multipliers, and rendering modes to create customized abstract scenes. दाहिनी ओर दिए गए स्लाइडर मेनू को खोलकर स्पीड, रिफ्रैक्शन और विज़ुअल इफ़ेक्ट को मनचाहा आकार दें।

Tech Stack / प्रयुक्त तकनीक

WebGL / Canvas2D Web Audio API Three.js Vanilla JavaScript ES6+ Custom CSS Custom Variables TailwindCSS Express.js Host

konshu.xyz Interactive 3D & Audio Art

Overview / संक्षिप्त विवरण

What it Does / इससे क्या-क्या होता है?

How to Use / इसे कैसे इस्तेमाल करें?

Tech Stack / प्रयुक्त तकनीक

konshu.xyz
Interactive 3D & Audio Art