HubSpot + AI Presentation: Playbook Otomasi Sales Deck (2026)

Untuk tim penjualan yang menggunakan HubSpot di tahun 2026, ROI dari mengotomasi sales deck per akun terukur: penghematan waktu rata-rata AE sebesar 2–4 jam per minggu, peningkatan 12–18% dalam progres meeting-ke-meeting, dan pengurangan 30-60% dalam variasi persiapan deck di seluruh tim. Workflow HubSpot + 2Slides 2026 menghasilkan sales deck yang sepenuhnya dipersonalisasi untuk akun mana pun menggunakan data yang sudah ada di HubSpot (perusahaan, tahap deal, minat produk, kontak champion, alternatif kompetitor) melalui tiga jalur integrasi: HubSpot Workflow → Webhook → 2Slides API; HubSpot App Card khusus dengan tombol Generate Deck; batch terjadwal harian untuk semua deal dalam tahap tertentu. Playbook ini mencakup payload webhook yang tepat, template prompt yang mengubah field HubSpot menjadi konten deck, dan alur 2Slides API (generate → jobs/:id → download) yang digunakan oleh tim RevOps nyata dalam produksi saat ini.

Jika Anda mengelola revenue operations untuk tim penjualan di HubSpot, Anda sudah tahu masalahnya: setiap AE meminta marketing atau sales enablement untuk "sedikit penyesuaian" pada deck sebelum panggilan berikutnya. Kalikan dengan empat puluh rep dan tiga ratus deal yang berjalan, dan Anda memiliki pekerjaan penuh waktu menempelkan template Google Slides ke data CRM ala Salesforce — kecuali Anda menggunakan HubSpot, yang tidak memiliki padanan asli dari modul Document Generation milik Salesforce.

Playbook ini menunjukkan cara menghubungkan HubSpot ke 2Slides V1 API sehingga deal apa pun di tahap mana pun dapat menghasilkan sales deck yang dipersonalisasi, konsisten dengan brand, dan siap channel — tanpa manusia menyentuh slide master. Pola di bawah ini digunakan oleh tim RevOps di perusahaan B2B SaaS, cybersecurity, dan enterprise AI untuk mendorong nilai kontrak rata-rata dari $40K hingga $400K+.

Mengapa Deck yang Digerakkan HubSpot Menang

Justifikasi bisnis untuk mengotomatisasi deck penjualan dari HubSpot berasal dari tiga pengungkit yang terukur.

Pengungkit 1: Waktu AE yang terhemat. Observasi internal di seluruh pelanggan 2Slides dengan deployment 20+ seat menunjukkan bahwa account executive menghabiskan 2–4 jam per minggu untuk kustomisasi deck — menulis ulang slide intro, memperbarui logo, menempelkan kelemahan kompetitor, mengganti ROI calculator. Dengan biaya AE fully loaded sebesar $160K/tahun, itu berarti $6.400–$12.800 per AE per tahun dalam tenaga kerja slide murni. Untuk tim penjualan 40 orang, Anda melihat kapasitas yang terhemat sebesar $256K/tahun secara konservatif.

Pengungkit 2: Konversi meeting-ke-meeting. Deck yang dihasilkan dari data CRM live — artinya revenue band aktual perusahaan, jabatan aktual champion, kompetitor yang benar-benar terdaftar dalam deal record — mengonversi booking meeting berikutnya 12–18% lebih tinggi dibandingkan deck template generik. Alasannya sederhana: spesifisitas menandakan kesiapan, dan kesiapan menandakan bahwa seorang salesperson layak mendapat meeting kedua.

Pengungkit 3: Pengurangan varians. AE kuartil teratas Anda membuat deck yang bagus. Kuartil terbawah Anda membuat deck biasa-biasa saja yang membocorkan pipeline. Otomatisasi menarik yang terbawah ke atas. Dalam data kohort, tim RevOps yang menjalankan pembuatan deck yang dipicu HubSpot melaporkan pengurangan 30–60% dalam varians kualitas deck yang diukur dengan skor QA manajer.

