April 13, 2026/Advanced/About & Story

Sticky About

A scroll-pinned two-column section with a stacked image gallery on the left and matching text on the right. Scroll snaps between items with clip-path reveal transitions and a progress bar. Collapses to full-screen stacked cards on mobile.

Kickandbass
Westend
Delivrd
Socialstats
Case Study

Kickandbass

A motion-forward headless Shopify storefront built for a London-based music label.

Every interaction is driven by an animation language developed from the brand's visual identity.

Case Study

Westend

A nonprofit campaign site for a community arts organisation.

The brief was to make the site feel alive — every scroll, hover, and transition reinforces the brand's energy.

Case Study

Delivrd

Brand identity and web for a logistics startup entering a crowded market.

The challenge was to make 'fast and reliable' feel premium rather than generic.

Case Study

Socialstats

A data product for social media managers. Dense information, zero visual noise.

The design system was built to make complex analytics feel intuitive at a glance.

Kickandbass
Case Study

Kickandbass

A motion-forward headless Shopify storefront built for a London-based music label.

Every interaction is driven by an animation language developed from the brand's visual identity.

Westend
Case Study

Westend

A nonprofit campaign site for a community arts organisation.

The brief was to make the site feel alive — every scroll, hover, and transition reinforces the brand's energy.

Delivrd
Case Study

Delivrd

Brand identity and web for a logistics startup entering a crowded market.

The challenge was to make 'fast and reliable' feel premium rather than generic.

Socialstats
Case Study

Socialstats

A data product for social media managers. Dense information, zero visual noise.

The design system was built to make complex analytics feel intuitive at a glance.

import StickyAbout from "./index.jsx";
import { stickyAbout } from "../demo-data.js";
import styles from "./demo.module.css";

export default function StickyAboutDemo() {
  return (
    <div className={styles.page}>
      <div className={styles.spacer} />
      <StickyAbout items={stickyAbout.items} />
      <div className={styles.spacer} />
    </div>
  );
}
  • gsap

Related Components

1W AGO
BeNorth Taglineabout-story
1W AGO
Milk Scenarios & Expertiseabout-story
3MO AGO
Editorial Introabout-story