fiery-build

bySAGUTURU SAI RAKESH

Build a production-ready MVP for a micro SaaS called Scrabio-style Lead Finder. PRODUCT GOAL Create a Chrome extension + lightweight SaaS backend for agencies that want to find businesses or contractors currently running ads, extract lead details, qualify them, and export them for outreach. CORE PROBLEM SEO agencies, SMMA agencies, freelancers, and lead-gen agencies struggle to find prospects that both: 1. have budget, and 2. are actively spending on marketing. A Reddit founder described a Chrome extension that scrapes businesses and contractors currently running ads and said agencies use it because these companies are more likely to pay for services; the founder reported 10 customers paying $49.99/month, roughly $500 MRR [web:11]. TARGET USERS - SEO agencies - SMMA agencies - freelance marketers - local lead-gen operators - cold email agencies - sales prospecting teams targeting local businesses MAIN USE CASE A user opens a supported source page, clicks the extension, scrapes visible businesses running ads, enriches the data, filters leads, saves selected leads to a dashboard, and exports CSV for outreach. BUILD SCOPE Build: 1. Chrome extension (Manifest V3) 2. Web app dashboard 3. Auth 4. Stripe subscription integration 5. Lead storage 6. CSV export 7. Simple usage limits by plan 8. Clean onboarding 9. Basic admin analytics DO NOT build a fake demo. Build a real MVP architecture with modular code, clear folders, and working flows. TECH STACK Frontend: - Next.js latest stable - TypeScript - Tailwind CSS - shadcn/ui or equivalent clean component system Extension: - Chrome Extension Manifest V3 - TypeScript - React for popup UI - content scripts for scraping - background service worker - message passing between popup/content/background Backend: - Next.js API routes or separate Node backend - PostgreSQL with Prisma ORM - Supabase or Neon acceptable for DB hosting - Clerk or NextAuth for authentication - Stripe for billing - Redis optional for rate limits / job queue INFRASTRUCTURE - Use environment variables - Modular services - Clean README - Database schema - Seed script - Deployment-ready structure PRODUCT NAME Use placeholder brand name: AdProspector POSITIONING “Find businesses already spending on ads.” KEY FEATURES 1. Chrome Extension Scraper - Detect and scrape lead data from supported pages - Extract: - business name - website - phone number - email if visible - category - city/state/country if available - ad platform/source page - source URL - timestamp scraped - Show scrape progress - Let user select/deselect leads before saving - Prevent duplicates - Handle pagination where possible - Show errors gracefully 2. Lead Qualification For each lead, generate fields: - has website: yes/no - website quality score: simple heuristic - has email: yes/no - has phone: yes/no - ad-active flag: yes - niche/category - local business / contractor / ecommerce / service - lead score from 0–100 - suggested pitch angle 3. Dashboard - login/signup - onboarding flow - leads table - filters by niche, location, has phone, has email, source, date - sort by lead score - save notes - mark status: - new - contacted - replied - booked - closed - bulk select - bulk export CSV - search leads - usage meter by subscription plan 4. Subscription Billing Plans: - Starter: $49/month, 500 leads/month - Growth: $99/month, 2500 leads/month - Agency: $199/month, 10000 leads/month Features: - Stripe checkout - customer portal - plan enforcement - free trial optional - webhook handling - billing status in DB 5. Admin - total users - active subscriptions - leads scraped today - MRR estimate - churned users - popular categories - top source pages 6. Outreach Helper For each lead, generate: - one cold email opener - one one-line personalized pitch - one offer suggestion Use rule-based templates first, optional AI provider later. SUPPORTED SOURCES Design the scraper system as adapter-based so new sources can be added easily. Create mock adapters for: - Google search result pages with ad indicators - Google Maps/business listings where ads/sponsored results appear - directory/listing pages - search pages for local service businesses IMPORTANT: Do not hardcode one fragile scraper only. Create a provider/adapter architecture like: - BaseScraper - GoogleSearchAdsScraper - GoogleMapsSponsoredScraper - DirectoryScraper Each adapter should expose: - canHandle(url) - scrape() - normalizeLead() DATA MODEL Create database models such as: - User - Organization - Subscription - Lead - LeadSource - ScrapeSession - UsageEvent - Note - ExportJob - ApiKey optional - AuditLog optional LEAD MODEL FIELDS - id - userId / orgId - businessName - contactName nullable - email nullable - phone nullable - website nullable - category nullable - city nullable - state nullable - country nullable - sourceType - sourceUrl - adPlatform nullable - adDetected boolean - score integer - pitchAngle nullable - status enum - notes - rawData JSON - createdAt - updatedAt SCORING LOGIC Create a simple transparent scoring engine: - +30 if running ads - +15 if website exists - +10 if phone exists - +15 if email exists - +10 if niche is high-value service - +10 if multiple locations - +10 if weak website and strong need for agency help - cap at 100 UI REQUIREMENTS Style: - modern SaaS - minimal - high trust - fast - not overly flashy Pages: - landing page - pricing page - login/signup - onboarding - app dashboard - lead detail drawer/modal - billing settings - help/docs Sections on landing page: - hero with strong problem statement - how it works - sample lead table screenshot mock - who it is for - pricing - FAQ - CTA LANDING PAGE COPY DIRECTION Headline ideas: - Find businesses already spending on ads - Stop cold prospecting random businesses - Discover high-intent local leads for your agency Subheadline: - Scrape, qualify, and export ad-active business leads in minutes CHROME EXTENSION UX Popup should include: - current page supported/not supported - scrape button - progress bar - result count - preview list - save selected leads - open dashboard button Options page: - API connection status - account plan - monthly usage - supported sources - help If scraping unsupported page: - show helpful explanation and supported source list SECURITY - sanitize scraped data - validate API input with Zod - auth guard protected routes - secure Stripe webhooks - rate limit write-heavy endpoints - no secrets in extension bundle - extension authenticates with user token securely - encrypt sensitive tokens if stored LEGAL / COMPLIANCE Add a disclaimer area in settings and docs: - user is responsible for complying with platform terms, privacy law, and outreach regulations - tool only assists with data collection from visible pages - support opt-out and deletion of stored lead records Do not present the product as bypassing any platform restrictions. ANALYTICS Track: - scrape started - scrape completed - leads saved - export generated - subscription created - subscription canceled - dashboard visit - onboarding completed ONBOARDING FLOW Step 1: what type of agency are you? - SEO - SMMA - Web design - Cold email - Lead gen Step 2: target niches Step 3: target geographies Step 4: install extension Step 5: scrape first leads DELIVERABLES I want the output to include: 1. Full folder structure 2. All key source files 3. Database schema 4. Extension manifest 5. Example scraper adapters 6. API routes 7. Landing page 8. Dashboard UI 9. Stripe integration skeleton 10. README with setup instructions 11. Seed/demo data 12. Clean comments where needed OUTPUT FORMAT Return: 1. project architecture overview 2. folder tree 3. important implementation notes 4. then generate the code files CODE QUALITY - production-minded - strongly typed - reusable - minimal duplication - clear naming - no pseudo-code unless clearly marked TODO - use realistic mock data only where external scraping cannot be run in this environment MVP PRIORITY ORDER Phase 1: - auth - extension scaffold - scrape adapters - save leads - dashboard table - CSV export - starter billing Phase 2: - lead scoring - outreach helper - analytics - team/org support Phase 3: - enrichment integrations - AI personalization - CRM integrations SUCCESS CRITERIA A paying user should be able to: - install extension - scrape supported pages - save leads - view them in dashboard - export CSV - stay within plan limits - pay monthly BONUS FEATURES IF TIME ALLOWS - duplicate domain detection - email verification integration hook - webhook to push leads into Google Sheets / Airtable / HubSpot - team seats - saved searches - niche presets like dentists, roofers, lawyers, med spas, plumbers Also provide: - 10 alternative product names - 5 pricing experiments - 7 cold outreach angles agencies can use with scraped leads - 10 SEO keywords to target for content marketing

