HMNS · INTERNAL LEARNING DAY

Claude for Business
From Chat to Ecosystem

Workshop lengkap untuk team HMNS — dari fundamental prompting sampai membangun dashboard & internal apps.

AGENDA

Workshop Flow

~2.5 hours

Workshop disusun macro-to-micro: dari mindset, ke setup, ke fundamental, lalu lanjut ke building dashboard & apps. Setiap module berdiri sendiri tapi flow-nya cumulative.

MODULE
Opening — Why This MattersBusiness case, framing, expectation setting
M1 — Mindset ShiftDari chatbot ke AI co-worker
M2 — Setup & EcosystemAccount, Projects, integrations
M3 — Fundamental PromptingR-C-T-F-C framework, hands-on
M4 — Building DashboardsVisualisasi data, live demo
BreakStretch, kopi, diskusi informal
M5 — Building Interactive AppsCalculator, forms, internal tools
M6 — DeploymentCloudflare Pages, sharing dengan team
Closing — Commitment & RoadmapAction items, next steps, Q&A
PRE-WORKSHOP CHECKLIST
Semua peserta sudah login Claude.ai (ideally Pro plan)
Setiap peserta bawa laptop + akses internet
Siapkan 1 file data sample (Excel/Sheets) untuk hands-on
Set group 2-3 orang berdasarkan fungsi (marketing, ops, sales)
MODULE 01
Mindset Shift

Sebelum teknis, peserta harus paham bedanya AI yang dipakai casual vs AI yang dipakai strategis. Segmen paling penting dari seluruh workshop.

1.1

Why AI Matters for HMNS

5 min

Sebelum masuk ke teknis, peserta harus paham kenapa investasi waktu untuk belajar ini penting. Bukan karena tren, tapi karena kompetitor mulai pakai dan team kita harus naik level produktivitasnya.

3 Realita yang Harus Disadari Team

01
Beban kerja per orang naik, tapi headcount tidak proporsional. AI bukan untuk gantikan team, tapi untuk multiplier output per orang.
02
Decision making di HMNS makin kompleks (multi-channel: Shopee, Tokopedia, TikTok, offline, live shopping). Tanpa alat analisis cepat, kita bottleneck di analisa.
03
Kompetitor brand fragrance Indonesia mulai pakai AI untuk content production, copywriting, dan data ops. Yang lambat adopt akan tertinggal di speed-to-market.
FRAMING UNTUK OPENING
"Hari ini bukan belajar 'cara pakai ChatGPT'. Kita belajar bagaimana AI bisa jadi anggota team ke-N yang available 24/7, paham konteks brand HMNS, dan bisa kerja paralel dengan kalian. Output workshop ini bukan kalian 'tahu AI'. Output-nya: dari minggu depan, kalian punya minimal 1 task harian yang dipercepat 50%."
1.2

Basic User vs Strategic User

5 min

Mayoritas team sudah pakai AI di level basic. Ini hanya 10% dari nilai sebenarnya. Mindset shift adalah segmen paling penting di workshop ini.

Basic User
Buka chat, tanya pertanyaan acak
Strategic User
Datang dengan konteks lengkap & tujuan jelas
Pakai untuk task one-off
Bangun sistem reusable (templates, projects)
Trust output mentah, copy-paste langsung
Iterasi & verifikasi sebelum dipakai
Tidak attach data/file
Selalu kasih data konkret (file, link, contoh)
Pakai bahasa instruksi ambigu
Pakai struktur: role, context, task, format, constraint

Core Principle: AI sebagai "Junior dengan PhD"

  • Punya pengetahuan luas (PhD level di banyak domain)
  • Tapi tidak tahu konteks bisnis HMNS, brand, customer, kecuali kita kasih tahu
  • Bisa diandalkan untuk eksekusi, tapi keputusan strategis tetap di tangan kita
  • Performanya tergantung seberapa baik kita brief, sama seperti junior asli
MODULE 02
Setup & Ecosystem

Setup fondasi yang harus dilakukan sebelum mulai pakai serius. Tanpa ini, workflow team tidak akan konsisten.

2.1

Account, Projects, & Integrations

10 min

Tiga lapisan setup: akun individual, project memory, dan integrasi ke cloud ecosystem.

