Spandana Puppala Official Portfolio

01 the brief

Spandana is an interior designer and a Carnatic singer. Her studio's website sells the business; this one had to show the person, and let visitors feel her music instead of only reading about it.

02 what i built

Behind the page sits a Chladni plate: 65,536 grains of sand simulated on the GPU, settling into the same patterns real sand forms on a vibrating plate. The eight chapters are the eight notes of the octave, Sa to upper Sa, so scrolling retunes the plate and each chapter arrives with its own note. Visitors choose whether to enter with sound, watch the sand spell her name, and then the plate is struck and the page begins. All the music is synthesised in the browser by a Carnatic music engine written for the site.

03 key features

• 0165,536 grains of sand simulated on the GPU with WebGL2, forming real Chladni patterns
• 02Eight chapters tuned to the octave: scrolling retunes the plate and plays each chapter's note
• 03An opening that asks for sound, then lets the sand spell her name before the plate is struck
• 04A Carnatic music engine built for the site: nine ragas, eight talas, gamakas and pure shruti tuning over a tambura drone
• 05Six instruments synthesised in Web Audio: veena, venu, violin, mandolin, nadaswaram and guitar
• 06Sympathetic resonance: hovering a link gathers the sand into a ring and sounds a soft harmonic
• 07Press and hold to bow the plate; the cursor scatters the sand like a fingertip
• 08A string in the margin that plucks with every chapter, shows the note, its frequency and the plate's mode, and jumps between chapters
• 09A 404 that plays a lost scale of wrong notes over restless sand
• 10Adapts to every device: it lowers resolution, grains and frame rate on slower GPUs, and a reading veil keeps the text legible