Nublar
A premium Shopify storefront for Nublar - India's first padel racket brand. We translated client-provided Figma designs into a pixel-perfect, mobile-first custom theme with a sticky filter shop, racket selector, lifestyle Instagram feed, and Razorpay-powered checkout - built to carry the brand's energetic, colour-forward identity at every scroll.
Project overview
Nublar is India's first padel racket brand - a young, design-led D2C label with a sharp identity: Power. Precision. Play. We were brought in to translate the brand's Figma designs into a production-grade Shopify storefront that could carry that identity at every scroll, on every device, without compromising on speed or polish. The output is a four-page premium ecommerce experience - Home, Shop, About, Contact - built as a custom Shopify theme with Razorpay checkout, lifestyle storytelling, and Instagram social proof.
The challenge
Most Shopify stores look like Shopify stores. For a launch brand competing in a category most Indians have never heard of, the storefront had to do double duty: introduce the sport, sell the product, and look like a premium global label from frame one. The design system was bold, colour-forward, and animation-heavy, with non-standard layouts - a 3-image hero, racket selector blocks by skill level, sticky filter sidebars, hover-swap product cards - that needed to render perfectly across mobile and desktop while staying fast enough to convert paid traffic.
Discovery & strategy
Because the visual design was fully owned by SpiceyGuava, our discovery work focused on a different question: how do you build inside Shopify's templating model without bending the brand's design out of shape? We mapped every section in the Figma file to either a native Shopify section, a custom Liquid block, or a theme-editor-friendly schema - so the client could update copy, swap hero media, and reorder modules post-launch without going back to a developer.
Design process
Pixel-perfect translation of the provided Figma into responsive Liquid components. The hero supports both an autoplay video and a 3-image grid variant for A/B testing different launch creative. The shop page uses a sticky accordion filter sidebar (price, availability, colour) with a 'Load More' pagination pattern instead of paged grids - chosen to keep the scroll experience continuous on mobile. Product cards include hover-swap imagery, feature highlights, and MRP strike-through pricing. Every interaction was tuned with smooth, intentional micro-animation that matches the brand's energetic tone without slowing down LCP.
Development execution
Built as a fully custom Shopify theme on Liquid, with Razorpay configured for UPI, cards, and net banking, plus the standard Shopify checkout flow. The Instagram lifestyle block pulls automatically from the brand's feed, so the homepage stays fresh without manual updates. SEO metadata, alt text, and Shopify analytics were configured during setup; performance was tuned to keep mobile LCP and CLS well inside Shopify's storefront targets. Delivered in a two-week sprint - Week 1 covered Shopify setup, the homepage, and theme foundations; Week 2 shipped the shop pages, product templates, About, Contact, and final deployment.
Technology stack
Outcomes
Project gallery
Let's build something exceptional.
Tell us about the product you're building. Discovery calls are short, sharp, and free. You'll meet a senior engineer or designer - never a sales rep.