CHITI STUDIO SYSTEMS v2.4
0%
Back to all work
Shree Giriraj Gems and Jewels
Web Development, CMS Architecture, UX Design

House of Giriraj — Luxury Fine Jewelry

A luxury digital flagship for a 30-year-old jewelry atelier transitioning from B2B to D2C — powered by Decap CMS and designed around editorial storytelling.

Web DevelopmentCMSLuxuryE-CommerceDecap CMSB2B to D2C
2026
Luxury Brand Website
Visit Live Site

7

Collections

30+ years

Heritage

30+

CMS-managed Products

90+

Lighthouse Score

The Problem

Shree Giriraj Gems and Jewels, established in 1995, had operated as a B2B manufacturer for 25 years with no online presence. The decision to enter the D2C market for high-end diamond jewelry (₹5 lakh to ₹1 crore) meant building a brand from scratch — no existing website, no social footprint, no retail customers. The challenge was threefold: create a digital-first luxury brand identity for a company with zero consumer presence, build a website that could handle GIA-certified product listings with the trust signals needed for high-value online purchases, and give the client full autonomy over inventory updates without ongoing developer costs or monthly CMS fees.

System Overview

We designed a dark, cinematic experience that treats each product as a collectable artefact. A Decap CMS with 7 category-specific collections (Chokers, Necklaces, Chandeliers, Bracelets, Bangles, Rings, Studs) lets the client manage products through a branded admin panel. The data flow — CMS edits to Markdown files, then synced to the static site — ensures zero server costs and instant load times. JSON-LD structured data was implemented across all product pages for rich search results, and an automated sitemap pipeline ensures all product pages are indexed. A WhatsApp smart enquiry funnel captures high-value leads with instant notifications to the client's team, bridging the gap between digital discovery and personal consultation.

Key Challenges
01

Designing a luxury experience that works on slow network connections (target market includes users with variable connectivity)

02

Building a CMS that non-technical jewelry staff can use comfortably for daily product updates

03

Managing high-resolution product images and videos without compromising page performance

04

Creating a bespoke enquiry flow that captures the detail needed for high-value jewelry inquiries

05

Implementing SEO for a JavaScript-heavy single-page application without a traditional CMS backend

Design Decisions

How We Solved It

01

Cinematic dark mode by default

The site uses a dark, dramatic palette that puts the jewelry front and centre. Every product image is treated with grayscale-to-colour hover transitions, creating a reveal effect that mirrors the experience of opening a jewelry box.

02

B2B-to-D2C brand architecture

The site had to establish a consumer brand identity from scratch — no existing logo recognition, no retail footprint. Every design decision, from the 'Obsidian Gilt — Slow Luxury' palette to the editorial photography treatment, was chosen to signal quality and exclusivity to first-time online buyers making high-value purchases.

03

Decap CMS for client autonomy

We chose Decap CMS because the client needed full control over product updates without monthly CMS fees. Seven collection-specific editors map to the client's existing inventory categories, making the mental model intuitive for their team.

04

WhatsApp smart enquiry funnel

High-value jewelry purchases require personal consultation. The bespoke enquiry form feeds directly into a WhatsApp-based lead management system, allowing the client's team to respond personally to each inquiry with certification details, pricing, and scheduling — bridging digital discovery with the traditional atelier experience.

05

Static-first performance

By using Vite to compile Markdown content into a static site, we achieved Lighthouse scores above 90 on both desktop and mobile. The site loads instantly even on slower connections — critical for the client's target demographic.

06

Automated SEO infrastructure

JSON-LD structured data, automated sitemap generation, and Open Graph tags are all generated from the CMS content. Every time a new product is added or updated, the SEO layer regenerates automatically without developer intervention.

Interface Screens

The Work

The site spans five main sections — home, collections, bespoke, heritage, contact — each designed to reflect the brand's commitment to craftsmanship and legacy.

Homepage hero — Dark cinematic introduction with video background and value proposition that positions the brand as a sanctuary for exceptional stones.
Click to expand

Homepage hero — Dark cinematic introduction with video background and value proposition that positions the brand as a sanctuary for exceptional stones.

Product detail — Each product page features high-resolution imagery, GIA certification details, and a bespoke enquiry CTA. The layout treats each piece as a collectable artefact.
Click to expand

Product detail — Each product page features high-resolution imagery, GIA certification details, and a bespoke enquiry CTA. The layout treats each piece as a collectable artefact.

The Ekta Lineage Bracelet — High jewelry piece featuring a 12ct D-Flawless diamond set in platinum, part of the curated archive collection.
Click to expand

The Ekta Lineage Bracelet — High jewelry piece featuring a 12ct D-Flawless diamond set in platinum, part of the curated archive collection.

