dreambuilds.com.au Start a project

Dream Builds — R&D Division

The Lab.

Eight production-grade scroll & graphics experiments, running live on this page. Hand-written code — a GPU shader, a particle field, kinetic type — nothing a template can do.

GPU fragment shader · 60fps Zero plugins beyond GSAP Reduced-motion safe

EXP-02

Type that feels velocity.

Scroll fast and the rows skew and accelerate; stop and they settle. Client use: brand statements, section dividers, campaign pages.

EXP-03

Seven hundred particles, one wind.

Each particle rides an invisible noise field, redrawn every frame on a canvas. On desktop, move your cursor through the stream — it parts around you. Client use: ambient hero motion, fintech/data moods, interactive backdrops.

Move your cursor through it

EXP-04

The page turns sideways.

Pinned. Scrubbed. Sideways.

The section pins to the viewport and your vertical scroll drives a horizontal world. Images inside move at their own speed — parallax within parallax.

Sydney Shuttle Express website
i.Internal parallax — the image drifts against its frame
  • 01Section pins while scroll continues
  • 02Scroll distance maps 1:1 to horizontal travel
  • 03Inner images counter-drift for depth
  • 04Works with touch — no hijacking, no jank
Santa Mesa website
ii.Portfolios, product ranges, timelines, menus

And back to vertical.

The unpin is seamless — the page simply carries on. Keep scrolling.

EXP-05

Drawn by your scroll.

A single SVG path — harbour, bridge, sails — inked line-by-line as you move down the page. Scroll up and it un-draws. Client use: process diagrams, route maps, signatures, story moments.

stroke-dashoffset, scrubbed one path, many subpaths reversible — scroll back up

EXP-06

Images with entrances.

Clip-path wipes and settle-zooms as frames enter the viewport — then a card that tilts in 3D and catches the light under your cursor. Client use: case studies, product cards, galleries.

Sydney harbour
Wipe · from left
Sydney Shuttle Express website
Wipe · from below
Santa Mesa website
Wipe · from right

Pick it up. Almost.

Perspective transforms track your cursor; a glare highlight follows it across the surface. Pure CSS variables and one event listener — no library. (On touch devices it sits politely still.)

Dream Builds brand card Hover me

EXP-07

Copy that reads with you.

Each word inks in as it crosses your reading line — scroll back and it fades again. Client use: manifestos, founder letters, long-form sales pages.

We don't rent templates and we don't fake motion with heavy plugins. Every effect on this page is a few hundred lines of hand-written code, tuned until it feels effortless. That's the difference between a website people close — and a website people remember.

EXP-08

The frame swallows the screen.

A small frame scales until it becomes the page — a cinematic gateway between chapters. Client use: transitions into galleries, menus, venue tours.

Sydney harbour at dusk

Built in Sydney.
Felt everywhere.

Want this on your site?

Every experiment above ships in plain HTML, CSS and JavaScript — the same stack as the $179/mo package. No plugins to license, nothing to slow your site down.

Start a project

Or see the packages · back to dreambuilds.com.au