Pola umum di ketiga hal tersebut: deck bukanlah produknya, prep adalah produknya. Mengotomatisasi prep adalah langkah leverage tertinggi yang dapat dilakukan RevOps di 2026. Untuk pandangan lebih mendalam tentang sisi enablement, lihat panduan kami tentang cara membuat sales enablement deck dengan AI.

Arsitektur HubSpot + 2Slides 2026

Sebelum menyelami setiap metode, berikut adalah arsitektur yang diikuti oleh setiap implementasi:

HubSpot CRM (deals, companies, contacts)
        │
        ├── Trigger (workflow, app card, cron)
        │
        ▼
  Transformer Layer (serverless fn / Zapier / Make)
        │  - Membangun prompt dari field CRM
        │  - Memanggil 2Slides V1 API
        │
        ▼
  2Slides V1 API
        ├── POST /api/v1/slides/generate    (mengembalikan jobId)
        ├── GET  /api/v1/jobs/{id}          (polling hingga status = success)
        └── GET  /api/v1/slides/download-slides-pages-voices  (URL aset)
        │
        ▼
  Delivery (kembali ke deal HubSpot sebagai catatan, email ke AE, Slack DM)

2Slides API bersifat stateless per job, asinkron, dan diukur berdasarkan kredit. Anda melakukan autentikasi dengan header API key

x-api-key: sk-2slides-...

. Setiap pembuatan deck mengembalikan

jobId

secara langsung, dan Anda melakukan polling

/api/v1/jobs/{id}

hingga status berubah dari

pending

→

processing

→

success

. Setelah berhasil, Anda mengambil PPTX, PDF final, atau URL aset per halaman.

Metode 1: HubSpot Workflow → Webhook → 2Slides API

Ini adalah jalur integrasi yang paling umum. HubSpot Workflow memantau perubahan tahap pada pipeline deal dan mengirimkan webhook ke fungsi serverless yang berkomunikasi dengan 2Slides API.

Langkah 1: Buat HubSpot Workflow

Di HubSpot, buka Automation → Workflows → Create workflow → Deal-based. Atur trigger pendaftaran:

Filter:
Deal stage
adalah salah satu dari
Discovery Complete
,
Demo Scheduled
,
Proposal Sent
Re-enrollment: diaktifkan saat perubahan tahap

Tambahkan aksi Send webhook:

Method:
POST
URL:
https://your-revops-fn.vercel.app/api/hubspot/generate-deck
Sertakan grup properti
deal
,
associated company
, dan
primary contact

Langkah 2: Fungsi Transformer

Deploy ini ke Vercel, Cloudflare Workers, atau AWS Lambda. Fungsi ini menerima webhook HubSpot, menyusun prompt 2Slides, dan memulai pembuatan.

// /api/hubspot/generate-deck.ts
export async function POST(req: Request) {
  const payload = await req.json()
  const deal = payload.properties
  const company = payload.associations?.company?.properties ?? {}
  const contact = payload.associations?.contact?.properties ?? {}

  const prompt = buildDeckPrompt({ deal, company, contact })

  const generateRes = await fetch('https://2slides.com/api/v1/slides/generate', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'x-api-key': process.env.TWOSLIDES_API_KEY!,
    },
    body: JSON.stringify({
      prompt,
      slide_count: 12,
      language: 'en',
      aspect_ratio: '16:9',
      theme_id: process.env.BRAND_THEME_ID, // tema brand terkunci Anda
      metadata: {
        hubspot_deal_id: deal.hs_object_id,
        account: company.name,
      },
    }),
  })

  const { jobId } = await generateRes.json()

  // Simpan asosiasi jobId -> deal untuk pencarian nanti
  await kv.set(`deal:${deal.hs_object_id}:job`, jobId, { ex: 86400 })

  return Response.json({ ok: true, jobId })
}

