An interior design studio that needed two things: a website for its clients, and a web app for quoting. Homeowners sign up, see a price range and book a site visit. The studio’s designers then build an itemised quote and send it to them, all without leaving Tranquil Decor’s platform.
Tranquil Decor, an interior design studio, needed two things: a client-facing website that presents the work, ranks in the cities it serves and brings in enquiries, and a custom web app where its designers build and send quotes to the homeowners who sign up and ask for one.
The web app was there to fix what happened after an enquiry. A homeowner filled in a form, then waited for a call to learn what their home might cost. Quotes were worked out by hand from rate sheets, site visits were arranged over the phone, and the team had no single place to see who had asked for what.
The brief came down to four asks:
| Before | Now |
|---|---|
| A homeowner waits for a call to hear a price | A price range in under two minutes, on three calculators |
| Quotes worked out by hand from rate sheets | Itemised proposals built from a rate card the owner controls |
| Site visits arranged by phone | Visits booked and paid for online |
| Requests scattered across calls and chats | Every request assigned by city, tracked on a timeline |
| Page changes need a developer | The studio edits every page itself |
A homeowner goes from first visit to an accepted proposal without leaving the site. The team works from one dashboard.
48 page types from the studio’s Figma: projects with before/after sliders and 3D views, 27 design-idea rooms, city pages, services and a blog.
Full home, kitchen and rental home. A handful of questions, then a price range built from the studio’s own rates. Customers can attach a floor plan or photos.
Pick a city, a date and a slot. Free in the studio’s home city, a small fee elsewhere, paid through Razorpay. The slot is held while the customer pays and released if they leave.
Sign-in is a phone number and a WhatsApp code, with no password. A proposal lists each room item by item and carries a 24-hour early-acceptance offer with a live countdown.
Each request gets a reference number and goes to the designer who covers that city. Calls and notes land on a timeline, and proposals go out as a private WhatsApp link.
Load a starting package for the home size and tier, adjust rooms, items and measurements, and the total recalculates as you type. A discount above the owner’s limit goes to the owner first.
Every page and every flow was checked at every width before it shipped, from a 375px phone up to a 2000px monitor.
Paid consultation booking became quoting, city-based routing and paid site visits. Ten rounds of feedback came in between 14 September and 8 October, one of them 54 comments long. Each shipped as its own release, so any one could be rolled back.
The studio’s customers do not check email for a booking confirmation, and sending SMS there needs a sender registration the studio did not have. Login codes, confirmations and alerts go out on WhatsApp, from a queue that retries on failure.
The calculators, accounts, proposals and the whole back office had no designs. We extended the designer’s visual language to them and compared all nineteen Figma frames with the live build, section by section.
About 80 scripted checks ran the full journey as a customer, a designer and the owner. A second customer opening someone else’s proposal link gets a 404. Sign-in, payments, messaging and database access were reviewed before launch.
We first proposed Astro, a framework for content sites. Once logins and payments came into it, we recommended Next.js: one application where there would otherwise have been a website and a separate app, with the marketing pages still pre-rendered so they load like a static site.
| Layer | Choice | Why |
|---|---|---|
| Site and dashboards | Next.js 16, React 19, TypeScript | One codebase, one login and one design for public pages, customer accounts and the back office |
| Styling and motion | Tailwind 4, GSAP | The Figma rebuilt as a component library, with motion that respects reduced-motion settings |
| Content | Sanity | The studio changes pages, projects, blogs and city pages itself, with guidance written into every field |
| Data and accounts | Supabase (Postgres) | Row-level security: a customer can only ever read their own requests, proposals and bookings |
| Files | Supabase private storage | Floor plans and photos stay private. Every uploaded image is rebuilt on the server before it is stored |
| Payments | Razorpay | UPI, cards and netbanking. A booking is confirmed only after the payment is verified server to server |
| Messaging | msg91 (WhatsApp and email) | One provider for login codes, confirmations and staff alerts, and no SMS registration to wait for |
| Background jobs | Postgres scheduler and a notifications queue | Retries and slot-hold expiry with no extra server to maintain |
| Hosting | Vercel | Fast delivery where the studio’s customers are and nothing for the studio to maintain |
Next, you send a short brief and we reply with a fixed price and a delivery date in writing. You pay nothing until you sign the order.
