A white Groove pillow on a bed

Groove Pillows: flexible content and faster First Paint

A storefront built around campaigns and mobile shopping

Groove needed more flexibility as its sleep-product range and campaign requirements grew. The existing templates made it difficult to create distinct landing pages, while storefront performance and mobile buying journeys needed attention.

We delivered a headless Shopify and Sanity implementation with reusable interface components, structured content and a connected cart experience.

Implementation and reported performance

Reusable campaign components

Built a component library with Styled Components so recurring interface patterns could be reused across landing pages.

Structured Sanity content

Modeled product specifications, FAQs and reviews as structured content rather than a single unstructured page field.

Content preview workflow

Connected Sanity editing with Gatsby Preview so the team could review content changes before publishing.

40% lower First Paint time

The reported performance result was a 40% relative reduction in First Paint time compared with the previous implementation. This is a specific paint metric, not a Lighthouse score.

Connected cart and checkout

Managed cart state across the storefront and connected product and inventory information to the checkout journey.

Mobile shopping improvements

Refined responsive layouts and sticky add-to-cart access around the smaller-screen buying experience.

The challenge: a publishing workflow that could keep up

The team needed to build campaign pages without treating every new layout as a separate development project. Product content also needed to remain structured and reusable as the range expanded.

The implementation: Shopify, Gatsby and Sanity

Gatsby and React provided the headless storefront, Sanity supplied the content model, and Styled Components supported reusable interface styling. Pre-rendered pages and optimized asset delivery formed part of the performance work.

Previewing changes before publication

Sanity listeners and Gatsby Preview connected the editing workflow to a preview environment. Editors could review changes before publication; preview updates and production publishing remained distinct parts of the workflow.

The architecture brought more control over presentation and content, with the maintenance responsibilities discussed in our native Shopify versus headless guide.

A measurable paint improvement and a reusable publishing system

The reported result was 40% lower First Paint time, expressed as a relative reduction. That result describes the initial paint metric; it does not establish an equivalent change in full-page load time, conversion rate or every Core Web Vital.

Alongside performance work, reusable content modules gave the Groove team a practical way to assemble campaigns and review them before publication. The storefront remained supported by a connected cart and a mobile-focused interface.

Your next project

Planning your next Shopify build?

Need a Shopify storefront that supports regular campaigns and measurable performance work? Share the publishing constraints and the metrics you want to improve.