Account & Access

  1. Setiap team member punya akun sendiri. Sharing account = sharing history = privacy risk.
  2. Upgrade ke Claude Pro atau Team plan. Free plan punya batas yang akan mengganggu workflow kerja serius.
  3. Aktifkan connectors untuk integrasi ke Google Drive, Gmail, Calendar via Settings. Ini yang bikin Claude bisa baca file langsung tanpa upload manual.

Project Setup — Kunci Konsistensi Output

Project adalah fitur paling underrated di Claude. Cara membangun "memori permanen" untuk konteks bisnis HMNS.

Cara Setup Project untuk HMNS

  1. Buat 1 project per fungsi besar. Contoh: HMNS Marketing, HMNS Operations, HMNS Sales Analytics
  2. Di Project Knowledge, upload dokumen fondasi:
    • Brand guideline (positioning, tone of voice, do's & don'ts)
    • Product catalog (SKU list, deskripsi, harga, target market)
    • ICP / customer persona documents
    • Glossary istilah internal HMNS
    • Template-template yang sering dipakai
  3. Tulis project instructions: siapa user-nya, apa goal-nya, batasan output, bahasa default
WHY THIS MATTERS
Tanpa Project: setiap chat mulai dari nol, jelaskan brand, jelaskan konteks. Buang waktu.
Dengan Project: chat baru langsung "paham" bahwa kamu HMNS, paham produk, paham tone. Output langsung relevan.

Ecosystem Integration

Untuk HMNS yang mau bangun ekosistem AI + cloud, integrasi ini wajib:

Google Drive Connector
Akses laporan penjualan, brand asset, SOP langsung tanpa upload-download
Google Sheets
Analisa data multi-channel sales dari SSOT
Gmail Connector
Draft balasan customer, summarize thread, klasifikasi inquiry
Claude Projects
Brand memory permanen per fungsi
Artifacts
Generate dashboard HTML, report visual, kalkulator
Cloudflare Pages
Host internal tools, akses by team via link
2.2

Claude Products: Chat, Cowork, Code

Claude bukan satu produk tunggal. Ada 3 mode pemakaian yang sesuai dengan tipe pekerjaan berbeda. Memahami ini menentukan tool yang dipakai untuk setiap task.

MODE 01
Claude Chat
Web & mobile, dialog-based
FORM
Browser chat, mobile app, desktop app
AKSES
claude.ai (Free / Pro / Team / Max)
SCOPE
Conversation, document analysis, artifact generation
DATA
Upload file manual atau connector (Drive, Gmail)
AUTONOMY
Low — Claude menunggu instruksi tiap turn
PALING COCOK UNTUK
  • Brainstorming, drafting, copywriting
  • Analisa data (upload file)
  • Bangun dashboard / app via Artifacts
  • Daily helper untuk task ad-hoc
MODE 02
Claude Cowork
Desktop agent, autonomous
FORM
Desktop app (macOS & Windows)
AKSES
Semua paid plans (Pro / Team / Max)
SCOPE
Multi-step task execution di local file & app
DATA
Folder access (read, edit, create file langsung)
AUTONOMY
High — kasih goal, Claude plan & eksekusi sendiri
PALING COCOK UNTUK
  • Compile laporan dari banyak file
  • Rapikan folder data multi-channel sales
  • Recurring task mingguan (auto-update dashboard)
  • Task panjang yang butuh banyak step
MODE 03
Claude Code
Terminal, dev-focused
FORM
Command-line tool (terminal)
AKSES
npm install via terminal, paid plans
SCOPE
Coding tasks: build, debug, refactor codebase
DATA
Full akses ke codebase + execute commands
AUTONOMY
High — agentic coding, multi-file edit, run tests
PALING COCOK UNTUK
  • Build & deploy internal tools (Cloudflare Workers, dll)
  • Refactor codebase yang sudah ada
  • Setup project baru dari scratch
  • Untuk tech lead atau developer di team

When to Use What — HMNS Context

Mapping task harian HMNS ke produk yang tepat:

