Interactive Film / Experimental Web / Marathi

This is not a story.
It is a call.

तात्या विंचू is a scroll-driven cinematic descent into a rain-soaked Konkan wada — eight film clips scrubbed frame-by-frame by the scroll wheel, a GPU-shaded room whose dust parts around your cursor, a sound bed built half from stems and half from oscillators, and a Marathi script that never once asks you to read English to follow it.

RoleConcept, Direction, Interaction Design & Front-End
Timeline2026
CategoryInteractive Film / Narrative Web
TypeNext.js · Three.js (GLSL) · GSAP ScrollTrigger · Lenis
Enter the wada Read the case study
तात्या विंचू — the wada at night, lanterns burning through monsoon rain
8
Scrubbed Film Clips
10
Narrative Chapters
0
Play Buttons
100%
Film Readable as Text
The problem
Scroll-driven web films are usually decoration wrapped around a marketing page. The scroll bar is a progress bar, the visitor is a spectator, and regional-language work gets flattened into subtitled English.
The approach
Make the scroll the projector, not the timeline. Give the room a WebGL layer that reacts to the cursor so the viewer is inside the frame, and write the whole piece in Marathi first with romanisation and gloss carried alongside, never underneath.
The outcome
A ten-chapter descent that ends by asking the viewer a question in Marathi — हो or नाही — and a build that stays legible with motion off, sound off, and JavaScript-driven visuals stripped away.
मर
Marathi-first, lang="mr"
~150MB
Film, streamed by byte-range
2
Viewer switches: sound, motion
०–९
Devanagari numerals throughout

01 — The Premise

Horror on the web is told.
This one is entered.

Tatya Vinchu is a figure every Marathi household knows — the sorcerer who wants a body that is not his. The temptation with a character that famous is to retell the plot. I did the opposite: no plot, no exposition, no narrator. The piece is built as an invitation with a door at the end of it, and the only thing the viewer is asked to do is keep going deeper.

That framing set three hard constraints. The interface had to disappear — a play button would break the spell instantly. The language had to be Marathi, not Marathi-flavoured English, because the dread lives in the cadence of the lines. And the whole thing had to survive a viewer who cannot or will not accept motion and sound, because a horror piece that punishes those people is just a broken page.

01
The scroll bar kills tension
A visible timeline tells the viewer exactly how much fear is left. The chrome had to go — no controls, no seek bar, no duration.
02
Autoplay policy vs. atmosphere
Sound carries most of the fear, and every modern browser blocks it until the viewer acts. The gate had to feel like part of the ritual, not a cookie banner.
03
A 150 MB film on Indian mobile data
Eight clips of scrubbed video is a lot to ask of a phone on a train. First paint could not wait on a single byte of MP4.
04
Regional language as an afterthought
Devanagari work on the web is usually a font swap over a Latin layout. Numerals, line height and the reading rhythm all had to be set in Marathi terms.

02 — The Sequence

Ten chapters.
One continuous descent.

The film is cut into ten chapters, eight of which carry a clip. There is no scene selection and no way to skip — the viewer's scroll position is the playhead, so the only way forward is inward. Chapter numbers are set in Devanagari (००–०७), which is the first quiet signal that this page is not translated from anywhere.

Click any frame to open it full-size.

Chapter 01 — the wada seen across a flooded path in the rain
०१ · वाडा

Wada Arrival

The house first appears at distance, through monsoon rain. Lanterns are already lit — someone was awake.

Chapter 02 — the wada's carved wooden entrance, lantern-lit
०२ · प्रवेश

Entering the Wada

The camera reaches the steps and stops. The line on screen is a dare, not narration: do you have the courage?

Chapter 03 — a long dark corridor lined with lanterns
०३ · लांब मार्ग

Deep Corridor

Perspective narrows and the mist layer thickens. Sounds are not heard here — they are only felt.

Chapter 04 — deeper into the corridor, light falling away
०४ · अजून आत

Further In

A deliberate second corridor beat. The repetition is the point: the wada is longer than it should be.

Chapter 05 — a figure standing at the far end of the corridor
०५ · तात्या

The Reveal

He is standing there, and has been for a while. One word on screen: तो — him.

Chapter 06 — the figure's eyes open, corridor lights blooming
०६ · नजर

He Sees You

The only chapter with no text at all. The eye-open frame fires a one-shot particle burst and an audio sting together.

Chapter 07 — extreme close-up on the face
०७ · नजर

Close-up

The frame closes to the face and the address flips to second person: are you looking at me?

Chapter 08 — the dialogue chapter, the mantra on screen
०८ · संवाद

Dialogue

The mantra lands one clause at a time, then the piece stops and hands the viewer a choice.

The script, as the viewer meets it