LandingExtensionOnboardingLogin
Landing

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 4

fiery-build System Requirements Document

1. Introduction

The purpose of this document is to outline the system requirements for the project "fiery-build," specifically focusing on the development of a micro SaaS called "AdProspector." This project aims to create a Chrome extension and a lightweight SaaS backend for agencies to find businesses or contractors currently running ads, extract lead details, qualify them, and export them for outreach.

2. System Overview

The "AdProspector" project is designed to address the challenges faced by SEO agencies, SMMA agencies, freelancers, and lead-gen agencies in finding prospects that have a budget and are actively spending on marketing. The solution includes a Chrome extension for scraping ad-active businesses and a web app dashboard for managing and exporting leads.

3. Functional Requirements as Story Points

  • As an SEO agency, I want to scrape businesses running ads from supported pages to find potential clients.
  • As an SMMA agency, I want to qualify leads based on their ad activity and contact information to prioritize outreach.
  • As a freelance marketer, I want to export qualified leads to a CSV for easy integration into my CRM.
  • As a local lead-gen operator, I want to filter leads by niche and location to target specific markets.
  • As a cold email agency, I want to generate personalized pitch angles for each lead to improve my outreach effectiveness.
  • As a sales prospecting team, I want to track my usage and subscription plan to manage costs effectively.
  • As an admin, I want to view analytics on total users, active subscriptions, and leads scraped to monitor business performance.