TASK
CHAT
COWORK
CODE
Bikin caption Instagram launching varian baru
Analisa Excel sales 1 bulan, cari insight
~
Compile 30 file laporan tim jadi 1 ringkasan
Bangun dashboard HTML untuk weekly meeting
~
Auto-update dashboard tiap Jumat sore
Rapikan folder customer feedback per quarter
Build Operations Hub di Cloudflare Workers + D1
Deploy artifact ke Cloudflare Pages otomatis
~
Debug error di internal tool yang sudah jalan
~

Legend: ✓ paling optimal  ·  ~ bisa, tapi tidak optimal  ·  — tidak cocok

Rekomendasi Adopsi untuk Team HMNS

PHASE 1 · ALL TEAM

Claude Chat

Semua peserta workshop mulai dari sini. Pro plan minimum. Fokus ke prompting fundamental & artifact (Module 3-5).

Target: 100% team aktif pakai dalam 2 minggu.

PHASE 2 · POWER USERS

Cowork

Untuk 3-5 orang power user yang sudah lancar dengan Chat. Pakai untuk recurring task: weekly dashboard update, monthly affiliate report.

Target: 1-2 orang per departemen, bulan 2.

PHASE 3 · TECH LEAD

Code

Untuk 1 tech lead di team yang handle Operations Hub & internal tools. Pakai untuk build & maintain Cloudflare Workers + D1 stack.

Target: Designated owner, mulai bulan 1.

MODULE 03
Fundamental Prompting

Satu framework yang harus dihafal semua team. Dengan ini, 90% kebutuhan kerja terkover.

3.1

R-C-T-F-C Framework

10 min

Framework sederhana, easy to remember, bisa dipakai untuk semua jenis task. Klik tiap kartu untuk lihat detail.

R
Role
Tetapkan peran AI
C
Context
Latar belakang
T
Task
Yang dikerjakan
F
Format
Bentuk output
C
Constraint
Batasan & kriteria

Contoh Lengkap R-C-T-F-C — Marketing HMNS

ROLE: Bertindak sebagai Senior Copywriter brand parfum premium di Indonesia. CONTEXT: HMNS akan launching varian baru bernama [X], dengan notes bergamot/jasmine/musk. Target market: wanita 22-30, urban professional. Tone brand HMNS: warm, intimate, confident, tidak murahan. TASK: Buatkan 5 variasi caption Instagram untuk launching post pertama. FORMAT: Tabel dengan kolom: Variasi # | Hook (kalimat pertama) | Body (max 150 karakter) | CTA halus. CONSTRAINT: - Hindari kata generik (wangi, harum, segar) - Tidak boleh hard-sell - Setiap variasi punya emotional angle beda (nostalgia, confidence, sensual, ritual, signature)
3.2

Advanced Techniques

10 min

1. Iteration, Bukan One-Shot

Jangan harap output pertama langsung sempurna. Pattern yang benar:

  • Generate output awal
  • Review: "Bagian X kurang, Y terlalu Z, revisi"
  • Lanjut sampai siap pakai. 3-4 iterasi normal

2. Show, Don't Tell

Kalau susah jelaskan style, kasih contoh:

  • "Ini contoh tone yang saya mau: [paste 2-3 caption HMNS lama yang bagus]"
  • "Buatkan dengan style serupa"

3. Verifikasi Output Numerik

AI bisa keliru di angka. Untuk task analisa data:

  • Minta dia tampilkan cara hitungnya
  • Cross-check dengan kalkulator/spreadsheet
  • Jangan trust angka critical tanpa verifikasi

4. Attach File, Bukan Copy-Paste

Kalau data besar (Excel, PDF panjang):

  • Upload file langsung
  • Lebih akurat daripada copy-paste yang bisa hilang struktur tabel
MODULE 04
Building Dashboards

Pindah dari prompting umum ke produksi output yang lebih powerful: dashboard visual untuk decision making.

4.1

Apa Itu Artifact

5 min

Sebelum bangun apa-apa, paham dulu bedanya "chat output" dengan "artifact". Perbedaan mendasar yang bikin Claude lebih powerful dari sekadar chatbot.

Artifact = Output yang Bisa "Hidup"

Artifact adalah file/aplikasi yang Claude buat di canvas terpisah dari chat. Beda dengan teks biasa yang cuma untuk dibaca, artifact bisa:

  • Interaktif — user bisa klik, ubah input, lihat hasil real-time
  • Reusable — bisa di-download, di-share, di-deploy ke web
  • Stateful — bisa simpan data sementara di dalam app
  • Visual — chart, dashboard, kalkulator, form
