Seal Skin Covers: complex product configuration on Shopify

Headless | Shopify Plus | Cars

A large catalog without an unmanageable storefront

Seal Skin Covers sells vehicle and marine covers with detailed fit and sizing requirements. The assignment was to make a large range of product combinations searchable and purchasable while keeping Shopify product management practical.

We combined a custom catalog, a headless storefront and Shopify integration development. Sanity managed editorial content, while the product-management layer handled the combinations and configuration rules.

Catalog and delivery scope

Headless Shopify storefront

Used Shopify for commerce and Gatsby with React for the customer-facing storefront.

Dimension-based pricing

Calculated prices for size-dependent products and passed the configured purchase into Shopify through the Draft Orders API.

Configured checkout handoff

Carried the selected configuration, custom properties and calculated price into the purchase flow.

Static delivery on Netlify

Hosted the generated storefront on Netlify, with staged release and monitoring during rollout.

1,000,000+ catalog combinations

The custom catalog supported more than one million product variants and combinations, mapped to a smaller set of Shopify products and SKUs. This is not a native per-product Shopify variant count.

Sanity content management

Kept marketing pages and structured editorial content manageable separately from the product configuration system.

Analytics integration

Integrated Meta, Google and TikTok tracking into the storefront for the brand’s measurement and campaign workflows.

Technical search foundations

Implemented structured data and crawlable page content alongside the storefront architecture.

10% initial traffic rollout

Introduced the platform to 10% of traffic before expanding the rollout after checks of checkout, catalog behavior and availability.

Mapping a complex catalog into Shopify

The custom catalog managed more than one million product variants and combinations. Similar car-cover options could map to a limited set of Shopify SKUs, while their distinguishing configuration details remained attached to the purchase.

Boat covers required a different rule: price depended on dimensions. A calculation layer produced the configured price and used Shopify Draft Orders to carry it into checkout, together with the relevant product properties.

The implementation combined Gatsby and React for the storefront, Sanity for content and a Ruby on Rails backend for catalog logic. This kept complex product rules separate from the content team’s publishing tasks.

Validating the platform with a staged rollout

The new platform was introduced to 10% of traffic first. We checked uptime, checkout behavior and catalog performance before increasing exposure.

This release approach let the team validate the important purchase paths under live trading conditions. Our launch QA checklist describes the broader checks used to prepare a controlled release.

After launch, support and iteration continued as catalog and operational requirements evolved.

Separate content, configuration and commerce responsibilities

Sanity supplied the editorial content, the custom product-management layer resolved product combinations, and Shopify handled the commerce handoff. Gatsby generated storefront pages for delivery through Netlify.

High-traffic pages could be prepared ahead of time, with less frequently visited pages generated on demand. Interactive configuration and checkout remained connected to the relevant APIs rather than being treated as static content.

Your next project

Planning a similar Shopify migration?

Working with a complex Shopify catalog, custom sizes or dynamic prices? Share the product rules and checkout requirements you need to support.

Book a project review

Shopify development services

Related work