Motion-graphic web studio

Websites that move people.

We're the agency that designs and builds motion-graphic websites: scroll-driven stories, kinetic type and interactive scenes that make a brand impossible to scroll past.

01 / Golf

Tee off
in motion.

  • Scroll-drawn ball flight
  • Layered course parallax
  • Tee-time CTAs
Explore the motion lab →

02 / Automotive

Zero to wow
in one scroll.

  • Light-streak hero
  • Clip-path reveals
  • Pinned gallery
Get a motion site like this →

03 / Barber & salon

Every cut
tells a story.

  • 3D hero object
  • Kinetic serif type
  • One-tap booking
See the barbershop case study →
Barbershop website concept, desktop hero
Barbershop website concept on mobile

What we do

Most websites sit still. We design ones that perform: every scroll, hover and tap is choreographed, so your story unfolds like a film and your visitors actually feel the brand.

  1. 01

    Scroll storytelling

    Pinned scenes and scroll-scrubbed timelines that turn a homepage into a sequence.

  2. 02

    Kinetic typography

    Headlines that split, slide, scramble and breathe, without hurting readability or SEO.

  3. 03

    Interactive canvas & 3D

    Generative heroes, particles and WebGL objects that react to the pointer.

  4. 04

    Micro-interactions & transitions

    Magnetic buttons, cursor states and page wipes that make the whole site feel crafted.

Motion lab

Don't take our word for it. Play with it.

Six live techniques we drop into client sites. Every one runs at 60fps and switches itself off for people who prefer reduced motion.

Magnetic interactions

Buttons that lean towards the cursor. Great for primary CTAs.

SVG line drawing

Paths that draw themselves as you scroll: routes, signatures, diagrams.

KINETIC TYPE

Text scramble

Decoder-style type reveals for headings, menus and hover states.

Depth

3D tilt & parallax

Layered cards that move at different depths under the pointer.

Interactive canvas

Generative particle fields that scatter and regroup around the pointer.

Page A
Page B

Page transitions

Seamless wipes between pages so the site feels like one continuous piece.

Selected work

Two brands. Two ways to move.

A ground-up motion concept for a neighbourhood barbershop, and a motion and performance upgrade for a live five-country Shopify brand.

barberia-eleven · preview Full-page screenshot of the Barbería Eleven website concept

01 · Barber & salon

Barbería Eleven Echeverría

Neighbourhood barbershop · Málaga · Concept preview

An editorial, bilingual (ES/EN) site with a real-time 3D straight razor in the hero, falling hair particles, oversized serif type and a booking-first layout.

  • Three.js 3D hero
  • GSAP chapters
  • Kinetic serif type
  • ES / EN
Open the preview →
www.hexxee.com HEXXEE homepage hero on desktop HEXXEE homepage on mobile

02 · E-commerce · Shopify

UK-made gym & novelty socks · 5 country stores · Live store Motion & performance upgrade

HEXXEE sells 500+ sock designs across five Shopify stores: UK, DE, FR, IT and NL. The store runs on Prestige, an off-the-shelf Shopify theme, so this wasn't a rebuild. It was a motion and performance upgrade on top: product grids that feel alive, lighter pages, and tighter technical SEO in every market.

Try it: hover, or press and hold

Aztec sock, product shot
Atlas Stones sock, product shot
Summer Outlines sock, product shot
Visit hexxee.com →

What we added · Oct 2026

  • Hover-to-swap product cards show the second image on hover, or on press-and-hold on mobile, across all five stores. This included a fix to the homepage Best Sellers.
  • A custom scratch-card discount pop-up for the Italian store, delayed and gated behind cookie consent.
  • A restyled cookie banner, with GA4 and Webgains tracking firing only after consent.
  • Lighter collection pages: Lighthouse mobile page weight is down roughly 13–20%.
  • hreflang links between every product and collection across all five stores.
  • SEO clean-up: 738 broken-link redirects added (1,223 on the UK store in total), redirect chains cut to a single hop, and duplicate titles, meta descriptions and alt text fixed.
  • A new FAQ page, footer links and washing-care content.

Collection page weight · Lighthouse mobile (KiB)

DE
6,067 → 5,129
FR
6,051 → 4,830
IT
4,898 → 4,121
NL
4,913 → 4,297

Before After

The base storefront design is the Prestige Shopify theme. Only our custom work is credited here.

Process

From storyboard to sixty frames a second.

01

Discover

We dig into your business, audience and current site, and agree what the site must achieve.

02

Storyboard

Like a film: we map the scroll journey scene by scene before a single pixel is designed.

03

Design in motion

Styleframes and motion prototypes so you can feel the site, not just see a static mock-up.

04

Build

Hand-coded, fast and responsive, with reduced-motion fallbacks and proper SEO baked in.

05

Launch & care

We handle the switch-over, test on real devices and keep it running afterwards.

Packages

Pick your level of motion.

Every project is quoted on scope. Tell us what you need and we'll come back with a clear, fixed proposal.

Level 01

Motion Landing

  • One-page site with animated hero
  • Scroll-reveal sections
  • Mobile-first build & basic SEO
  • Contact / booking CTA

Pricing on request

Level 02

Motion Website

  • Multi-page site
  • Pinned scroll scenes & kinetic type
  • Page transitions & micro-interactions
  • CMS or easy-edit content

Pricing on request

Level 03

Motion Flagship

  • Bespoke storyboarded experience
  • 3D / WebGL or canvas hero
  • Custom illustration & motion assets
  • Launch support & ongoing care

Pricing on request

Contact

Let's makeit move.

Got a site that's standing still? Tell us about your business and we'll storyboard what it could be.

Start a project