DASHBOARD

Tampilan visual data. Read-only. Untuk monitoring & decision making.

APPS

Interaksi & input dari user. Read-write. Untuk eksekusi pekerjaan harian.

Quick check: Goal kamu apa?
REKOMENDASI
4.2

Live Preview — Sales Dashboard

5 min

Inilah hasil akhir dashboard multi-channel sales untuk HMNS. Dibangun pakai Claude dalam 15-25 menit.

HMNS — MULTI-CHANNEL SALES DASHBOARD (DEMO)
TOTAL REVENUE
Rp 412M
↑ 18% MoM
ORDERS
2,847
↑ 12% MoM
AOV
Rp 145K
↓ 3% MoM
ROAS BLENDED
4.2x
↑ 0.4 MoM
REVENUE BY CHANNEL
Rp 178MShopee
Rp 134MTikTok
Rp 68MTokopedia
Rp 32MOffline
4.3

Step-by-Step Membangun Dashboard

15 min

Workflow 5 langkah yang harus diikuti setiap kali bangun dashboard. Konsisten = output lebih cepat & berkualitas.

1

Siapkan data sumber

Export data dari Shopee/Tokopedia/TikTok ke Excel atau Google Sheets. Struktur jelas: 1 baris per transaksi, kolom: tanggal, channel, SKU, qty, revenue, ads spend.

2

Tentukan KPI yang ingin di-monitor

Jangan tampilkan semua. Pilih 4-8 KPI paling penting. Untuk HMNS: Revenue, Orders, AOV, ROAS, Top SKU, Channel mix, Conversion rate.

3

Brief Claude dengan struktur lengkap

Pakai template prompt di bawah. Selalu kasih konteks: brand, audience pemakai, data sumber, KPI target.

4

Iterasi visual

Output pertama biasanya belum sempurna. Minta revisi: warna, layout, urutan chart, tambah filter, hilangkan section yang tidak perlu.

5

Download HTML & deploy

Download artifact sebagai file HTML. Bisa langsung dibuka di browser, di-share via link, atau di-deploy ke Cloudflare Pages.

Template Prompt — Dashboard

