0000 · 0000
Skip to content
Dappasol / Work / Streets of Punk

Streets of Punk. One scroll, one film.

A sports videographer sells motion. His site was a page. So we built a page that plays.

1
Pinned canvas
The whole site renders through a single WebGL scene. No stacked sections.
60fps
Frame-rate target
The scroll is tuned to hold frame rate on real phones, not just a MacBook.
Weeks
Concept to live
Shipped in weeks, not a quarter. Film pipeline included.

The engagement. Design and build of a cinematic portfolio site for sports videographer and community builder Jatin "Juice" Kumar. Everything custom: the film pipeline, the type, the grade, the audio. Live at dappasol.com/streetsofpunk.

ClientJatin "Juice" Kumar
SectorSports videography
TypeCinematic scroll-film site
StatusLive

dappasol.com/streetsofpunk · actual scroll capture, not a mockup

The storyCASE 01
(01) The problem

His films moved. His site didn't.

Clients hire Juice for how his films feel: fast, raw, close to the game. A portfolio grid of thumbnails flattens all of that into a wall of rectangles. Every template he could buy looked like every other videographer's template, and none of them carried the one thing he actually sells.

The brief reduced to a single line: the site has to feel like the work.

(02) What we built

One canvas. The page is the film.

Instead of stacked sections, the whole site is a single pinned WebGL canvas. As you scroll, it scrubs through frame sequences of his 3D world that cross-dissolve into each other, graded by a post-process shader so every frame sits in the same palette. Type animates in word by word. There's a cold open. The frames are a rendered storyboard sequence with Jatin drawn into it, so the 3D and the camera moves read as one edit.

Mobile got treated as a performance problem, not a layout problem: smaller frame budgets, tuned sequence sizes, and a scroll that stays smooth on a mid-range phone.

(03) The outcome

A portfolio that works like a showreel.

The site reads as one continuous film from cold open to contact. One canvas, a 60fps scroll target, shipped in weeks. Those are the claims we can measure, so those are the claims we make.

The rest you can judge yourself: it's live, and it looks like nothing else in his feed.

StackTOOLS
Streets of Punk · buildRole
Three.js / WebGLSingle pinned scene, frame-sequence scrubRender
GSAP ScrollTriggerScroll drives the film timelineMotion
Frame-sequence pipelineffmpeg extraction, per-device budgetsFilm
Post-process grade shaderOne palette across 3D and real footageGrade
Vite + static hostingFast loads, no server to babysitShip

How this applies to you

If your work is visual and your website is a template, the gap between the two is costing you jobs. A cinematic build is not decoration: it is the proof, playing, before you ever get on a call.

This is our Cinematic / 3D Flagship lane, from $3,000. Start with the Week-1 Build Audit at $500 flat, credited against the build. Every blocker found or it is free.

Next case
Nugget Nation

Your project next

Let's ship yours.

Same senior team, your project next. Tell us what it has to do and a fixed price comes back, usually within a business day. An Overnight Site is $399 and goes live in a day. A flagship build starts at $3,000.