Sparsh Mattress
Asleepbrandthatsellsthroughitsdealers.
Supreme Petro Foam's consumer brand — 19 mattresses and pillows across four series, sold through authorised dealers in 17 cities — on one site that serves sleepers, retailers and OEM foam buyers at once.
Stack
- HTML
- CSS
- JavaScript
- GSAP
- Lenis
- Vercel
Results
The brief
Problem
Supreme Petro Foam has been making foam since 2006, but the Sparsh brand had three audiences pulling in three different directions: families choosing a mattress, retailers weighing up a dealership, and furniture, hospitality and automotive buyers purchasing foam by the sheet. One product grid serves none of them properly. And because Sparsh protects its dealers' pricing, the site can't lean on the usual answer — an online cart — to close the loop.
How we built it
Approach
Three front doors under one brand. The consumer path is a filterable catalogue — 19 products across the Bodycare, Real Puff, Vibrant and Surface series, plus pillows — sorted by feel, thickness and size rather than by price, and it ends at a dealer in one of 17 cities instead of a checkout. A separate commercial portal splits the B2B traffic in two: a dealership funnel that leads with manufacturer-direct margins, protected territory and display support, and a Foam B2B track carrying grades, densities and a route to a quote for OEM buyers. A sleep library — buying guide, FAQs and blog — does the education a considered purchase needs. The homepage itself is a three-act, scroll-driven story built on GSAP and Lenis, with optional ambient audio: this brand is sold on feel, so the site had to be felt, not just read.
Feature showcase
The bits worth zooming into.
The story · a long day
Act two of the homepage narrative — the day that wears you down, drawn rather than photographed. The scroll is hijacked and pinned, so each beat plays out in place instead of scrolling past.
The story · end it with Sparsh
The resolution beat, landing on the single CTA the page needs: Explore Products. A mattress is sold on how it feels, so the pitch is a scene rather than a spec sheet.
The story · crafting since 2004
Below the narrative, the heritage beat — an illustrated night street under 'Crafting Pillows Since 2004' — carrying two decades of making without a single stock photo.
Product catalogue
Nineteen mattresses and pillows across four series, filtered by feel, thickness and size — the way someone actually shops a mattress — with no prices on show to undercut the dealer network.
Light mode · the same catalogue by day
The same page with the theme flipped: night sky becomes day sky, the colour logo swaps in, and nineteen SKUs and their filters get read in daylight. The preference persists between visits.
Dealership funnel
The retailer pitch with the application attached: manufacturer-direct margins, protected territory, no online undercutting, and marketing and display support.
Foam B2B
A separate wholesale track for furniture, hospitality, automotive and packaging buyers — foam grades, densities, a procurement-grade density explainer, and a route to a quote.
Light mode · dealer finder
Consumer intent routed to the nearest authorised dealer across 17 cities — the conversion step that stands in for a checkout — shown here in the light theme.
Decision log
What we decided, and why.
01
Two themes, because the story and the shopping aren't the same job
The homepage is a fixed night-time narrative — the toggle deliberately skips it, because the story only works after dark. Every other page carries a dark/light switch that remembers your choice between visits and swaps in the brand's colour logo for the light treatment. Reading nineteen product specs, a foam density table or a dealer list in midnight navy is a different task to being told a bedtime story, and the site stops pretending otherwise.
02
Written for search before it was written for scroll
Every page carries its own title and meta description pitched at one specific audience — 'Mattress Dealership Opportunity — Become a Sparsh Authorised Dealer' reads nothing like 'Foam B2B — PU, HR, Bonded & Memory Foam Supply for Furniture, Hospitality & OEM', because the people searching those two things want opposite outcomes. Canonicals are absolute and self-referencing on every page, the robots directives open rich results all the way up (max-snippet:-1, max-image-preview:large), Open Graph is complete, and a 74-URL sitemap is declared straight from robots.txt.
03
Structured data that names the territory
The JSON-LD carries Organization and WebSite alongside a PostalAddress and — the part that actually matters here — areaServed as seven named states rather than a vague 'India': Punjab, Haryana, Jammu and Kashmir, Uttar Pradesh, Uttarakhand, Rajasthan and Gujarat. For a dealer-led brand that only sells through authorised retailers in defined territories, telling a search engine exactly which states are covered is the difference between surfacing for the buyer down the road and surfacing for nobody.
04
A robots.txt with an opinion about AI
GPTBot, Google-Extended, PerplexityBot, ClaudeBot and CCBot are explicitly allowed — a mattress is a researched, high-consideration purchase, and that research increasingly starts in an assistant rather than a search box. AhrefsBot and SemrushBot are explicitly blocked: competitor crawlers spend crawl budget and return nothing to the business. Most sites ship the default file and let both of those decisions happen to them.
Related work
More from the manufacturing shelf.
Enterprise · 2026
Hero Future Energies
A bespoke intranet for one of India's largest renewable-energy groups — built for thousands of employees, not a demo. Screens shown are blurred under NDA.
Read case studyFMCG · 2024
Nutricana Feed
A research-driven cattle-feed brand operating across 10+ states, given a site that respects both the science and the farmer.
Read case studyFMCG · 2024
Corral Feed
Family-run cattle & buffalo feed, trusted by 5,000+ farms since 2007 — rebuilt warm, trilingual, and trust-first.
Read case study