RepPreps AI Business Chatbot

Session 1: Core Widget UI Demo

Click the chat bubble in the bottom-right corner to test the widget

Widget Features

  • ✓Floating bubble button with pulse animation
  • ✓Smooth slide-up chat window animation
  • ✓Responsive mobile (full-screen) & desktop (floating)
  • ✓Message bubbles with timestamps
  • ✓Typing indicator with animated dots
  • ✓Auto-scroll to new messages
  • ✓Keyboard navigation (Enter to send, Esc to close)
  • ✓Character limit counter (200 max)
  • ✓Accessibility with ARIA labels
  • ✓Custom brand colors from config

Pricing Tiers

Basic - $97/mo

100 messages/month, scripted FAQ responses, business hours

Smart - $147/mo (Flagship)

2,000 messages/month, GPT-4 AI, 24/7, CRM integration

Pro - $197/mo

10,000 messages/month, bilingual, custom integrations, priority support

Next Steps: Session 2 will add AI integration, database persistence, and message rate limiting. Session 3 adds lead capture, email notifications, and embeddable widget.

Quality Plumbing Services

This is a demo business website showing how the chatbot widget appears on a client's site. The widget is fixed in the bottom-right corner and doesn't interfere with page content.

Emergency Service

24/7 emergency plumbing repairs

Residential

Complete home plumbing solutions

Commercial

Business plumbing maintenance

Testing Instructions

1. Click the chat bubble to open the widget

2. Type a message and press Enter (or click Send)

3. Watch the typing indicator appear before the bot responds

4. Try resizing your browser to test mobile responsiveness

5. Press Escape to close the chat window

6. Notice the welcome message appears 5 seconds after page load

Note: The bot responses are currently simulated. Real AI integration, database persistence, and Supabase connection will be added in Session 2.