Overview
Rajbhog Foods has been in business since 1979. It is the largest Indian sweets brand in North America — retail locations in New Jersey, wholesale B2B, and ecommerce. When I joined as Lead UX Product Designer in July 2025, none of that legacy was reflected in the digital experience.
The website looked like a WooCommerce template from 2015. No brand guidelines, no Figma files, no color tokens, no component library. Three different brands running off three different visual systems — or rather, no visual system at all.
| Responsibility | Ownership |
|---|---|
| Brand audit — all 3 brands | I Led |
| Figma design system (tokens → components → patterns) | I Led |
| Website redesign — full IA + UX + UI (5 screens) | In Progress |
| App concept — 4 screens wireframed + moving to hi-fi | In Progress |
| Stakeholder presentations to CEO — color direction, IA | I Led |
| Competitive analysis — 4 competitors + 3 aspirational | I Led |
| Developer handoff + sprint planning | Partnered |
The Audit
First week: full audit. Documented every inconsistency, every UX failure, every missed opportunity. A brand with enormous cultural trust — and a digital presence that communicated none of it.
Hero Section — Multiple Problems
Generic WooCommerce template. The white circle overlay randomly cuts through food photography. Two competing type systems. Orange CTA with no relationship to any color system. No brand story above the fold.
Product Cards — No Visual Hierarchy
Name, description, and CTA all compete at the same visual weight. Icon tabs have no active state. Product images inconsistently cropped. No freshness signal, no occasion context.
Catering — Zero Brand Voice
"Make every occasion special" is stock template copy. No 45-year narrative. No Rajbhog personality anywhere.
Gift Hampers — No Premium Signal
$140 gift sets presented as plain-text list rows. Zero premium experience for a high-intent purchase moment.
Navigation — No System
Icons inconsistent in weight/size. No hierarchy between primary and secondary items. Structured around product type, not user intent.
The Chaos Audit — 8 Critical Gaps
Competitive Analysis
Audited 4 competitors and 3 aspirational references before touching a single Figma frame. Goal: find where the category is underdeveloped, and where Rajbhog had room to be genuinely different.
The Problem
This is the central tension. Rajbhog's existing visual identity — saffron orange, dark green, the specific logo — is embedded in customers' emotional memory. Diwali boxes in that orange. Wedding orders in that packaging. 45 years of family moments tied to that color.
You cannot walk in and say "we're changing the color palette." Every change has to be earned. Every decision needs a rationale that respects the equity already built. The CEO has watched competitors come and go while the original brand endured.
The color approval — 4 iterations
This exact orange is on 45 years of sweet boxes. In customers' photos. On their mothers' refrigerators. The green logo is what "Rajbhog" looks like in their minds. You cannot change this without consequence — so the transition has to be invisible.
Same warmth — more intentional. Orange to gold is the same hue, elevated. Maroon carries the red heritage but gives it depth. Cream replaces flat white with something that feels like a kitchen, a festival, a home.
Figma Design System
No design system = no shared language. Every new page was a new set of decisions. I built the Rajbhog design system from scratch — tokens first, then components, then patterns. Every screen after this is built on this foundation.
01 — Foundation Layer — Color Tokens + Typography Scale
↑ Foundation layer — 10-step color token system with semantic aliases and the full typography scale. Shared as a Figma library across all 3 brand files.
02 — Component Library — Buttons, Inputs, Badges, Cards
↑ Full component library — 5 button variants across 5 states, all input states, badge system, product cards (default / hover / out of stock). Every component built with auto-layout and Figma variants.
Website Redesign — In Progress
The brief I wrote for myself: this site should feel like walking into the Edison store — warm, abundant, family-owned, and deeply Indian-American. Five screens designed and prototyped in Figma.
Homepage hero — dark editorial treatment sets a different tone from every Indian food competitor. Occasion-first navigation replaces the old product-type dropdown.
Product catalog with occasion-first filter tabs and design-system product cards across all states.
Gift Builder — 4-step flow with live box preview. The old site had no dedicated gifting experience at all.
Our Story — makes 45 years feel like a luxury asset. Dark editorial header into warm white. Old site had no story page.
Diwali occasion landing — dedicated page per festival. Old site had zero occasion-specific landing pages.
App Concept — In Progress
Rajbhog customers return for every major occasion — Diwali, Eid, Navratri, weddings, baby showers. An app makes that ritual frictionless. Same design tokens, same components as the web — different form factor.
Home — Fresh Today + Occasion-first navigation
Gift Builder — step 2 of 4 with live box preview
Explore — search + occasion-curated collections
Order History — one-tap reorder + AI Diwali reminder
Reflection
What's Coming Next