ShopBot Studio

Core User Journey

1. User visits landing page and clicks 'Start Free Trial' → 2. Signs up with Google OAuth via Supabase Auth → 3. Dashboard loads with pre-built Acme Store demo chatbot already answering questions → 4. User clicks 'Create Your Chatbot' and uploads their FAQ PDF → 5. System indexes document into OpenAI vector store (under 30 seconds) → 6. User sets brand hex color, uploads logo, writes greeting message in BrandEditor → 7. User clicks 'Get Script Tag' and copies one line of HTML → 8. User pastes script tag into Shopify theme footer → 9. Widget appears on storefront and correctly answers a test customer question → 10. User receives onboarding email with tips; upgrades to paid plan when free 50-chat limit is reached.

Architecture Pattern

Merchant uploads FAQ file → stored in Supabase Storage → file pushed to OpenAI file_search vector store and file ID saved in Supabase → customer on merchant's site loads widget.js via script tag → widget fetches brand config from public /api/widget/[id] edge endpoint → customer message sent to /api/chat/[chatbotId] → server checks Supabase chat quota, calls OpenAI Assistants API with file_search tool, streams response tokens back to widget → message count incremented in Supabase → Stripe usage metering updated nightly via cron.

Data Model

User: id, email, created_at, stripe_customer_id. Chatbot: id, user_id, name, openai_vector_store_id, openai_assistant_id, is_active. BrandConfig: id, chatbot_id, primary_color, logo_url, greeting_message, widget_position (bottom-right/bottom-left). Document: id, chatbot_id, file_name, file_size_bytes, openai_file_id, uploaded_at. ChatSession: id, chatbot_id, visitor_id, started_at. Message: id, session_id, role (user/assistant), content, created_at. Subscription: id, user_id, stripe_subscription_id, plan (free/starter/growth), chat_quota, chats_used_this_period, period_reset_at. Chatbot belongs to User; Chatbot has one BrandConfig; Chatbot has many Documents; Chatbot has many ChatSessions; ChatSession has many Messages; User has one Subscription.

Integration Points

OpenAI Assistants API (file_search vector store and GPT-4o streaming), Stripe (subscriptions, usage metering, webhook events), Supabase (Postgres DB, Auth, file Storage), Resend (transactional onboarding and quota-warning emails), Vercel Edge Network (low-latency widget config serving), Upstash Redis (per-widget-ID rate limiting at 30 req/min).

V1 Scope Boundaries

V1 includes: FAQ document upload (PDF/DOCX/TXT up to 5MB), OpenAI vector store indexing, GPT-4o streaming chat, brand editor (color/logo/greeting/position), script tag widget deployment, Stripe subscription billing with quota enforcement, basic chat count analytics, Google OAuth, onboarding email. V1 excludes: Shopify App Store native integration, live agent handoff, multi-language UI, team/multi-user accounts, white-label reseller mode, API access for developers, CRM integrations (Gorgias/Zendesk), proactive chat triggers, chat transcript export, A/B testing of bot responses.

Success Definition

A Shopify merchant with zero coding knowledge signs up, uploads a PDF, customizes the widget, copies the script tag, and sees their first real customer chat answered automatically — without contacting founder support.

Challenges

Distribution: ecommerce merchants don't browse Product Hunt — reach them through Shopify app store submission (takes 2–4 weeks review), Facebook Groups like 'Shopify Entrepreneurs' (850k members), and YouTube tutorials targeting 'how to add chatbot to Shopify without coding'. Secondary challenge: trust — merchants are skeptical that a $29/month tool won't embarrass them by giving wrong policy answers; the 'only answers from YOUR documents' guarantee and the pre-loaded demo must do heavy lifting to overcome this objection before the first conversation.

Avoid These Pitfalls

Don't let merchants upload documents larger than 20MB or with 500+ pages in V1 — OpenAI file_search indexing latency will break the 'live in an hour' promise; enforce a 50-page / 5MB limit with a clear, friendly error message that explains the constraint. Don't position this as a general AI chatbot — every piece of copy must say 'answers only from YOUR documents' to differentiate from hallucination-prone general assistants and justify the price to skeptical merchants who have been burned by GPT making up policies. Don't skip quota enforcement on the free tier — without hard chat limits enforced server-side before calling OpenAI, a single high-traffic merchant on the free plan can run up $50+ in API costs in one day; check and decrement quota atomically in the chat API route before every OpenAI call.

Security Requirements

Supabase Auth with Google OAuth for all dashboard access; Row Level Security policies on all Supabase tables scoped to authenticated user_id so merchants can never read each other's data or documents. Widget config endpoint (/api/widget/[id]) is intentionally public read-only and returns only brand config — no document content, no chat history. Chat API route enforces per-widget-ID rate limiting via Upstash Redis at 30 requests/minute to prevent abuse. OpenAI API key and Stripe secret key stored exclusively as Vercel server-side environment variables, never referenced in client-side code or widget.js.

Infrastructure Plan

Vercel Pro for Next.js hosting with Edge Functions serving the widget config endpoint at under 100ms globally; Supabase Pro for Postgres database, Auth, and file Storage with daily automated backups enabled. GitHub Actions CI pipeline runs ESLint, TypeScript type-check, and Playwright smoke test on every PR before merge to main; Vercel preview deployments on every PR for manual QA. Sentry free tier for error tracking with Slack alerts on 5xx spikes; Vercel Analytics for pageview and Web Vitals monitoring.

Performance Targets

500 DAU at launch. Widget config endpoint under 100ms p95 (Vercel Edge). Chat streaming first token under 800ms p95. Widget JS bundle under 15KB gzipped (vanilla JS, no React, no framework). Dashboard page load under 2s on a 4G connection. System handles 500 concurrent chat sessions without API route timeout or Supabase connection pool exhaustion.