ROLE: Bertindak sebagai Senior Front-End Developer yang ahli membangun dashboard analytics untuk brand e-commerce. CONTEXT: HMNS adalah brand parfum lokal premium-affordable. Sales tim butuh dashboard untuk monitoring performa multi-channel (Shopee, Tokopedia, TikTok Shop, Offline) yang di-review setiap Senin pagi. Data sumber: [attach Excel atau paste tabel data 1 bulan] TASK: Bangun single-file HTML dashboard yang menampilkan: 1. 4 KPI cards di atas: Total Revenue, Total Orders, AOV, Blended ROAS — masing-masing dengan delta MoM 2. Bar chart: Revenue per channel 3. Line chart: Daily revenue trend (30 hari) 4. Table: Top 10 SKU by revenue dengan kolom: SKU, Channel, Qty, Revenue, % contribution 5. Filter di atas: by channel (dropdown), by date range FORMAT: Single HTML file, embed CSS dan JS. Pakai Chart.js untuk chart. Mobile-responsive. CONSTRAINT: - Color palette: navy (#1a2b4a) primary, gold (#b8975c) accent, cream (#f5f1ea) background - Font: Helvetica/Arial system font - Layout clean, banyak whitespace, tidak ramai - Angka Rupiah pakai format Rp dengan koma pemisah ribuan - Tidak boleh ada library eksternal selain Chart.js dari CDN
PRO TIP
Untuk dashboard yang akan di-update tiap minggu, minta Claude buat "data section" di bagian atas file HTML yang isinya JS array. Tiap minggu kamu cukup ganti angkanya tanpa minta build ulang.
MODULE 05
Building Interactive Apps

Naik level dari dashboard (read-only) ke apps (read-write). Tools yang dipakai team untuk eksekusi harian.

5.1

Anatomi Sebuah App

5 min

App = input + logic + output. Pahami komponen ini sebelum mulai membangun.

IN

Input

Form, dropdown, slider, file upload

FX

Logic

Perhitungan, validasi, transformasi

OUT

Output

Hasil, visual, file, action

5.2

Live Demo — Margin Calculator

10 min

Calculator di bawah ini fully functional. Coba ubah angkanya — hasilnya update real-time. Inilah contoh app sederhana yang bisa dibangun Claude dalam 15 menit.

HMNS — PARFUM MARGIN CALCULATOR (DEMO)
RESULTS
GROSS PROFIT
Rp 290,000
NET PROFIT (after fees & ads)
Rp 224,200
MARGIN %
58.2%
Healthy margin. Aman untuk push promosi.

Template Prompt — App

ROLE: Bertindak sebagai Product Engineer yang ahli membangun internal tools untuk team operasional. CONTEXT: HMNS sales team butuh kalkulator margin yang dipakai sebelum approve promosi di Shopee/Tokopedia/TikTok. Pemakai: 5-10 orang, level non-technical. TASK: Bangun single-file HTML app dengan: INPUT (kiri): - Harga jual (Rp), COGS (Rp), Platform fee (%), Ads spend per unit (Rp), Discount (%) CALCULATION (auto, tanpa tombol submit): - Harga setelah discount, Gross profit, Net profit, Margin %, Break-even discount OUTPUT (kanan): - KPI cards untuk setiap metric - Status indicator: hijau >40%, kuning 20-40%, merah <20% - Rekomendasi action sesuai status FORMAT: Single HTML file. Real-time calculation. Mobile-responsive. CONSTRAINT: - Brand color: navy (#1a2b4a) + gold (#b8975c) + cream (#f5f1ea) - Format Rupiah dengan koma pemisah ribuan - Tidak pakai library eksternal - Input validasi: tidak boleh negatif/kosong
5.3

Use Cases untuk HMNS

15 min

Klik tiap card untuk detail lengkap. Pilih 1-2 yang relevan untuk dipraktekkan langsung.

SD
Weekly Sales Dashboard
Multi-channel monitoring untuk weekly meeting Senin pagi.
DASHBOARD25 min
MC
Margin Calculator
Hitung margin & break-even sebelum approve promosi/diskon.
APP15 min
IT
Inventory Tracker
Stock per SKU dengan alert low stock & forecast.
DASHBOARD30 min
CR
Customer Reply Helper
Input tipe inquiry → draft reply sesuai tone HMNS.
APP20 min
AP
Affiliate Performance Hub
Tracking ROAS dan GMV per affiliate, Shopee + TikTok.
DASHBOARD35 min
CB
Content Brief Generator
Input variant + angle → content brief lengkap.
APP20 min
MODULE 06
Deployment to Cloud

Artifact yang sudah jadi tidak harus berhenti di Claude. Deploy ke Cloudflare Pages supaya bisa diakses team via link permanent.

6.1

Recommended Architecture

Sebelum bahas deployment teknis, ini stack arsitektur yang direkomendasikan untuk HMNS — sudah terbukti dipakai di Operations Hub & Affiliate Dashboard. Prinsip: low-maintenance, low-cost, secure by default.

Stack Layers

LAYER 1 · USER ACCESS
Custom Domain
dashboard.hmns.id, ops.hmns.id (via Cloudflare DNS)
Google OAuth / SSO
Login pakai email @hmns.id, no password management
Approval Gate
Whitelist email by admin (qemhal@hmns.id)
LAYER 2 · EDGE & DELIVERY
Cloudflare Pages
Static hosting untuk frontend HTML/JS dashboard
Cloudflare Access
Zero Trust layer, password / Google login enforcement
Cloudflare CDN
Global delivery, DDoS protection, SSL auto
LAYER 3 · APPLICATION LOGIC
Cloudflare Workers
Backend logic (kalau perlu API), serverless, no infra mgmt
Claude API
Dynamic content generation di dalam app (opsional)
Client-side JS
Untuk dashboard read-only, no backend needed
LAYER 4 · DATA
Google Sheets SSOT
Source of truth untuk data sales, inventory, affiliate
Cloudflare D1
SQLite serverless, untuk app yang butuh CRUD permanent
localStorage
Untuk app personal/sementara, no server needed
PRINSIP DESAIN
Single vendor (Cloudflare): hosting, edge, auth, database — semua dalam 1 ekosistem
Serverless first: tidak ada server fisik/VPS yang perlu di-maintain
Google Sheets sebagai SSOT: team familiar, data tetap di-edit manual oleh ops team
OAuth, bukan password: tidak perlu kelola user/password, leverage Google Workspace yang sudah ada
6.2

Cost & Maintenance Profile

Estimasi biaya bulanan untuk arsitektur ini. Hampir semua komponen ada di free tier — bayar hanya ketika skala besar.

KOMPONEN TIER BIAYA / BULAN
Cloudflare Pages
Hosting frontend, unlimited bandwidth
Free Rp 0
Cloudflare Workers
100K requests/day free
Free Rp 0
Cloudflare D1
5GB storage, 5M reads/day free
Free Rp 0
Cloudflare Access
Zero Trust, up to 50 users free
Free Rp 0
Domain (hmns.id)
Sudah dimiliki, tinggal pasang DNS
Existing Rp 0
Google Workspace
Untuk OAuth + Sheets SSOT
Existing Rp 0
Claude API
Hanya kalau app perlu generate konten dinamis
Pay-as-you-go ~Rp 200-500K
TOTAL ESTIMASI
Tanpa Claude API, 100% free
Rp 0 – 500K

Maintenance Burden — Realita

YANG TIDAK PERLU DI-MAINTAIN

  • Server fisik atau VPS (serverless)
  • SSL certificate (Cloudflare auto-renew)
  • Database backup (D1 + Sheets versioning)
  • User password reset (OAuth handle by Google)
  • Security patch OS (no OS)
  • Bandwidth scaling (Cloudflare auto)

YANG MASIH PERLU PERHATIAN

  • Update data di Google Sheets SSOT (1-2× minggu)
  • Tambah/hapus user di Cloudflare Access (saat onboarding)
  • Update dashboard kalau ada metric baru (via Claude)
  • Monitor Claude API usage (kalau dipakai)
  • Audit access log (review per quarter)
6.3

Safety & Access Tiers

Tidak semua dashboard/app punya level sensitivitas sama. Klasifikasi 4 tier ini menentukan strategi auth yang tepat untuk setiap artifact.

TIER 1 · PUBLIC
No Auth Required
Tools yang aman dibuka siapa saja, tidak ada data sensitif.
CONTOH HMNS
  • Margin calculator (input manual, tidak simpan data)
  • Public product catalog
  • Tools yang dipakai customer/affiliate eksternal
STRATEGI AUTH
  • Tidak perlu login
  • Deploy langsung di Cloudflare Pages public URL
  • Cukup rate limiting di Cloudflare
TIER 2 · INTERNAL TEAM
Google OAuth
Tools internal team HMNS, butuh login tapi tidak super sensitif.
CONTOH HMNS
  • Content brief generator
  • Daily mood board log
  • Internal training material
STRATEGI AUTH
  • Cloudflare Access dengan Google OAuth
  • Whitelist domain @hmns.id atau email list
  • Session 24 jam, auto-logout
TIER 3 · SENSITIVE DATA
OAuth + Role-Based
Dashboard dengan data finance, sales rinci, atau inventory.
CONTOH HMNS
  • Multi-channel sales dashboard (revenue, margin)
  • Affiliate performance hub
  • Inventory tracker dengan COGS
STRATEGI AUTH
  • Cloudflare Access + email whitelist spesifik
  • Role check di app (admin vs viewer)
  • Audit log access via Cloudflare
TIER 4 · CRITICAL OPS
Multi-Layer Auth
Tools yang bisa modify data critical (approve, transfer, delete).
CONTOH HMNS
  • Operations Hub (approve fulfillment, edit stock)
  • Procurement workflow (PO approval)
  • Sample request approval system
STRATEGI AUTH
  • OAuth + approval gate spesifik per action
  • Admin approval untuk action sensitif
  • Full audit log: siapa, kapan, action apa
  • Backup harian ke Google Drive
RULE OF THUMB
Sebelum deploy artifact apapun, tanya: "Kalau link ini bocor ke kompetitor atau publik, apa dampaknya?" Jawaban menentukan tier. Default-nya selalu paranoid — pakai tier yang lebih tinggi kalau ragu.
6.4

Deployment Options

15 min

Tiga opsi deployment, masing-masing untuk skenario berbeda.

Cloudflare Pages — Rekomendasi untuk HMNS

Free, fast, support custom domain. Team Qemhal sudah familiar dari Operations Hub.

1

Download artifact sebagai HTML

Klik tombol download di Claude artifact, simpan index.html

2

Login ke Cloudflare Dashboard

dash.cloudflare.com → menu Pages → Create a project

3

Drag & drop file

Pilih "Direct upload", drag folder berisi index.html, kasih project name (contoh: hmns-sales-dash)

4

Dapat link permanent

Cloudflare kasih link hmns-sales-dash.pages.dev — share ke team

5

(Opsional) Custom domain

Pasang subdomain HMNS, contoh: dashboard.hmns.id

SECURITY REMINDER
Untuk dashboard yang berisi data sales/finance sensitif, jangan deploy ke public URL tanpa proteksi. Gunakan Cloudflare Access untuk add password/Google login.
6.5

Pre-Build Checklist

5 min

Sebelum minta Claude bangun dashboard/app, pastikan 8 hal ini sudah jelas. Klik untuk centang.

Tujuan jelas: tool ini untuk siapa, untuk decision apa, frekuensi pemakaian?
Data sumber siap: file Excel/Sheets/CSV dengan struktur konsisten
KPI/metric ditetapkan: maksimal 8 metric utama
Brand color & font ditentukan: konsisten dengan brand HMNS
Format Rupiah & angka jelas: Rp dengan koma ribuan, persen 1 desimal
Mobile responsive: tentukan device target
Library limit: vanilla atau boleh Chart.js?
Deploy plan: mau di-host di mana setelah jadi?
CLOSING
Commitment & Roadmap

Setiap peserta keluar dari workshop dengan action items konkret. Tanpa ini, learning day cuma jadi event seremonial.

7.1

Do's and Don'ts

5 min

Ringkasan praktis yang harus selalu diingat team.

DO
Selalu kasih konteks brand HMNS di awal
Mulai chat dengan pertanyaan generik
DO
Pakai Projects untuk task berulang
Mulai dari nol setiap kali
DO
Iterasi output sampai siap pakai
Trust output pertama mentah-mentah
DO
Verifikasi angka & claim penting
Pakai output untuk laporan tanpa cek
DO
Simpan prompt sukses sebagai template
Mulai dari nol untuk task mirip
DATA & PRIVACY REMINDER
Jangan upload data customer dengan PII (nama lengkap + nomor HP + alamat)
Data sales boleh, tapi anonimisasi nama customer
Dokumen confidential (formula, kontrak): konsultasi leadership dulu
Credential/password: TIDAK PERNAH masukkan ke AI chat
7.2

Commitment Sheet

5 min

Sebelum sesi selesai, setiap peserta isi 3 pertanyaan berikut. Ini exit ticket untuk lock-in adoption.

1. Task harian apa yang dari minggu depan saya akan kerjakan pakai Claude?

2. Dashboard atau app apa yang akan saya build di minggu ini?

3. Berapa estimasi jam per minggu yang akan dihemat dari adopsi ini?

7.3

Roadmap Pasca Workshop

5 min

Workshop bukan akhir. Ini awal dari adopsi sistematis di team HMNS.

ACTION
Setup Claude ProjectMinimal 3 dokumen knowledge per fungsi
Build 1 artifactDashboard atau app sederhana sesuai use case
Share prompt template1 prompt sukses per orang di group team
Review session 30 menitApa yang work, apa yang stuck
Deploy 1 internal toolKe Cloudflare Pages, akses team
Adoption auditBerapa jam dihemat, siapa power user
CLOSING MESSAGE
"AI bukan ancaman buat kerjaan kita. Yang jadi ancaman adalah team lain yang adopt lebih cepat. Hari ini kita sudah jalan duluan. Goal-nya bukan kalian jadi expert AI. Goal-nya, kalian punya cara baru yang lebih cepat untuk kerjaan harian. Multiply itu ke seluruh team HMNS, dan kita akan kerja lebih ringan tapi output lebih besar."