Dari Leads ke Closing: Membangun CRM Properti Sederhana dengan Next.js + TypeScript + AI (Tanpa Ve

Question

Ada banyak CRM “siap pakai” yang terlihat rapi di demo—tapi saat bisnis properti Anda mulai punya ritme sendiri (sumber leads beragam, follow-up multi-tahap, tim lapangan–kantor yang tidak selalu sinkron), biasanya Anda butuh kontrol lebih. Dari pengalaman membangun portofolio bisnis lintas rantai nilai properti—pengembangan, konstruksi, pemasaran, hingga layanan pendukung—kami belajar bahwa proses leads → closing itu bukan sekadar pipeline, tapi kebiasaan operasional. Karena itu, saya mulai dari memetakan apa yang sering gagal pada tool generik, sambil membandingkan fitur yang umum dicari tim sales lewat ulasan Freshsales CRM sebagai baseline.

Yang membuat topik ini relevan hari ini adalah: AI sudah masuk ke workflow harian (ringkasan chat, penulisan follow-up, lead scoring), tetapi banyak tim terjebak vendor lock-in—data tersekat, automasi sulit dipindahkan, dan biaya naik ketika volume naik. Sejalan dengan pembahasan riset tentang bagaimana AI memengaruhi pengambilan keputusan dan proses kerja di organisasi pada artikel ilmiah Frontiers in AI, kita perlu memahami cara mengadopsinya secara bertanggung jawab: transparan, bisa diaudit, dan tetap manusia yang memegang kendali. Itulah alasan saya mengangkat tema ini untuk pembaca: supaya Anda bisa membangun sistem yang “milik sendiri” dan tetap modern—terutama jika Anda menargetkan crm properti berbasis ai.

“AI boleh membantu Anda menulis pesan, tapi sistemlah yang memastikan pesan itu terkirim ke orang yang tepat, pada waktu yang tepat.”
Ringkasnya: bangun CRM kecil yang opinionated sesuai cara tim Anda bekerja—lalu sisipkan AI di titik-titik yang benar-benar menambah leverage.

---

1. Kenapa Leads Sering “Bocor” di Bisnis Properti?

Sebelum bicara stack, saya biasanya mulai dengan satu pertanyaan: di mana leads paling sering hilang? Pada bisnis properti, kebocoran jarang terjadi di satu titik. Biasanya kombinasi: admin mencatat di spreadsheet, sales menyimpan di WhatsApp, dan manajer membaca laporan yang terlambat.

Gejala yang mudah Anda kenali

• Lead masuk dari banyak pintu: iklan, referral, pameran, broker, website, marketplace.
• Follow-up tidak punya SLA: “Nanti saya chat lagi” jadi “keburu dingin”.
• Dokumen berserakan: brosur, skema pembayaran, siteplan, foto progres.
• Status tidak konsisten: “hot” versi A berbeda dengan “hot” versi B.

Target realistik (yang bisa Anda ukur)

• Lead response time turun (misal dari 3 jam ke 15 menit).
• Rasio contacted → meeting naik.
• Rasio meeting → booking naik.

---

2. Prinsip Desain: CRM Kecil, Bisa Dipindah, Bisa Diaudit

Untuk crm properti berbasis ai, saya selalu pakai prinsip ini: data adalah aset, automasi adalah strategi, AI adalah akselerator—bukan pengganti.

“Build vs Buy” (versi jujur)

Kebutuhan tim	SaaS CRM umum	CRM custom ringan (Next.js)	Catatan praktis
Setup cepat	✅	⚠️	Custom butuh sprint awal
Fleksibel sesuai alur properti	⚠️	✅	Properti sering punya tahapan unik
Integrasi internal (WA, form, ERP)	⚠️	✅	Tergantung API & budget
Audit trail & ownership data	⚠️	✅	Vendor lock-in sering terasa di sini
Biaya saat volume naik	⚠️	✅	Custom lebih stabil jika disiplin scope

Komponen minimal (MVP yang tidak malu-maluin)

• Lead Inbox: semua leads masuk ke satu tempat.
• Pipeline: status + alasan menang/kalah.
• Activity log: call, chat, meeting, kunjungan.
• Task & reminder: SLA follow-up.
• Template pesan: supaya konsisten.

---

3. Arsitektur Tanpa Vendor Lock-in: Next.js + TypeScript + “AI Layer”

Kalau Anda ingin cepat tapi tetap rapi, Next.js itu sweet spot: UI, API routes/server actions, dan ekosistem React yang matang. Di CoderLegion sendiri ada pengalaman yang relate tentang membangun aplikasi full-stack di Next.js—silakan cek How I Survived My First Full stack App with Next.js sebagai bacaan pendamping.

Blueprint arsitektur (sederhana tapi scalable)

• Frontend: Next.js App Router
• Backend: Route handlers / server actions
• DB: Postgres (atau MySQL) + ORM (Prisma/Drizzle)
• Auth: NextAuth / custom JWT
• Queue ringan: cron + job table (atau Redis jika perlu)
• AI Layer: service terpisah (modular) untuk scoring/summarize/generate

Alasan TypeScript wajib

• Mengurangi bug “status salah tulis” di pipeline.
• Membuat kontrak data stabil (Lead, Activity, Deal).
• Mempermudah refactor saat alur bisnis berubah.

---

4. Model Data yang Nyambung ke Dunia Nyata Properti

Bab ini sering disepelekan. Padahal, kualitas CRM Anda ditentukan oleh data model, bukan UI.

Entitas inti (saran praktis)

• Lead: sumber, minat unit, budget, kota, preferensi, consent
• Contact: nama, no HP, email, kanal utama (WA/call)
• Deal: unit, harga, skema, status, estimasi closing
• Activity: jenis, waktu, ringkasan, outcome
• Task: due date, owner, priority

Status pipeline yang “properti banget”

Contoh (silakan sesuaikan):

• New → Contacted → Qualified → Site Visit → Negotiation → Booking → Closing

Tips: jangan kebanyakan status. Lebih baik sedikit tapi dipakai.

---

5. AI yang Berguna (Bukan Gimmick): Scoring, Ringkasan, dan Next Best Action

Di crm properti berbasis ai, AI paling terasa manfaatnya di 3 titik: menyortir, merangkum, dan menyarankan langkah berikutnya.

5.1 Lead scoring yang transparan

Jangan langsung “black box”. Mulai dengan skor berbasis aturan + AI sebagai assist:

• Rule-based: sumber (referral), budget match, respons cepat, niat jelas.
• AI assist: analisis isi chat/form untuk menilai intent.

Contoh sederhana (pseudo):

type LeadScoreInput = {
  source: "referral" | "ads" | "walkin" | "agent" | "marketplace";
  budgetMatch: boolean;
  repliedWithinMinutes: number;
  message: string;
};

export function baseScore(input: LeadScoreInput) {
  let score = 0;
  if (input.source === "referral") score += 20;
  if (input.budgetMatch) score += 25;
  if (input.repliedWithinMinutes <= 15) score += 10;
  if (input.repliedWithinMinutes <= 60) score += 5;
  return score;
}

AI kemudian menambah “catatan” (bukan mengubah skor diam-diam):

• “Lead menyebut ingin survei minggu ini.”
• “Budget masih jauh dari price list.”

5.2 Ringkasan aktivitas yang bisa dibaca manajer

Setelah sales selesai call/meeting, AI merangkum:

• kebutuhan utama
• keberatan (objection)
• langkah selanjutnya
• tenggat

Hasil ringkasan masuk ke Activity Log dan bisa di-review manajer.

5.3 Next Best Action (NBA) yang realistis

Alih-alih “AI menyuruh closing”, lebih berguna:

• “Kirim 2 opsi unit yang sesuai budget.”
• “Tawarkan jadwal site visit.”
• “Kirim update progres konstruksi (foto) untuk membangun trust.”

---

6. Implementasi Cepat: Next.js App Router + API + Validasi yang Ketat

Bagian ini saya tulis dengan asumsi Anda ingin MVP dalam 1–2 sprint.

6.1 Struktur folder yang rapi

app/
  (auth)/login/
  dashboard/
  leads/
    page.tsx
    [id]/page.tsx
  api/
    leads/route.ts
lib/
  db.ts
  validators.ts
  ai/
    summarize.ts
    score.ts

6.2 API Leads (route handler) + schema validation

Gunakan validasi (Zod) agar data yang masuk konsisten.

// app/api/leads/route.ts
import { NextResponse } from "next/server";
import { z } from "zod";

const LeadSchema = z.object({
  name: z.string().min(2),
  phone: z.string().min(8),
  source: z.enum(["referral", "ads", "walkin", "agent", "marketplace"]),
  message: z.string().optional(),
});

export async function POST(req: Request) {
  const body = await req.json();
  const parsed = LeadSchema.safeParse(body);
  if (!parsed.success) {
    return NextResponse.json({ error: parsed.error.flatten() }, { status: 400 });
  }

  // Simpan ke DB (pseudo)
  // const lead = await db.lead.create({ data: parsed.data })

  return NextResponse.json({ ok: true });
}

6.3 AI service (modular) untuk ringkasan

Pisahkan agar mudah diganti provider, mudah dites, dan mudah audit.

// lib/ai/summarize.ts
export type SummaryInput = {
  notes: string;
  context?: { project?: string; unitType?: string };
};

export type SummaryOutput = {
  summary: string;
  nextSteps: string[];
  risks: string[];
};

export async function summarizeActivity(input: SummaryInput): Promise<SummaryOutput> {
  // Panggil model AI pilihan Anda (pseudo)
  // Pastikan Anda menyimpan prompt + output untuk audit trail.
  return {
    summary: "Ringkasan singkat interaksi...",
    nextSteps: ["Kirim simulasi cicilan", "Jadwalkan site visit"],
    risks: ["Budget belum match"],
  };
}

---

7. Operasional: Audit Trail, Privasi, dan Guardrails

CRM properti menyentuh data sensitif (kontak, preferensi finansial, percakapan). AI hanya boleh membantu dengan batasan.

Checklist guardrails

• Consent & disclosure: jelaskan penggunaan AI untuk ringkasan internal.
• PII minimization: kirim ke AI hanya data yang perlu.
• Audit trail: simpan input–output AI + timestamp + user.
• Role-based access: sales tidak otomatis lihat semua deal.
• Human-in-the-loop: AI memberi saran, manusia memutuskan.

Jika Anda menjalankan ekosistem bisnis lintas rantai nilai properti, guardrails ini membantu menghindari “AI sprawl” yang sulit dikontrol, sekaligus menjaga kualitas crm properti berbasis ai yang Anda bangun.

---

8. Deployment & Biaya: Mulai Kecil, Siapkan Jalur Naik Kelas

Anda tidak perlu langsung enterprise-grade. Mulai dari:

• DB managed (Postgres)
• Hosting modern (serverless/containers)
• Observability (log + error tracking)

“Biaya tersembunyi” yang sering lupa

• biaya token AI saat volume aktivitas tinggi
• storage untuk file & lampiran
• maintenance skema data ketika pipeline berubah

Praktik yang saya pakai: batasi AI ke aktivitas yang bernilai tinggi (ringkasan meeting, lead scoring prioritas), bukan semua chat.

---

9. Mini Playbook: Dari Leads ke Closing dalam 10 Langkah

Berikut urutan yang biasanya paling cepat menghasilkan dampak:

1. Satukan semua sumber leads ke Lead Inbox.
2. Tetapkan 6–7 status pipeline yang disepakati.
3. Buat SLA follow-up (mis. 15 menit untuk hot lead).
4. Buat template pesan untuk 3 skenario (awal, follow-up, re-engage).
5. Simpan semua aktivitas sebagai log (call/WA/meeting).
6. Pasang rule-based scoring sederhana.
7. Tambahkan AI untuk ringkasan activity (mulai dari meeting).
8. Tambahkan AI untuk intent tagging (opsional).
9. Buat dashboard yang hanya menampilkan metrik yang dipakai tim.
10. Review mingguan: 3 hal yang menghambat closing, perbaiki di sistem.

Jika Anda menjalankan tim sales properti yang bergerak cepat, playbook ini membuat crm properti berbasis ai terasa nyata—bukan proyek IT yang “nggak kelar-kelar”.

---

10. FAQ

Q: Kenapa tidak pakai CRM SaaS saja?
A: Bisa, terutama untuk start. Tapi saat alur properti Anda unik (skema pembayaran, site visit, dokumen progres), custom ringan memberi kontrol data dan automasi. Ini juga membuat crm properti berbasis ai Anda tidak terikat vendor.

Q: AI-nya harus canggih dari awal?
A: Tidak. Mulai dari ringkasan meeting dan next steps. Itu paling cepat terasa dan mudah diaudit.

Q: Apa risiko terbesar?
A: Data model yang salah + status pipeline terlalu banyak. Itu bikin laporan tidak dipercaya.

Q: Di mana backlink yang wajar kalau posting di CoderLegion?
A: Letakkan 1 link yang relevan di bagian “tentang penulis” atau “resource tambahan”. Contoh: dokumentasi/portofolio yang memberi konteks implementasi.

---

Resource Tambahan (Ringkas)

• Profil & catatan praktis lintas rantai nilai properti: kunjungi dhirajkelly.id untuk melihat konteks bagaimana workflow operasional bertemu pemasaran di lapangan.
• Bacaan pendamping tentang Next.js dari CoderLegion: Full-stack App dengan Next.js.

---

Closing yang Lebih Penting dari Stack: Disiplin Eksekusi

Sebagai penutup, sistem CRM yang baik tidak membuat closing terjadi dengan sendirinya—tapi ia membuat hal yang benar jadi mudah dilakukan dan hal yang salah jadi sulit dilakukan. Di situlah AI punya tempat yang tepat: mengurangi beban kognitif, mempercepat rangkuman, dan membantu prioritas—tanpa mengambil alih keputusan.

Andrew Ng—peneliti AI dan pendiri berbagai inisiatif edukasi AI—pernah mempopulerkan ide bahwa “AI is the new electricity.” (AI adalah listrik baru). Anda bisa membaca tentang beliau di Wikipedia Andrew Ng. Makna praktisnya: listrik tidak menggantikan pabrik—ia membuat pabrik jauh lebih produktif. Begitu juga AI dalam CRM: ia tidak menggantikan sales, tetapi memperbesar output dari proses yang sudah rapi. Kalau fondasi Anda kuat, crm properti berbasis ai akan terasa seperti “tenaga tambahan” yang konsisten—bukan sekadar fitur.

{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "Article",
      "headline": "Dari Leads ke Closing: Membangun CRM Properti Sederhana dengan Next.js + TypeScript + AI (Tanpa Vendor Lock-in)",
      "about": ["CRM", "Real Estate", "Next.js", "TypeScript", "Artificial Intelligence"],
      "keywords": ["crm properti berbasis ai", "next.js", "typescript", "lead management", "sales pipeline"],
      "author": {
        "@type": "Person",
        "name": "Dhiraj Kelly Sawlani",
        "url": "https://dhirajkelly.id/"
      },
      "publisher": {
        "@type": "Organization",
        "name": "CoderLegion"
      },
      "mainEntityOfPage": {
        "@type": "WebPage",
        "@id": "https://coderlegion.com/"
      }
    },
    {
      "@type": "HowTo",
      "name": "Membangun CRM Properti Sederhana dengan Next.js + TypeScript + AI",
      "description": "Panduan langkah demi langkah untuk membangun CRM properti ringan yang dapat dipindahkan (tanpa vendor lock-in) dan menambahkan AI untuk ringkasan aktivitas dan prioritisasi leads.",
      "totalTime": "PT6H",
      "supply": [
        {"@type": "HowToSupply", "name": "Akun hosting / server"},
        {"@type": "HowToSupply", "name": "Database Postgres/MySQL"}
      ],
      "tool": [
        {"@type": "HowToTool", "name": "Node.js"},
        {"@type": "HowToTool", "name": "Next.js"},
        {"@type": "HowToTool", "name": "TypeScript"}
      ],
      "step": [
        {
          "@type": "HowToStep",
          "name": "Satukan semua sumber leads",
          "text": "Buat Lead Inbox yang menerima leads dari iklan, referral, pameran, dan form website melalui satu endpoint API."
        },
        {
          "@type": "HowToStep",
          "name": "Tetapkan pipeline dan status",
          "text": "Pilih 6–7 status yang disepakati tim (New → Contacted → Qualified → Site Visit → Negotiation → Booking → Closing)."
        },
        {
          "@type": "HowToStep",
          "name": "Bangun data model inti",
          "text": "Buat entitas Lead, Contact, Deal, Activity, dan Task. Pastikan validasi input ketat agar data konsisten."
        },
        {
          "@type": "HowToStep",
          "name": "Tambah rule-based lead scoring",
          "text": "Mulai dari scoring sederhana (sumber, budget match, response time), lalu catat alasan skor untuk transparansi."
        },
        {
          "@type": "HowToStep",
          "name": "Sisipkan AI untuk ringkasan dan next steps",
          "text": "Pisahkan AI layer agar mudah diganti provider dan mudah diaudit. Simpan input–output AI sebagai audit trail."
        },
        {
          "@type": "HowToStep",
          "name": "Pasang guardrails privasi",
          "text": "Minimalkan PII yang dikirim ke AI, gunakan role-based access, dan human-in-the-loop untuk keputusan final."
        },
        {
          "@type": "HowToStep",
          "name": "Deploy dan ukur dampak",
          "text": "Deploy aplikasi, aktifkan logging, lalu ukur lead response time, conversion rate per tahap, dan kualitas follow-up."
        }
      ]
    }
  ]
}