Langkah 3: Polling dan Pengiriman

Fungsi kedua (dipanggil oleh Vercel Cron setiap 90 detik, atau oleh entri ulang workflow HubSpot yang tertunda) melakukan polling

/api/v1/jobs/{id}

dan, jika berhasil, menulis URL deck kembali ke deal sebagai catatan engagement:

const jobRes = await fetch(`https://2slides.com/api/v1/jobs/${jobId}`, {
  headers: { 'x-api-key': process.env.TWOSLIDES_API_KEY! },
})
const job = await jobRes.json()

if (job.status === 'success') {
  const assets = await fetch(
    `https://2slides.com/api/v1/slides/download-slides-pages-voices?jobId=${jobId}`,
    { headers: { 'x-api-key': process.env.TWOSLIDES_API_KEY! } }
  ).then(r => r.json())

  await hubspotClient.crm.objects.notes.basicApi.create({
    properties: {
      hs_note_body: `Fresh deck ready: ${assets.pptx_url}`,
      hs_timestamp: Date.now(),
    },
    associations: [{ to: { id: deal.hs_object_id }, types: [{ category: 'HUBSPOT_DEFINED', typeId: 214 }] }],
  })
}

Ini adalah pola yang sama yang kami gunakan dalam otomasi laporan mingguan Zapier — panggilan generate, polling, pengiriman — hanya dipasang melalui HubSpot alih-alih Zapier.

Metode 2: Kartu Aplikasi HubSpot dengan Tombol Generate Deck

Metode 1 bersifat otomatis. Metode 2 adalah on-demand: AE membuka deal di HubSpot, melihat kartu kustom di sidebar kanan, mengklik Generate Deck, dan deck masuk ke inbox mereka dua menit kemudian.

Ini menggunakan UI Extension HubSpot (bagian dari platform Developer Projects).

Kode UI Extension

// src/app/extensions/DealDeckCard.tsx
import {
  hubspot,
  Button,
  Flex,
  Text,
  Alert,
  LoadingSpinner,
} from '@hubspot/ui-extensions'
import { useState } from 'react'

hubspot.extend(({ context, runServerlessFunction }) => (
  <DeckCard context={context} runServerless={runServerlessFunction} />
))

function DeckCard({ context, runServerless }) {
  const [state, setState] = useState<'idle' | 'working' | 'done' | 'error'>('idle')
  const [deckUrl, setDeckUrl] = useState<string | null>(null)

  async function onClick() {
    setState('working')
    const { response } = await runServerless({
      name: 'generateDeck',
      parameters: { dealId: context.crm.objectId },
    })
    if (response.deckUrl) {
      setDeckUrl(response.deckUrl)
      setState('done')
    } else {
      setState('error')
    }
  }

  return (
    <Flex direction="column" gap="sm">
      <Text>Generate deck penjualan yang dipersonalisasi untuk akun ini menggunakan 2Slides.</Text>
      {state === 'idle' && <Button onClick={onClick}>Generate Deck</Button>}
      {state === 'working' && <LoadingSpinner label="Membuat deck (90–120 detik)" />}
      {state === 'done' && deckUrl && (
        <Alert title="Deck siap">
          <a href={deckUrl} target="_blank" rel="noreferrer">Buka deck</a>
        </Alert>
      )}
      {state === 'error' && <Alert variant="danger">Pembuatan gagal — periksa log RevOps.</Alert>}
    </Flex>
  )
}

Fungsi Serverless Pendamping

Fungsi serverless yang direferensikan di atas (

generateDeck

) berada dalam proyek aplikasi HubSpot yang sama dan memanggil alur

/api/v1/slides/generate

/api/v1/jobs/{id}

yang sama seperti Metode 1, tetapi memblokir hingga job berhasil (atau timeout) sebelum mengembalikan URL deck ke kartu.

