zevi-ai

byHarsh Jay Kumar

Build a clean, modern, and fully functional Micro-SaaS web application called "ReviewReply AI" designed for local business owners (like cafes, salons, clinics, and gyms) to instantly generate professional, polite, and de-escalating replies to customer reviews. ### Tech Stack & Design Requirements: - Modern, minimalist UI using Tailwind CSS (clean white/slate theme with primary accent color like indigo or emerald). - Responsive design that works seamlessly on both mobile phones and desktops. - Fast loading speed with smooth micro-interactions (loading spinners, toast notifications). ### Core Features to Implement: 1. User Authentication (Simple Email/Password Login & Sign up using Supabase or local state). 2. Dashboard View: - A clean input textarea where the business owner can paste a customer review. - A dropdown menu to select the "Tone of Reply": * Professional & Polite (Standard) * Friendly & Casual (For cafes/salons) * Apologetic / De-escalation (For negative 1-star or 2-star reviews) * Hinglish / Local Style (Engaging and warm) - A prominent "Generate AI Reply" button. 3. AI Processing Area: - Connect securely via backend API to OpenAI (GPT-4o-mini or GPT-3.5-turbo). - System Prompt instruction for the AI: "You are an expert customer service manager for local businesses. Write a short, engaging, and culturally appropriate reply to the customer review provided, using the selected tone. Keep it ready to copy-paste directly to Google Maps or Instagram." 4. Output & Actions: - Display the generated reply clearly in a dedicated box. - "Copy to Clipboard" button with a success toast notification ("Copied!"). - "Send via WhatsApp" quick-action button that formats the text into a WhatsApp share link. 5. Subscription / Pricing Section (Mockup / Integration ready): - A simple pricing card display: "Starter Plan - ₹499/month" with a "Subscribe Now" button linked to a placeholder payment gateway URL (Razorpay). Ensure the code is well-structured, modular, and ready to deploy immediately with proper error handling for empty inputs or API timeouts.

LandingLoginSign Up
Landing

Comments (0)

No comments yet. Be the first!

Login design preview
Landing: Read product and tones
Sign Up: 1. Enter email and password
Sign Up: 2. Correct rejected credentials
Login: Switch to Login
Login: Submit returning credentials
Dashboard: 1. Paste customer review
Dashboard: 2. Select tone of reply
Dashboard: 3. Generate AI reply
Dashboard: Read generated reply
Dashboard: Copy to clipboard
Dashboard: Send via WhatsApp
Dashboard: View Starter Plan offer
Dashboard: Press Subscribe Now
Dashboard: 4. See empty-input message
Dashboard: 5. See timeout error state
Dashboard: Retry generation
Landing design preview
Landing: Read product and tones
Sign Up: 1. Enter email and password
Sign Up: 2. Correct rejected credentials
Login: Switch to Login
Login: Submit returning credentials
Dashboard: 1. Paste customer review
Dashboard: 2. Select tone of reply
Dashboard: 3. Generate AI reply
Dashboard: Read generated reply
Dashboard: Copy to clipboard
Dashboard: Send via WhatsApp
Dashboard: View Starter Plan offer
Dashboard: Press Subscribe Now
Dashboard: 4. See empty-input message
Dashboard: 5. See timeout error state
Dashboard: Retry generation