Every line is written in Marathi and carried with a romanisation and an English gloss on the same row — never as a subtitle underneath, which would have made one language the original and the other the translation.

००ही गोष्ट नाही... ही एक हाक आहे.Hi gosht nahi, hi ek haak aahe — This is not a story. This is a call.
०१रात्र काळी होती... पण त्या वाड्यात कोणी तरी जागं होतं.Ratra kali hoti, pan tya wadyat koni tari jaga hota — The night was black. But inside that wada, someone was awake.
०२आत जाण्याची हिम्मत आहे?Aat janyachi himmat aahe? — Do you have the courage to step inside?
०३काही आवाज ऐकू येत नाहीत. फक्त जाणवतात.Kahi awaaj aiku yet nahit, fakt janavtat — Some sounds are not heard. They are only felt.
०७तू... मला पाहतोयस?Tu, mala pahtoyas? — You. Are you looking at me?
०८माझा आत्मा तुझ्यात... तुझा आत्मा बाहेर... ॐ फट् स्वाहा!Majha aatma tujhyat, tujha aatma baher, om phat swaha — My soul into you. Your soul out. The invocation.
अंतकथा संपली नाही... तू फक्त आत आला आहेस.Katha sampli nahi, tu fakt aat aala aahes — The story has not ended. You have only come inside.

The ending is a question

Rather than a credits roll, the last chapter puts a single Marathi question in front of the viewer and waits. It is the one moment where the piece stops performing and the viewer has to answer.

हो
Ho — yes
Completes the invocation. The mantra finishes, the burst fires, and the piece closes on the line that it never actually ended.
नाही
Nahi — no
Returns the viewer to the beginning. Refusal is not a failure state and not a dead end — it is simply the wada keeping you.

03 — Craft Decisions

Three decisions
the whole piece rests on.

Each of these could have gone the conventional way. Each conventional choice would have produced a nice-looking web film that nobody stays inside.

Decision 01
The scroll is the projector
Conventional
Autoplay a video and pin it while the page scrolls past — the film runs on its own clock and scroll only reveals captions.
Approach
Lenis smooths the wheel input, GSAP ScrollTrigger maps each chapter's progress onto that clip's currentTime, so scroll position drives the frame directly.
Output
Scroll faster and the corridor rushes; stop and the frame holds on a face that is already looking at you.
Pacing becomes the viewer's responsibility. People slow down at exactly the moments they are afraid of, which is a kind of tension no fixed edit can produce.
Decision 02
The room notices you
Conventional
Overlay a looping particle GIF or a CSS fog animation on top of the video and call it atmosphere.
Approach
A Three.js layer sits over the film: instanced dust motes carrying per-particle aScale and aSpeed, a three-octave value-noise mist, and a lightning flash addressed by colour and origin.
Output
Motes near the cursor drift out of its way. The viewer's pointer is a physical presence in the room before they consciously notice it.
The scare in the reveal chapter works because the space has been quietly acknowledging the viewer for four chapters beforehand.
Decision 03
Half the sound is synthesised
Conventional
Ship one long ambience track and cross-fade a few one-shots on top of it.
Approach
Two recorded stems — a room drone and the eye-open sting — layered with a live Web Audio graph of oscillators through bandpass and lowpass filters, ducked and opened by scroll progress.
Output
The bed never repeats identically, and the filter sweep follows the viewer's own pace down the corridor rather than a fixed timeline.
A loop the ear can recognise stops being threatening after about ninety seconds. A signal that keeps shifting does not give the ear anything to settle on.

04 — Design System

Lantern on void.
Devanagari first.

The palette is taken straight out of the frames rather than chosen against them: a near-black void that matches the darkest pixel of the footage, warm lantern amber for anything the viewer can act on, ember red reserved for the character, and cold moonlight for depth. Amber never exceeds a few percent of any screen, so a single lit control reads as the only warm thing in the house.

Palette Tokens
Void#030304
Lantern#E8A33D
Ember#B4341C
Moonlight#4A6A8F
Wood#0F0E11
Typography
तात्या विंचू
Devanagari display face with the line height loosened for conjuncts — Marathi is never set on a Latin leading grid
०० ०१ ०२ ०३ ०४ ०५
Chapter numbers, progress and the loader percentage all use Devanagari numerals
Grain, Grade & Vignette
An SVG feTurbulence and feDisplacementMap pair drives a drifting film grain over a graded, vignetted stage — so eight separately rendered clips read as one roll of stock.
No Chrome, Ever
No play button, no seek bar, no duration, no chapter menu. The only two persistent controls are the sound and motion switches, both labelled in Marathi with an English gloss.
Typographic Entrances
Lines arrive per word on expo.out and power4.out curves rather than fading in as blocks, so text lands at the rhythm the line would be spoken at.