// src/app/app.functions/generateDeck.js
exports.main = async (context) => {
  const { dealId } = context.parameters
  const deal = await hubspotFetchDeal(dealId)
  const prompt = buildDeckPrompt(deal)

  const gen = await fetch('https://2slides.com/api/v1/slides/generate', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json', 'x-api-key': process.env.TWOSLIDES_API_KEY },
    body: JSON.stringify({ prompt, slide_count: 12, theme_id: process.env.BRAND_THEME_ID }),
  }).then(r => r.json())

  // Poll hingga 3 menit
  for (let i = 0; i < 36; i++) {
    await new Promise(r => setTimeout(r, 5000))
    const job = await fetch(`https://2slides.com/api/v1/jobs/${gen.jobId}`, {
      headers: { 'x-api-key': process.env.TWOSLIDES_API_KEY },
    }).then(r => r.json())
    if (job.status === 'success') {
      return { deckUrl: job.result?.pptx_url }
    }
    if (job.status === 'failed') throw new Error(job.error || 'generation failed')
  }
  throw new Error('timeout')
}

Pola ini — objek CRM → kartu extension → panggilan API → hasil inline — adalah pendekatan yang sama yang digunakan tim marketing saat mereka menskalakan produksi konten; lihat bagaimana tim marketing menjalankan deck presentasi AI dalam skala besar.

Metode 3: Pembuatan Batch Terjadwal

Tidak setiap deck perlu dibuat secara on-demand. Untuk tinjauan pipeline yang dapat diprediksi — setiap Senin pagi, setiap quarterly business review, setiap refresh tahapan MEDDPICC — batch yang dijadwalkan dengan cron lebih murah dan lebih andal dibandingkan webhook real-time.

Polanya

Jalankan job malam hari yang mengquery HubSpot untuk setiap deal di tahap target, membuat deck baru untuk masing-masing, dan mengirim email berisi ringkasan pagi ke AE.

// /api/cron/nightly-deck-refresh.ts
export const runtime = 'nodejs'
export const maxDuration = 300

export async function GET(req: Request) {
  // Vercel Cron guards dengan CRON_SECRET
  if (req.headers.get('authorization') !== `Bearer ${process.env.CRON_SECRET}`) {
    return new Response('Unauthorized', { status: 401 })
  }

  const deals = await hubspotClient.crm.deals.searchApi.doSearch({
    filterGroups: [{
      filters: [
        { propertyName: 'dealstage', operator: 'EQ', value: 'proposal_sent' },
        { propertyName: 'hs_lastmodifieddate', operator: 'GT', value: String(Date.now() - 86400000) },
      ],
    }],
    properties: ['dealname', 'amount', 'competitor', 'product_interest', 'champion_title'],
    limit: 100,
  })

  const jobs = await Promise.all(deals.results.map(async (deal) => {
    const prompt = buildDeckPrompt(deal)
    const res = await fetch('https://2slides.com/api/v1/slides/generate', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json', 'x-api-key': process.env.TWOSLIDES_API_KEY! },
      body: JSON.stringify({ prompt, slide_count: 10, theme_id: process.env.BRAND_THEME_ID }),
    }).then(r => r.json())
    return { dealId: deal.id, jobId: res.jobId, owner: deal.properties.hubspot_owner_id }
  }))

  await enqueueDeliveryJobs(jobs) // SQS / Upstash QStash / Trigger.dev
  return Response.json({ enqueued: jobs.length })
}

Jadwalkan di

vercel.json

{
  "crons": [
    { "path": "/api/cron/nightly-deck-refresh", "schedule": "0 6 * * 1-5" }
  ]
}

Jam enam pagi, hari kerja. AE membuka email, deck sudah menunggu.

Template Prompt yang Mengubah Field CRM Menjadi Konten Deck

