Skip to content

Lead Intake and Follow-Up

2026

Live Demo

LeadFlowAI

A lead intake demo for a home services business. Customers send enquiries and review quotes in a portal; staff review AI-drafted replies, send quotes and keep follow-ups on today's desk.

Open live demo(opens in a new tab)All projects
Role
Full-stack developer
Views
Employee desk, customer portal, intake
Stack
Next.js · TypeScript
AI
Mocked drafts, human-approved
leadflowai.cjv.app
LeadFlowAI interface

Recorded from the updated review demoFictional data only

03 — Story

The problem.

Inbound leads often arrive as messy notes, calls, forms, and messages. Teams need help turning that raw context into a clear pipeline, but AI only helps when it is attached to a review process for quoting and follow-up.

Built for
Small service businesses and sales teams that receive enquiries from multiple channels and need a more consistent follow-up process.

What I built.

I built a demo that treats AI as support for the human review step, and shows both sides of the same enquiry: the customer's portal and the employee's desk.

  • 01

    Public Intake Form

    Customers describe the job, pick a service and urgency, and say how they want to be contacted.

  • 02

    Human Review of AI Drafts

    Each enquiry gets a mocked classification, scores and a suggested reply. A person edits and approves the draft; nothing is sent.

  • 03

    Quotes and Follow-Ups

    Staff build and send quotes, customers accept or decline them, and follow-ups land on today's desk.

  • 04

    Customer Portal

    Switch views to see the same enquiry from the customer's side: status, quotes with a PDF, and a conversation with the team.

  • 05

    Live Demo

    Hosted on self-hosted Coolify with a dedicated public HTTPS domain.

  • 06

    Useful Client Pattern

    Shows how AI can support an existing sales process instead of being added for show.

04 — Screens

Screens that matter.

The main view, the deeper work screens, and the handoff or customer-facing state. Select any screen to see it full size.

01 / 04

Employee Desk

Today's desk: enquiries that need attention with the next step for each, today's follow-ups, and quotes awaiting a reply.

02 / 04

Enquiry Review

Lead details, the mocked AI suggestion with its scores and next action, and the human review panel where a reply draft is approved without sending anything.

03 / 04

Customer Portal

The same enquiry from the customer's side: its status, quotes to accept or decline, and a conversation with the team.

04 / 04

Public Intake Form

The enquiry form customers fill in: service, urgency, preferred contact, postcode and a description of the job.

01 / 04Employee Desk

LeadFlowAI: Employee Desk

Today's desk: enquiries that need attention with the next step for each, today's follow-ups, and quotes awaiting a reply.

05 — Under the hood

How it fits together.

  1. 01

    Browser

    Employee workspace, customer portal and intake form

  2. 02

    Next.js App Router

    React · TypeScript · Recharts

  3. 03

    Lead logic

    Matching · status rules · mocked AI drafts · quotes and follow-ups

  4. 04

    Demo data

    Fictional pipeline in a private per-visitor session, resettable

Docker container on self-hosted CoolifyA Prisma schema models the same data for PostgreSQL in a production version.

Approach

  1. 01

    Modelled a fictional home services pipeline with enquiries, customers, services, quotes, follow-ups and review states.

  2. 02

    Designed the assisted review around useful context: the mocked AI suggestion, its scores and next action sit beside the lead, and a person approves the reply draft.

  3. 03

    Built the customer portal and the employee desk on the same data, with a view switcher so a visitor can follow one enquiry from both sides.

  4. 04

    Kept each visitor in a private demo session with fictional data only; CRM sync, email sending and model-provider calls are future production work.

Build notes

Project Type
Lead intake demo
Primary Workflow
Lead intake to assisted review and follow-up
Data Mode
Fictional demo data in a private per-visitor session
Deployment
Docker and self-hosted Coolify

Stack

Frontend

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • Recharts

App Logic

  • Lead Rules
  • Mocked AI Suggestions
  • Review States

Data

  • Seeded Demo Data
  • PostgreSQL-Ready Prisma Schema

Infra

  • Docker
  • Coolify

06 — Next project

Trading Research System

Forge

Read the case study

Interested?

Want something like LeadFlowAI for your team?

Get in touch