Floxa
Book a call

Technical demo · not a client project

Every movement on this page was built by hand, with the same techniques we use on client projects. Just keep scrolling.

Start a project

Why it matters

Which is why we don't assemble websites from builder blocks. Layout, typography and motion are made for your business — not for a template that tens of thousands of others already use.

Building blocks

Seven techniques holding this page together

01

WebGL shader

The background up top is not a video but a program that redraws every frame: a few kilobytes instead of several megabytes — and it reacts to the pointer.

02

Scroll choreography

GSAP ScrollTrigger ties motion to scroll position. Sections hold still, content moves exactly as far as you scroll — the visitor sets the pace.

03

Kinetic typography

Headlines are split into characters and pulled out from behind masks. The full sentence still sits in the source — readable for Google and for screen readers.

04

Smooth scroll

Lenis smooths the scroll without breaking keyboard control or anchor links. Motion with inertia reads as expensive; hard jumps do not.

05

Micro-interactions

Magnetic buttons, 3D tilt, a custom cursor. Details nobody consciously notices — and which still decide between “solid” and “high end”.

06

Performance budget

Every effect has to earn its place. We only animate what the GPU handles, and anything heavy loads once it is actually visible.

07

Restraint

Anyone who asks their system for less motion gets a calm page here: no parallax, no auto-animation, same content.

Scroll or swipe sideways

Scroll-linked

You scroll — the page inside the frame scrolls with you

The section holds still while the content inside the browser window keeps moving. It lets you show a whole page without asking anyone to leave the current one.

What is inside the frame is deliberately abstract: it shows the structure and rhythm of a page, not any particular client's website.

floxa.de/your-new-site

Limits

Effects only count if the page stays fast anyway

<2.5s
Largest Contentful Paint

The largest visible element is there in under 2.5 seconds.

<0.10
Cumulative Layout Shift

Nothing jumps while loading — no misclicks, no scrolling back.

60fps
Frame rate while scrolling

We only animate what the GPU can carry smoothly.

100%
Keyboard operable

Every link, every button — reachable without a mouse.

These are our targets for new projects, not measurements from a client account. Google grades exactly these numbers, which is why they are here rather than in the small print.

Schematic

What visibility looks like when it grows

The line draws itself as you scroll, with a marker riding along and the ranking counting down. It is how you show a development that nobody reads in a table.

47Position on Google
Month 1Month 6
A schematic illustration of the technique — not an analysis of a real project. Numbers from live engagements are something we show in person.

Try it

Details you only find with a pointer

Move your pointer across the three panels. On a phone they stay still — there is no cursor there worth rewarding.

Magnetic

The button leans toward the pointer and the label follows a beat later. Easier to hit — and instantly readable as a page that responds.

Move the pointer here

3D tilt

The surface tips toward the pointer and the glare tracks with it. Two axes, no 3D framework, a handful of lines.

Label roll

The label rolls up by one line on hover. Pure CSS — it works before a single script has loaded.

End of demo

Not every project needs all of this. We pick what suits your audience — and leave out what only we would enjoy. Tell us what you have in mind.

This page is a technical demo by Floxa, not a client project. The numbers above are targets, the curve is schematic, and the content inside the browser frame is placeholder.