Penentu terbesar kualitas deck adalah prompt. Prompt yang baik menyandikan apa yang akan dikatakan seorang AE senior kepada karyawan baru: "ketika perusahaan adalah X, dengan champion di posisi Y, fokus pada outcome Z, bangun deck seperti ini." Template siap pakai:

function buildDeckPrompt({ deal, company, contact }: Ctx) {
  return `
Generate a 10-12 slide sales deck for a B2B software evaluation.

ACCOUNT CONTEXT
- Company: ${company.name}
- Industry: ${company.industry ?? 'unspecified'}
- Annual revenue band: ${company.annualrevenue ?? 'unspecified'}
- Employees: ${company.numberofemployees ?? 'unspecified'}
- Website: ${company.domain}

DEAL CONTEXT
- Deal stage: ${deal.dealstage}
- Deal amount: $${deal.amount}
- Product interest: ${deal.product_interest}
- Priority use case: ${deal.primary_use_case}
- Competitor shortlist: ${deal.competitors /* comma-separated */}
- Evaluation timeline: ${deal.close_date}

CHAMPION CONTEXT
- Name: ${contact.firstname} ${contact.lastname}
- Title: ${contact.jobtitle}
- Reported priorities: ${contact.priorities}

DECK STRUCTURE
1. Title slide — "${company.name} × <Your Brand>: ${deal.primary_use_case}"
2. Their world today — 3 bullets, specific to ${company.industry}
3. The cost of doing nothing — quantify using ${company.annualrevenue} band
4. Our approach — 3 pillars aligned to ${deal.primary_use_case}
5. Proof — 2 case studies from ${company.industry} (or adjacent)
6. Differentiation vs ${deal.competitors} — see battlecard section below
7. Implementation plan — 30/60/90 tuned to ${deal.close_date}
8. Commercial summary — range anchored to $${deal.amount}
9. Risks and mitigations
10. Next steps — aligned to ${deal.dealstage}

TONE
- Match audience: ${contact.jobtitle}
- Formal if title includes VP, SVP, Chief, Director; conversational otherwise.
- Every slide: one idea, one chart or one pull-quote, no walls of text.
  `.trim()
}

Simpan template di bawah version control. Ketika marketing memperbarui messaging framework, Anda cukup mengubah satu file dan cron run berikutnya akan mengambilnya.

Menangani Alternatif Kompetitif

Field

deal.competitors

di HubSpot — baik itu field teks custom satu baris, multi-checkbox, atau dropdown — adalah emas. Masukkan blok battlecard ke dalam prompt secara kondisional:

const BATTLECARDS: Record<string, string> = {
  'Competitor A': `
Competitor A memposisikan diri dengan <klaim mereka>.
Konter: <poin bukti Anda> + <tagline 3 kata>.
Pertanyaan landmine untuk ditanamkan: "Kapan terakhir kali audit keamanan mereka dipublikasikan?"
`,
  'Competitor B': `
Competitor B memimpin dengan <sudut pandang mereka>.
Konter: <konter Anda> — rujuk kasus <nama pelanggan> yang beralih.
Landmine: "Tanyakan tentang batasan per-seat mereka di atas 500 pengguna."
`,
}

function battlecardSection(competitorsCsv: string) {
  const names = competitorsCsv.split(',').map(s => s.trim()).filter(Boolean)
  if (!names.length) return ''
  return `
COMPETITIVE BATTLECARDS
${names.map(n => BATTLECARDS[n] ?? '').filter(Boolean).join('\n')}
Gunakan ini untuk mengisi slide Diferensiasi. Jangan sebutkan kompetitor lebih dari dua kali.
  `.trim()
}

Tambahkan hasil dari

battlecardSection(deal.competitors)

ke prompt Anda. Deck sekarang membawa framing kompetitif tingkat AE — jenis yang biasanya memerlukan panggilan tiga puluh menit dengan pemimpin intelijen kompetitif.