The Maharani Viraasat Necklace — A masterwork of Burmese rubies and structural platinum, echoing the quiet intensity of royal inheritance.
Click to expand

The Maharani Viraasat Necklace — A masterwork of Burmese rubies and structural platinum, echoing the quiet intensity of royal inheritance.

The Raj Tilak Emerald Parure — Bespoke Kashmir Blue emerald suite with traditional Mughal-inspired settings and contemporary diamond accents.
Click to expand

The Raj Tilak Emerald Parure — Bespoke Kashmir Blue emerald suite with traditional Mughal-inspired settings and contemporary diamond accents.

Key Features

What We Delivered

Decap CMS with 7 product collections and rich media fields

Multi-page luxury funnel (home, collections, product detail, bespoke, heritage, contact)

Automated product sync from CMS to static site

JSON-LD structured data for all products and organization schema

Automated sitemap generation (34+ URLs)

WhatsApp smart enquiry funnel with lead tracking and instant notifications

Bespoke enquiry form capturing GIA certification details for high-value inquiries

Hero + 3 atelier videos with optimized image fallbacks (AVIF/WebP)

Responsive image pipeline with Cloudinary transformations

First-mover luxury jewelry positioning — India's first digital-first high-end jewelry experience

Impact
01

Launched India's first digital-first luxury jewelry experience from a previously B2B-only manufacturer

02

Production-grade luxury site that the client manages entirely through their CMS

03

WhatsApp enquiry funnel enabled high-value lead capture without technical overhead

04

Lighthouse scores exceed 90 on both desktop and mobile

05

CMS enables the team to add new collections without developer involvement

06

Zero ongoing hosting costs (static site on Vercel free tier)

07

First-mover advantage in Indian online high-end jewelry market with no direct competitors

Reflection

This project proved that the hardest part of digital luxury is not the design — it is creating a brand where none existed online. The client's transition from 25 years of B2B manufacturing to a D2C digital presence meant every pixel had to carry the weight of first impressions. The most impactful decision was not a visual flourish but a structural one: giving a non-technical team the autonomy to update their own inventory through a familiar CMS interface, while the WhatsApp funnel ensured that high-value enquiries never felt automated.

Development Journal

Process & Progress

Discovery & Strategy

B2B-to-D2C Brand Architecture

The client had operated exclusively in B2B manufacturing for 25 years with zero online presence. The discovery call revealed a critical challenge: building a consumer brand from scratch, targeting high-end buyers (₹5 lakh to ₹1 crore), with no existing logo recognition, no retail footprint, and no direct online competitors in Indian high-end jewelry — a first-mover opportunity that required getting the brand identity right on the first attempt.

Competitive Analysis & Positioning

Analysis of the Indian online jewelry market showed no direct competitors in the high-end segment (₹5 lakh+). International benchmarks (Tiffany, Cartier) provided UX inspiration but couldn't be copied directly due to different market dynamics. The positioning strategy centered on 'India's first digital luxury jewelry experience' — combining traditional craftsmanship with a modern digital-first approach.

Design System & CMS

Obsidian Gilt — Slow Luxury Design Language

Developed a dark, cinematic design language called 'Obsidian Gilt' that treats each product as a collectable artefact. The palette uses deep obsidian backgrounds with warm gold accents, grayscale-to-colour hover transitions on product images (mirroring the experience of opening a jewelry box), and editorial typography that prioritizes craftsmanship storytelling over commercial messaging.

Decap CMS with 7 Collections

Architected a Decap CMS with 7 category-specific collections (Chokers, Necklaces, Chandeliers, Bracelets, Bangles, Rings, Studs), each with custom fields for GIA certification data, diamond specifications, and rich media. The CMS-to-Markdown-to-static-site pipeline ensures zero server costs, instant load times, and full client autonomy over product updates.

Conversion & Trust Infrastructure

WhatsApp Smart Enquiry Funnel

High-value jewelry purchases require personal consultation. Built a bespoke enquiry form that feeds into a WhatsApp-based lead management system with instant notifications, lead tracking, and the ability to respond with certification details and scheduling — bridging the gap between digital discovery and the traditional atelier experience.

SEO & Structured Data

Implemented JSON-LD structured data across all product pages (Product schema, Organization schema, FAQ schema), automated sitemap generation covering 34+ URLs, and Open Graph tags. The SEO layer regenerates automatically whenever CMS content is updated, ensuring new collections are indexed without developer intervention.

Tech Stack
Vite + Vanilla HTML/CSS/JS
Decap CMS 3.x
GitHub OAuth
Tailwind CSS
Vercel (hosting)
JSON-LD Structured Data
Automated sitemap generation
Cloudinary

Ready to evolve your digital infrastructure?

Limited intake for Q2. We prioritize partnerships that demand excellence and strategic innovation.