Vaani

• 

  The Home Page

• 

  The Phone View.

• 

  The Computer View.

• 

  Your Shop is Live

Inspiration

Growing up in a close-knit neighborhood, we observed local retail shop owners—people who have supported our community for years—struggling to establish a digital presence. Many were either paying exorbitant fees to agencies for basic website setup and ongoing maintenance, or were simply unaware that creating a store front could be accessible and straightforward. Having witnessed firsthand the lost business opportunities and financial burden on these small business owners, we were inspired to build a zero-friction, AI-driven platform that empowers them to create functional, personalized websites effortlessly.

What it does

You speak or type a description; Vaani pulls out the shop name, hours, contact, address and products with prices. You review everything next to a live phone or computer preview, and can choose one of 6 colour themes, upload a logo and product photos. You put the shop online and get a public link, a private edit key and a printable QR counter poster. The shop page has a live Open/Closing soon/Closed sign, search, category filters, a cart, a WhatsApp order message with the itemised total, a map, and a contact form. The owner dashboard has voice add products, editing and a message inbox. It works with no API key, using an offline parser.

How we built it

React, Vite, Tailwind CSS, Framer Motion, Lucide icons on the front end. Node.js, Express , Zod and SQLite (built into Node) on the back end. Claude (Anthropic) with structured JSON output, plus a rule-based offline parser as the fallback. Both pass through one validation step. The Web Speech API for voice input. WhatsApp click-to-chat links, a Google Maps embed, and the qrcode library. 27 automated tests.

Challenges we ran into

Turning messy speech into data. "Open 9 to 8" has to mean 9 AM to 8 PM. Prices come as "₹150", "150 rupees" or "120 per kg". Hour numbers must not be mistaken for prices. Keeping the app working when the AI fails, which led to the offline fallback. The first UI looked AI-generated, so you redesigned it: no emojis, outline icons only, no em dashes. A leftover server on Windows silently blocked the app, so shops disappeared until it was fixed. Accepting uploads safely: checking the file's real type and shrinking photos in the browser.

Accomplishments that we're proud of

It works offline with no API key. A real, scannable QR counter poster. Accessible colour contrast on every theme. The two-look design (Signboard and Leaf). WhatsApp ordering, which matches how small shops already work.

What we learned

Through the hands-on implementation of this project, we significantly expanded our understanding of building full-stack applications with AI assistance. Bridging the gap between conceptual architecture and practical implementation—from structuring AI prompt pipelines to automating specification document generation—deepened our grasp of modern software workflows. Building a functional, end-to-end product to solve a real-world problem provided invaluable insights that will shape our future software engineering practices.

What's next for Vaani

regional-language parsing offline. Custom domains. Analytics such as views and WhatsApp clicks. Festival specials added by voice. Real accounts instead of edit keys. Hosting the uploads in cloud storage.

Built With

• express.js
• framer-motion
• google-maps
• javascript
• lucide
• node.js
• qrcode
• react
• sqlite
• tailwindcss
• vite
• web-speech-api
• whatsapp
• zod