[ ]Relogic
Flux Commerce
E-Commerce

Flux Commerce

Headless commerce that converts like crazy

Background

Flux Apparel had outgrown their off-the-shelf Shopify theme. They were a growing direct-to-consumer brand with a strong aesthetic identity — but their storefront looked like everyone else's. More critically, their mobile conversion rate was 1.8%, well below industry benchmarks.

Architecture

We chose a headless approach: Shopify as the commerce backbone, Sanity CMS for editorial content, and Next.js 14 on the front-end deployed on Vercel's edge network.

// Product page with Partial Pre-rendering
import { Suspense } from "react";
import { unstable_noStore as noStore } from "next/cache";
 
export default async function ProductPage({
  params,
}: {
  params: { handle: string };
}) {
  // Static shell renders immediately from edge
  return (
    <div>
      <ProductHero handle={params.handle} />
      <Suspense fallback={<VariantSkeleton />}>
        {/* Dynamic variant availability fetched fresh */}
        <ProductVariants handle={params.handle} />
      </Suspense>
    </div>
  );
}

The Scroll Experience

Product pages were engineered as editorial experiences. Each product had a dedicated "story scroll" — a GSAP ScrollTrigger sequence that revealed product details, materials, and craftsmanship photography as users scrolled.

// GSAP ScrollTrigger product reveal sequence
gsap.timeline({
  scrollTrigger: {
    trigger: ".product-story",
    start: "top top",
    end: "+=300%",
    scrub: 1,
    pin: true,
  }
})
.fromTo(".product-image", { scale: 1.1 }, { scale: 1, duration: 1 })
.fromTo(".product-copy", { yPercent: 100, opacity: 0 }, { yPercent: 0, opacity: 1 }, "-=0.5")
.fromTo(".material-detail", { clipPath: "inset(0 100% 0 0)" }, { clipPath: "inset(0 0% 0 0)" }, "-=0.3");

Mobile-First Cart

The cart experience was rebuilt as a full-screen overlay with momentum-based animations. On mobile, it behaved like a native iOS sheet — draggable, with spring physics.

Results

The new storefront launched during Flux's autumn collection drop:

  • Add-to-cart rate improved from 3.2% to 5.3% (+67%)
  • Mobile conversion rate went from 1.8% to 3.1%
  • Average session duration increased by 94 seconds
  • Return customer rate improved by 22%

We went from a generic Shopify theme to a genuine brand statement. Relogic understood that for us, every millisecond and every animation had to earn its place.

M

Marcus Webb

Co-founder, Flux Apparel