05 — Engineering the Weight

Around 150 MB of film,
and nothing waits on it.

Scroll-scrubbing is brutal on delivery. Every scroll tick is a seek, every seek is a range request, and a browser that cannot serve ranges refetches whole clips. Most of the engineering here is about making the film feel weightless on a connection that is anything but.

First paint
A 960×540 poster JPEG stands in for every clip, so the opening frame is on screen before a single byte of MP4 has been requested. Clips swap in behind the poster once they can play.
Seeking
Accept-Ranges: bytes is set explicitly at the server rather than left to default, because scrubbing seeks constantly and an over-eager optimisation plugin stripping it would silently double the transfer.
Caching
Media is served immutable for a year. Every media URL carries a ?v= stamp, so re-encoding a clip changes the URL and the long cache stays safe. HTML is must-revalidate so nobody is stuck on an old build.
Compression
Text is deflated; video and audio are explicitly excluded, because compressing them burns CPU for nothing and can break range requests outright.
Loading state
The wait is written into the fiction — a Devanagari percentage under rotating Marathi status lines (वाडा जागा होतोय… the wada is waking, दिवे लावले जात आहेत… the lamps are being lit) instead of a spinner.
Idle handling
Visibility changes pause the audio graph and the render loop, so a backgrounded tab does not sit there spinning the GPU and the drone does not follow the viewer into another tab.
Stack
Next.js static export · Three.js with hand-written GLSL · GSAP ScrollTrigger · Lenis smooth scroll · Web Audio · deployed as flat files behind Apache/LiteSpeed.

06 — Access & Consent

A horror piece
that never traps anyone.

Atmospheric work has a bad habit of treating accessibility as a downgrade — motion off means a blank page, sound off means half the piece is missing. Here the alternates were written at the same time as the film, not retrofitted after it.

01
The film exists as text
A screen-reader-only <article> carries the entire piece — every chapter as a heading, every line in Marathi with its romanisation and gloss in a nested lang="en" span. Read with no video at all, it still works as a short story.
02
Motion is a switch, not a guess
prefers-reduced-motion is honoured on load, and the viewer can still flip it either way mid-descent — गती कमी करा / पूर्ण गती. Reduced motion keeps the imagery and drops the parallax, drift and burst.
03
Sound is asked for, in character
Nothing plays until the viewer acts. The prompt — ध्वनी सुरू करा, with "headphones recommended" underneath — reads as the first instruction of the ritual rather than a browser-policy workaround, and stays reversible at all times.
04
State is announced, not implied
Both switches are real buttons with aria-pressed and Marathi-plus-English labels, and loading progress is published through a polite aria-live region so a non-sighted viewer knows the wada is still waking.

07 — Outcomes

Atmosphere is
an engineering budget.

The piece set out to prove that a regional-language narrative can hold the highest tier of web craft without translating itself into English first, and that a scroll-driven film can be genuinely inhabitable rather than decorative.

0
Player Controls
No play, seek, duration or chapter menu anywhere in the experience.
8
Clips Scrubbed by Scroll
Each mapped onto its own ScrollTrigger range and driven frame-accurately.
1:1
Film to Text Parity
Every visual chapter has a written counterpart in the screen-reader article.
<1s
To First Frame
Posters carry the opening image while the MP4 layer streams in behind them.

08 — Key Learnings

What This Project Taught Me

Learning 01
Removing controls is a performance decision
Deleting the play button meant the first frame had to be instant, because there is no longer any UI to hide a wait behind. The interface choice set the entire loading architecture.
Learning 02
Reactivity beats fidelity for dread
The moment testers reliably reacted to was not the reveal — it was noticing, several chapters earlier, that the dust was moving away from their cursor. Being acknowledged unsettles people more than being shown something.
Learning 03
Regional typography is layout, not fonts
Devanagari needed its own leading, its own numerals and its own line-breaking rhythm. Dropping a Marathi font into a Latin layout would have produced something that reads as a translation of a page that never existed.
Learning 04
Consent can be written in-world
The sound gate and the motion switch are the two most compliance-shaped moments in the piece, and both became narrative beats. Accessibility work sits inside the fiction far more comfortably than it is usually given credit for.

Reflection

"The whole piece turns on one line — ही गोष्ट नाही, ही एक हाक आहे. This is not a story, it is a call. Once I accepted that, every interface decision answered itself: a story has controls, a call does not. You either keep going down the corridor or you close the tab, and the only thing the page ever asks you is whether you are still there."
— Rupesh Chavan, Concept, Direction & Front-End

Explore Projects

See more case studies

Enter the Wada All Case Studies ANKA — UPI Super-App
तात्या विंचू — film frame