Simpan battlecard dalam tabel database daripada hard-coding setelah Anda memiliki lebih dari sepuluh. Head of Product Marketing Anda dapat mengeditnya tanpa harus mengajukan PR.

Pertanyaan yang Sering Diajukan

Bagaimana cara menghentikan HubSpot agar tidak menghasilkan deck duplikat setiap kali ada pembaruan properti?

Tambahkan properti bernama

last_deck_generated_at

ke objek deal dan sertakan filter dalam HubSpot Workflow:

last_deck_generated_at

tidak diketahui atau lebih dari 7 hari yang lalu. Fungsi transformer Anda harus menulis timestamp ini kembali ke HubSpot melalui Deal API setelah generasi berhasil. Ini saja mencegah 90% pemborosan panggilan API.

Berapa biaya ini dalam kredit 2Slides?

Setiap panggilan

/api/v1/slides/generate

mengurangi kredit berdasarkan jumlah slide dan add-on apa pun (pembuatan gambar, narasi suara). Untuk deck penjualan 10 slide pada umumnya dengan imagery bermerek, anggarkan 20–40 kredit per deck. Tim RevOps yang menghasilkan 500 deck per bulan berada di kisaran $150–$400 — jauh di bawah tenaga kerja AE yang dihemat pada satu enterprise deal saja.

Bisakah saya menghasilkan deck dalam bahasa selain bahasa Inggris?

Ya. Kirim

language: 'de'

language: 'ja'

language: 'es'

, dll. dalam payload

/api/v1/slides/generate

. Template prompt juga harus menyertakan pembukaan yang dilokalkan ketika rekaman kontak champion Anda menunjukkan bahasa pilihan non-Inggris.

Bagaimana cara mengunci brand visual agar setiap deck terlihat identik?

Gunakan

theme_id

yang terkunci di setiap permintaan generasi. Buat tema brand Anda sekali di UI 2Slides, salin ID-nya, dan simpan sebagai

BRAND_THEME_ID

di variabel environment Anda. Tema mengontrol font, palet warna, penempatan logo, dan tata letak master — sehingga konten bervariasi per akun sementara tampilan tetap identik secara pixel.

Bagaimana jika job generasi gagal?

Lakukan polling

/api/v1/jobs/{id}

dan periksa

status

. Pada

failed

, respons berisi

error

dengan kode yang dapat dibaca mesin. Coba ulang sekali dengan exponential backoff; jika gagal untuk kedua kalinya, posting alert Slack ke channel RevOps dan kembali ke deck template statis agar AE tidak terblokir sebelum panggilan mereka.

Kesimpulan

HubSpot tidak berusaha menjadi Salesforce, dan itu tidak masalah — kesederhanaannya adalah fitur utamanya. Namun kesederhanaan juga berarti tidak tersedia otomasi dokumen secara native. Celah ini adalah fitur, bukan bug, karena artinya tim RevOps yang menghubungkan HubSpot ke API presentasi AI memiliki area paling berharga dalam tech stack penjualan mereka: deck yang mendarat di hadapan pembeli.

Ketiga metode di atas — workflow webhook, tombol app card, scheduled batch — mencakup semua jenis pemicu pembuatan yang dibutuhkan tim penjualan. Pilih yang sesuai dengan tahap funnel Anda. Tahap Discovery dan Demo hampir selalu memerlukan on-demand (app card). Tahap Proposal dan Negotiation paling diuntungkan dari otomasi saat perubahan tahap (workflow webhook). Pipeline review dan persiapan QBR cocok menggunakan batch (cron). Jalankan ketiganya dan setiap deal di pipeline akan memiliki deck segar yang sesuai dengan CRM, dalam jangkauan, setiap hari.

Otomatiskan sales deck Anda dari HubSpot — dapatkan API key 2Slides dan integrasikan ke workflow Anda dalam waktu kurang dari sehari.