BR Adarsh Subham
AI Systems & Websites for Agencies and Brands That Scale.
Ondrel: Enterprise AI Site Rebuild (Motion & Interaction Study)
A hand-coded rebuild of a Framer-grade enterprise AI website. Scroll choreography, pinned storytelling and micro-interactions, reproduced in vanilla JS with no page builder, no WebGL and no stock footage.
What's inside:
- Hero video card that expands to full bleed on scroll while the headline splits apart, then settles back
- Scroll-linked headlines that fill in character by character
- Two pinned sequences: a 5-sector carousel and a 4-case showcase, with wipe transitions, live progress pills and a rotating backdrop
- An interactive dot sphere — 200+ particles morphing through four states in sync with the copy
- Capability wheel, vertical journal carousel and infinite logo marquees
- Menu overlay with staggered reveals, hide-on-scroll nav and an announcement banner
- Every video slot is a real-time procedural scene drawn in code (engine test fire, wind turbines, highway aerials, glass towers), so it loads fast and runs even without WebGL
- Fully responsive with a dedicated mobile layout for every section, plus reduced-motion support
Tech HTML · CSS · Vanilla JS · Canvas 2D · Lenis smooth scroll · Vercel
Live: https://ondrel.vercel.app
Got a Framer or Webflow site you've outgrown, or a motion-heavy landing page you want in real code? I build these end to end — message me.
4
2
317
OKTO® Studio — An Awwwards-Level Agency Site, Rebuilt From Scratch
One-line description
A dark, cinematic studio website where every scroll does something: a pinned 3D scene, a live WebGL backdrop, text that reveals word by word, and no stock imagery.
Project description
I wanted to answer one question: what does it take to rebuild an Awwwards Site of the Day without a site builder?
I took NIKI Studio's award-winning site as my benchmark. I took apart its structure, type scale and motion beat by beat, then rebuilt the whole experience in hand-written code for a fictional studio, OKTO.
The rule: match the feel, own everything else. New brand, new copy, and no borrowed images. Every visual on the page is generated in code.
What's inside
→ A 0–100 loader with a spinning 3D cube, followed by a staggered drop-in of the header
→ A WebGL backdrop of light raking across a rock ridge, with live film grain. It stays fixed while the next section slides over it like a curtain
→ A team marquee that speeds up as you scroll faster
→ Copy that lights up word by word as you read
→ A pinned 3D box whose lid lifts off as the work section rises through it
→ Collectible figure cards that fan out from a stack into a staircase
→ A pixel-brick mosaic footer with oversized type that tilts into place
→ Live studio clock, scrambling microcopy, custom cursor, slide-in menu
Under the hood
Plain HTML, CSS and JavaScript, with no framework and no build step. GSAP and ScrollTrigger drive the choreography, Lenis handles smooth scrolling, and a custom GLSL shader draws the hero. Every illustration is SVG or Canvas. The site is fully responsive from 390px up, respects reduced-motion settings, and shows a pre-rendered image in browsers without WebGL. It's deployed on Vercel.
The process
Before writing any code I wrote a full spec: measured spacing, the type scale, colour tokens, easing and spring values taken from the live site, and an acceptance checklist. Then I built against it and checked every section frame by frame against the reference, on desktop and mobile. I'd run a client build with the same spec-first discipline.
Why this matters for you
If your brand deserves more than a template — a launch site, a portfolio, a product page people actually remember — this is the level of craft I bring. Let's talk about yours.
🔗 Live: https://octo-studios.vercel.app
1
76
🚀 ORBIS.NFT — Space Collection Landing Page
Built a full NFT drop site that feels like stepping onto another planet.
→ Cinematic hero with 3D alien-world visuals & bold editorial type
→ Character intro section — meet Orbis, your space mascot
→ NFT gallery with rarity scores & collection grid
→ Dual-font system: italic script meets heavy condensed caps
→ Navy/neon-green/purple accent palette — dark, cosmic, electric
→ CTA manifesto section — "Reveal What's Hidden. Define What's Next."
Built for NFT projects, Web3 startups & digital art drops that want a site the community actually hypes.
Launching a collection? Let's build something that sells itself. 🪐
0
102
❄️ FRZN — Cold Gear E-Commerce Experience
Built a full tactical streetwear store with an identity sharp enough to cut through ice.
→ Cinematic loading screen with brutalist typography
→ Full-bleed hero with editorial campaign photography
→ Filterable product grid [ STASIS / AURORA / GLACIER / STEALTH ]
→ Military-coded UI language — brackets, monospace, warehouse tags
→ Dual-theme system: pitch-black hero → icy white storefront
→ Newsletter, cart system & immersive brand copywriting
Built for fashion brands, streetwear labels & outdoor gear startups that want a site as bold as their product.
If your brand deserves more than a template — I'm your guy. 🧊
1
151