Page 2 of 4

4. User Personas

  • SEO Agency: Focuses on improving search engine rankings for clients.
  • SMMA Agency: Specializes in social media marketing and advertising.
  • Freelance Marketer: Independent professional offering marketing services.
  • Local Lead-Gen Operator: Targets local businesses for lead generation.
  • Cold Email Agency: Uses email campaigns to reach potential clients.
  • Sales Prospecting Team: Identifies and engages potential sales leads.

5. Core User Flows

  • User installs the Chrome extension -> Opens a supported source page -> Clicks the extension -> Scrapes visible businesses running ads -> Enriches and filters lead data -> Saves selected leads to a dashboard -> Exports CSV for outreach.
  • Admin logs into the dashboard -> Views analytics on user activity and subscriptions -> Monitors lead scraping performance.

6. Visuals Colors and Theme

  • primary: #1E40AF (Indigo)
  • primary_light: #3B82F6 (Light Blue)
  • secondary: #64748B (Slate Gray)
  • accent: #F59E0B (Amber)
  • highlight: #10B981 (Emerald)
  • bg: #F3F4F6 (Gray-100)
  • surface: #FFFFFF (White)
  • text: #111827 (Gray-900)
  • text_muted: #6B7280 (Gray-500)
  • border: #D1D5DB (Gray-300)
Page 3 of 4

7. Signature Design Concept

The landing page will feature an interactive "Lead Discovery Map" where users can visually explore different regions and industries. As users hover over different areas, dynamic data points representing potential leads will appear, showcasing real-time lead statistics and insights. This map will be built using d3 for data visualization, providing an engaging and informative experience.

Landing Hero Motion Brief

The hero section will depict a transformation of raw data into actionable insights. As users scroll, a stream of data points will flow into a central processing hub, transforming into organized lead cards that expand to reveal detailed information. This animation will be created using motion/react for smooth transitions and interactions.

8. Interaction Model & Motion Direction

  • Interaction Model: Animated
  • The landing page will feature moderate scroll-triggered reveals and hover transitions to enhance user engagement. Interactive elements will have spring physics for a polished feel.

9. Non-Functional Requirements

  • The system must handle up to 10,000 leads per month for the highest subscription plan.
  • The Chrome extension must be lightweight and not significantly impact browser performance.
  • The backend must support concurrent users and maintain a response time of under 200ms for API requests.
Page 4 of 4

10. Tech Stack

  • Frontend: Next.js, TypeScript, Tailwind CSS, shadcn/ui
  • Extension: Chrome Extension Manifest V3, TypeScript, React
  • Backend: Next.js API routes, PostgreSQL with Prisma ORM, Supabase or Neon for DB hosting, Clerk or NextAuth for authentication, Stripe for billing

11. Assumptions and Constraints

  • The system assumes users have a basic understanding of using Chrome extensions.
  • The system will not bypass any platform restrictions or terms of service.
  • The extension will only scrape data from visible web pages.

12. Glossary

  • Lead: A potential client identified through the scraping process.
  • Scrape: The process of extracting data from web pages.
  • CSV: Comma-separated values, a file format for exporting data.
  • MRR: Monthly Recurring Revenue, a measure of predictable revenue.

This document outlines the requirements for the "fiery-build" project, ensuring a comprehensive understanding of the system's functionality and design.

Landing design preview
Landing: View Info
Login: Sign In
Admin Dashboard: View Total Users
Admin Dashboard: View Active Subscriptions
Admin Dashboard: View Leads Scraped Today
Admin Dashboard: View MRR Estimate
Admin Dashboard: View Churned Users
Admin Dashboard: View Popular Categories
Admin Dashboard: View Top Source Pages
Admin Settings: Manage Billing Status
Landing design preview
Landing: View Info
Login: Sign In
Admin Dashboard: View Total Users
Admin Dashboard: View Active Subscriptions
Admin Dashboard: View Leads Scraped Today
Admin Dashboard: View MRR Estimate
Admin Dashboard: View Churned Users
Admin Dashboard: View Popular Categories
Admin Dashboard: View Top Source Pages
Admin Settings: Manage Billing Status