Skip to main content

Command Palette

Search for a command to run...

How I Built an AI-Powered Lead Capture System?

A practical breakdown of how I built a smart lead capture system using AI, n8n, and Next.js

Updated
5 min read
How I Built an AI-Powered Lead Capture System?
N
Hi there! I'm a Full-Stack Developer and AI Automation Engineer crafting innovative web applications and automation workflows that saves time, reduces effort, scale your growth, and drive real results.

How I Built an AI-Powered Lead Capture System

Every lead matters. Are you capturing all of them?


Every Lead Matters. Are You Capturing All of Them?

Picture this.

It's 2am. Someone visits your website, fills out your contact form, and waits for a response.

But you're asleep.

By morning — they've already hired someone else.

This is the silent killer of freelance businesses. And it happened to me. Until I built a system that never sleeps.


The Problem I Was Trying to Solve

As a freelancer, I was:

  • ❌ Manually checking emails every few hours
  • ❌ Forgetting to follow up with leads
  • ❌ Losing potential clients to slow response times
  • ❌ Spending hours on tasks that should take seconds

I needed a system that would capture every lead, respond instantly, and never miss a follow-up — without me being online 24/7.

So I built one.


What I Built

A fully automated AI-powered lead capture system that:

Visitor fills contact form
          ↓
Lead is instantly saved to database
          ↓
AI generates a personalized response
          ↓
Welcome email sent automatically
          ↓
Lead added to CRM
          ↓
I get notified on my phone

All of this happens in under 30 seconds. Automatically.


Tech Stack

Here's everything I used:

Tool Purpose
Next.js Frontend + API Routes
MongoDB Lead storage
n8n Automation workflows
OpenAI API AI response generation
Resend Email delivery
Slack Real-time notifications

Step 1 — Build the Contact Form

First, I built a simple contact form in Next.js that captures:

// /app/api/contact/route.js
import connectDB from '@/lib/mongodb'
import Lead from '@/models/Lead'

export async function POST(req) {
  const { name, email, message } = await req.json()
  
  await connectDB()
  
  // Save lead to database
  await Lead.create({
    name,
    email,
    message,
    createdAt: new Date()
  })

  // Trigger n8n webhook
  await fetch(process.env.N8N_WEBHOOK_URL, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ name, email, message })
  })

  return Response.json({ success: true })
}

Step 2 — Create the Lead Model

// /models/Lead.js
import mongoose from 'mongoose'

const LeadSchema = new mongoose.Schema({
  name: { type: String, required: true },
  email: { type: String, required: true },
  message: { type: String, required: true },
  responded: { type: Boolean, default: false },
  createdAt: { type: Date, default: Date.now }
})

export default mongoose.models.Lead || 
  mongoose.model('Lead', LeadSchema)

Step 3 — Build the n8n Workflow

This is where the magic happens. My n8n workflow has 4 nodes:

Node 1 — Webhook Trigger:

Receives data from Next.js API
Fields: name, email, message

Node 2 — OpenAI Node:

Prompt:
"Write a short, friendly, professional email response 
for a freelancer named Naveen to a potential client 
named {{ $json.name }} who sent this message: 
{{ $json.message }}. 
Keep it under 100 words. Sign off as Naveen."

Node 3 — Resend Email Node:

To      → {{ $json.email }}
Subject → "Re: Your message — Naveen Gautam"
Body    → {{ $json.openai_response }}

Node 4 — Slack Notification:

🔥 New Lead!
Name: {{ $json.name }}
Email: {{ $json.email }}
Message: {{ $json.message }}

Step 4 — AI Response Generation

The most powerful part of this system is the AI-generated response. Instead of sending a generic "Thanks for reaching out" email — the AI reads the client's message and writes a personalized, context-aware reply.

Here's an example:

Client message:

"Hi, I need a website for my restaurant. 
Budget is around $500. Can you help?"

AI generated response:

"Hi Sarah,

Thanks for reaching out! A restaurant website at $500 
is absolutely doable. I'd love to understand more about 
your vision — menu pages, online reservations, or 
something else?

Let's jump on a quick call this week. 
What time works for you?

— Naveen"

Personal. Professional. Instant.


Step 5 — Connect Everything

Add these to your .env.local:

MONGODB_URI=your_mongodb_uri
N8N_WEBHOOK_URL=your_n8n_webhook_url
OPENAI_API_KEY=your_openai_key
RESEND_API_KEY=your_resend_key

The Results

After running this system for 30 days:

📈 Response time      → From hours to 30 seconds
📈 Lead response rate → Increased by 80%
📈 Client conversions → 3x more replies
⏰ Time saved          → 2+ hours every day

What I Learned

Building this system taught me 3 important things:

1. Speed wins — The faster you respond, the higher your chances of closing the deal.

2. Personalization matters — A generic response gets ignored. An AI-personalized response gets replies.

3. Automation is not laziness — It's intelligence. The best businesses run on systems, not hustle.


You Can Build This Too

This entire system took me less than a day to build. And now it works for me every single day — whether I'm working, sleeping, or on vacation.

The goal isn't to work harder. It's to build systems that work harder for you.


What's Next?

Want to take this further? Here's what I'm adding next:

  • 🤖 AI chatbot on the website for instant visitor engagement
  • 📊 Lead scoring system — prioritize high-value clients
  • 📅 Automatic calendar booking — let clients schedule calls directly
  • 💬 WhatsApp notifications — get alerted on the go

Building something similar? Have questions? Drop a comment below — I read every single one.