STUDIOSTAFF® — Panduan Onboarding

◈ Pengenalan

STUDIOSTAFF® adalah operating system internal untuk House of EXP — mencakup manajemen proyek studio, rental peralatan, keuangan, akademi, merchandise, dan operasional tim dalam satu platform.

🎙️

Studio

Proyek recording, mixing, mastering, dan klien

projectstasksclientsinvoices

📦

Rental

Booking peralatan, inventori, dan laporan rental

bookingsinventoryrates

💰

Finance

Pemasukan, pengeluaran, payroll, dan rekening bank

incomeexpensepayrollzakat

🎓

Academy

Kelas musik, pendaftaran siswa, dan tagihan kursus

classesstudentsenrollment

🛍️

Merchandise

Produk, stok, pembelian, dan penjualan merchandise

productsstocksales

⚙️

Domestic / Ops

Payroll, cuti, uang makan, reimbursement, kebersihan

payrollleavereimbursement

ℹ

Cara kerja sinkronisasi data Semua perubahan disimpan otomatis ke Supabase melalui tombol Save (debounced 600ms). Data real-time diperbarui via Supabase Realtime broadcast — kamu tidak perlu refresh manual kecuali jika ada gangguan koneksi.

⌥ Login & Sesi

Buka studiostaff.houseofexp.com di browser. Sistem menggunakan token sesi yang tersimpan di browser selama 7 hari.

01

Pilih nama kamu dari daftar

Layar login menampilkan semua akun staf. Klik namamu.

02

Masukkan password

Ketik password dan klik "Sign In →". Password default ada di tabel di bawah — segera ganti setelah login pertama.

User	Role	Default Password	Status
Aldi	staff	`aldi123`	Ganti Sekarang
Dissa	admin	`dissa123`	Ganti Sekarang
Bil	staff	`bil123`	Ganti Sekarang

03

App memuat semua data

Setelah login berhasil, sistem fetch semua data dari Supabase (~26 tabel) sekaligus ke memori browser. Proses ini berlangsung sekali per sesi.

⚠

Ganti password segera! Buka Settings → Users → pilih namamu → ubah password. Jangan biarkan password default aktif di produksi.

⊟ Dashboard

Setelah login, kamu akan melihat dashboard utama. Berikut anatomi antarmuka:

Sidebar Kiri

Navigasi antar modul — Studio, Rental, Finance, Academy, Merchandise, Domestic, Docs, Journal, Calendar, dan Settings.

Tombol 🔄 Update

Fetch ulang data dari server secara manual. Gunakan ini jika data terasa tidak sinkron.

Notifikasi 🔔

Badge merah menunjukkan jumlah notifikasi yang belum dibaca. Klik ikon untuk melihat daftar. Klik item notifikasi untuk langsung ke bagian yang relevan.

Priority Tasks

Menampilkan task berprioritas tinggi yang belum selesai dari semua modul.

✓

Auto-sync aktif Data diperbarui otomatis lewat 3 mekanisme: Supabase Realtime broadcast (instan), window focus event, dan polling fallback setiap 15 detik.

🎙️ Modul Studio

Mengelola proyek rekaman, klien, tasks, feedback, quotasi, dan invoice studio.

Menambah Klien Baru

Tambah klien sebelum membuat proyek — klien digunakan sebagai referensi di seluruh sistem.

01

Buka Studio → Database → klik "+ Add Client"

02

Isi form klien

form: Add Client

Nama / Perusahaan"Sony Records Indonesia" * wajib

Label🎙 Studio | 📅 Booking | 🎓 Academy

KotaBandung | Jakarta | Custom...

Phone / WA"+62 812 3456 7890"

Catatanopsional — markdown didukung

03

Klik "Save Client"

Klien langsung tersimpan ke Supabase dan muncul di daftar.

Membuat Proyek Baru

01

Buka Studio → Projects → klik "+ New Project"

02

Isi form proyek

form: New Project

Nama Proyek"Sony Mastering — Album 2026" * wajib

Klienpilih dari daftar klien

Deadlinepilih dari kalender

StatusActive | Awaiting Approval | On Hold | Done

Deskripsimarkdown didukung

03

Klik "Save Project"

Progress proyek dihitung otomatis dari persentase task yang selesai.

ℹ

Progress (%) = (jumlah task selesai ÷ total task) × 100. Tandai task "Done" untuk menaikkan progress.

Membuat Task

01

Buka Studio → Tasks → klik "+ New Task"

02

Isi form task

form: New Task — Studio

Judul Task"Record vocal session" * wajib

Proyekhubungkan ke proyek (opsional)

PrioritasNormal | High

Assign Topilih anggota tim

Due DateToday | Tomorrow | Custom

Deskripsimarkdown didukung

03

Klik "Create Task"

Anggota tim yang di-assign akan mendapat notifikasi.

Mencatat Feedback Proyek

Feedback digunakan untuk melacak revisi, permintaan perubahan, atau komentar dari klien yang terkait dengan proyek tertentu.

01

Buka Studio → klik tab "Feedback" → "+ New Feedback"

02

Isi form feedback

form: New Feedback

Judul"Revisi eq vokal" * wajib

Query / Summaryringkasan feedback

Assign Tosiapa yang tangani

Due Datedeadline revisi

Proyek Terkaitlink ke proyek

Klien Terkaitlink ke klien

Revision PhaseRevision 1 | Revision 2 | Final

StatusTo Do | Ongoing | Done

Membuat Quotasi & Invoice

01

Buka Finance → Quotations → "+ New Quote"

02

Isi detail quotasi

form: New Quotation

Klienpilih dari database klien * wajib

KategoriStudio | Rental | Academy

Proyekopsional — link ke proyek

Line Itemsklik "+ Add Item" → deskripsi, qty, harga/unit

Diskon (%)opsional — dipotong dari subtotal

Due Datekapan klien harus bayar

Sistem otomatis hitung: Subtotal → Diskon → Total (Rp)

03

Ubah jadi Invoice saat sudah disetujui

Di halaman Quotations, klik "Convert to Invoice" untuk mengubah quote menjadi invoice resmi.

📦 Modul Rental

Kelola inventori peralatan dan booking rental klien.

01

Setup inventori peralatan (Admin — sekali saja)

Rental → 📦 Inventory → "+ New Item"

form: Add Inventory Item

Nama Item"Neumann U87 Microphone" * wajib

Stok Tersedia3 unit

Rate/Hari (Rp)500000

02

Buat booking rental saat klien mau sewa

Rental → Bookings → "+ New Booking"

form: New Rental Booking

Klienpilih dari database klien * wajib

Equipment / Itempilih dari inventori atau ketik custom

Tanggal MulaiToday | Tomorrow | Custom

Perlu Crew?Ya | Tidak

Perlu Delivery?Ya | Tidak

Catataninstruksi khusus

Total otomatis dihitung: (Rate × Hari) + Crew + Delivery

03

Buat invoice rental

Setelah booking dikonfirmasi, buat invoice dari Rental → Invoices. Data booking otomatis terisi.

💰 Modul Finance

Kelola pemasukan, pengeluaran, rekening bank, utang-piutang, dan kalkulasi zakat.

Log Pemasukan

form: Log Transaction (Income)

Deskripsi"Sony Music — Mastering Project" * wajib

Jumlah (Rp)5000000 * wajib

JenisIncome

Rekening BankEXP-BCA | EXP-Jenius | NAH * wajib

TanggalToday | Yesterday | Tomorrow | Custom

Klien Terkaitopsional

Log Pengeluaran

form: Log Transaction (Expense)

Deskripsi"Kabel XLR baru untuk studio" * wajib

Jumlah (Rp)750000 * wajib

JenisExpense

Rekening BankEXP-BCA | EXP-Jenius | NAH * wajib

TanggalToday | Yesterday | Tomorrow | Custom

Rekening Bank

Tiga rekening sudah dikonfigurasi secara default. Atur saldo awal di awal setup.

ID	Nama	Pemilik	Digunakan Untuk
`bca`	EXP-BCA	Studio	Studio income & expenses
`jenius`	EXP-Jenius	Studio	Studio income & expenses
`nah`	NAH	Rental	Rental income & expenses

⚠

Atur saldo awal setiap rekening di Settings → Finance sebelum mulai mencatat transaksi. Saldo akan otomatis bertambah/berkurang setiap ada transaksi.

Utang & Piutang

form: Log Debt

Deskripsi"Pinjaman mic ke Budi"

Jumlah (Rp)2000000

JenisWe owe (utang kita) | Owed to us (piutang kita)

Pihak"Nama orang/perusahaan"

LabelStudio | Rental | Academy | Other

Due Datekapan harus lunas

StatusOutstanding | Settled

Kalkulasi Zakat

Sistem otomatis menghitung 2.5% dari total pemasukan dalam periode tertentu.

form: Calculate Zakat

Periodepilih bulan

Label FilterAll | Studio | Academy | Rental | Merch

RekeningAll Accounts | BCA | Jenius | NAH

Penerima Zakatnama lembaga/penerima

Total IncomeRp 0 (otomatis dihitung)

Zakat (2.5%)Rp 0 (otomatis)

🎓 Modul Academy

Manajemen kelas musik, siswa, dan laporan akademi.

01

Buat kelas baru

Academy → klik "+ New Class"

form: New Class

Nama Kelas"Music Production Basics — Batch 2026"

Instrukturpilih dari daftar staf

Jadwal"Setiap Senin & Rabu, 19.00–21.00"

Harga/Siswa (Rp)500000 per bulan

Tanggal Mulaikapan kelas dimulai

02

Daftarkan siswa

Klik pada kelas → "+ Add Student"

form: Add Student

Nama Siswa"Budi Santoso" * wajib

Phone / WAnomor kontak

Emailalamat email

Tanggal Daftarkapan mulai masuk

StatusActive | Inactive | Graduate

03

Buat tagihan bulanan siswa

Finance → Quotations → "+ New Quote", pilih Kategori = Academy. Saat pembayaran diterima, log ke Finance → Income, kategori = Academy.

🛍️ Modul Merchandise

Kelola produk, stok masuk (purchase), dan penjualan merchandise.

01

Tambah produk (Admin — sekali setup)

Merchandise → Products → "+ New Product"

form: New Product

Nama Produk"STUDIOSTAFF® T-Shirt" * wajib

BrandEXP | NAH | NAHX

KategoriAP (Apparel) | AC (Accessories) | CL (Collectibles)

SKUotomatis digenerate atau custom

Warna / Edisi"Black" | "Limited Edition"

Stok Awal50 unit

Harga Jual (Rp)180000 (harga reguler)

Harga Member (Rp)150000 (harga khusus member)

02

Log pembelian stok (restok)

Merchandise → Purchases → "+ New Purchase"

form: New Purchase Order

Produkpilih dari daftar produk

Qty100 unit

Total Cost (Rp)8000000

Supplier"Nama vendor/produsen"

StatusIn Production | Due | Paid

✓

Stok otomatis bertambah saat status diubah ke "Paid".

03

Log penjualan

Merchandise → Sales Log → "+ Log Sale"

form: Log Sale

Produkapa yang dibeli

CustomerWalk-in | pilih dari klien

Qty2 unit

Harga/Unit (Rp)180000

Tanggalkapan transaksi terjadi

JenisSales | Bundle | Free

✓

Stok otomatis berkurang dan income otomatis tercatat di Finance.

⚙️ Modul Domestic / Operations

Manajemen internal tim — payroll, cuti, uang makan, reimbursement, dan kebersihan.

Proses Payroll Bulanan

01

Domestic → Payroll → "+ Log Payroll"

02

Isi detail payroll

form: Log Payroll

KaryawanAldi | Dissa | Bil | Ekky

BulanApril 2026

Rekening BankEXP-BCA | EXP-Jenius | NAH

Operational Fee (Rp)potongan biaya operasional

BPJS Insurance (Rp)potongan BPJS

Project Fee (Rp)bonus proyek

Food Credit (Rp)tunjangan makan

Total AmountRp 0 (auto-sum)

03

Admin approve → ubah status ke "Paid"

Saat statusnya diubah ke "Paid", saldo rekening bank otomatis berkurang.

⚠

Payroll dimulai dengan status "Awaiting Approval". Hanya admin yang bisa mengubah ke "Paid".

Pengajuan Cuti

form: Leave Notice

Karyawanpilih nama staf

AlasanAnnual | Sick | Personal | Emergency | Other

Tanggal Mulaihari pertama cuti

Tanggal Selesaihari terakhir cuti

Catatanketerangan tambahan

StatusAwaiting Approval | Approved | Rejected

Uang Makan (Food Credits)

Setiap karyawan mendapatkan tunjangan makan harian default Rp 25.000.

form: Food Credit

Karyawanpilih nama staf

Tanggaltanggal makan

Jumlah (Rp)25000 (default)

Dibayar olehsiapa yang bayar duluan

StatusAwaiting Approval | Paid

Pengajuan Reimbursement

Karyawan ajukan biaya yang sudah dibayar pribadi untuk kepentingan pekerjaan.

form: Reimbursement

Karyawanpilih nama staf

Deskripsi"Ongkos ojek ke klien"

Jumlah (Rp)35000

KategoriTransport | Meals | Equipment | Other

Tanggalkapan pengeluaran terjadi

StatusAwaiting Approval | Approved | Paid | Rejected

Jadwal Kebersihan

form: General Cleaning

Tanggaljadwal bersih-bersih

Petugas"Pak Amin" (default)

Biaya (Rp)100000

StatusPending | Paid

📄 Dokumen & Jurnal

Simpan kontrak, catatan studio, dan log aktivitas tim.

✦

Docs — Simpan kontrak klien, MOU, dan file penting. Mendukung label: Studio, Rental, Academy, Domestic, Meeting. Bisa difilter dan dicari.

✦

Journal — Catatan harian aktivitas studio, meeting notes, dan log kegiatan. Ada dua tampilan: Journal (catatan bebas) dan Meetings (notulen rapat).

✦ Setup Awal (Admin)

Ikuti checklist ini saat pertama kali menggunakan STUDIOSTAFF. Centang setiap item setelah selesai.

📅 Hari 1–2 · Akun & Pengguna

Login sebagai admin (Dissa)
Ganti password semua staf (Settings → Users)
Tambah nomor WhatsApp setiap anggota tim
Pastikan warna identitas setiap akun sudah benar
Tambah staf baru jika ada anggota yang belum terdaftar

📅 Hari 3 · Finance

Atur saldo awal rekening BCA, Jenius, dan NAH
Tentukan custom expense categories jika perlu
Coba log satu income test
Coba log satu expense test

📅 Hari 4 · Rental Inventory

Tambah semua peralatan ke inventori (mic, kabel, stand, dll.)
Set jumlah stok tersedia per item
Set rate per hari untuk setiap item
Test buat satu booking rental

📅 Hari 5 · Studio & Klien

Tambah klien-klien reguler (Sony, produser lokal, agency, dll.)
Isi kontak dan nomor WhatsApp tiap klien
Coba buat proyek baru yang di-link ke klien
Coba buat task di dalam proyek tersebut

📅 Hari 6 · Academy & Merchandise

Buat minimal satu kelas di Academy
Daftarkan siswa-siswa aktif ke kelas
Tambah produk-produk merchandise ke katalog
Set harga reguler dan harga member

📅 Hari 7 · WhatsApp & Notifikasi

Aktifkan integrasi WhatsApp di Settings
Kirim test message untuk memverifikasi
Cek WhatsApp logs tidak ada error
Tunjukkan cara cek notifikasi ke seluruh tim

🔔 Notifikasi & WhatsApp

STUDIOSTAFF memiliki tiga lapisan notifikasi untuk menjaga tim tetap ter-update.

Mekanisme	Kecepatan	Cara Kerja	Kondisi
Supabase Realtime	Instan	Broadcast via websocket saat ada perubahan data	Koneksi internet stabil
Window Focus	Event-driven	Cek metadata saat tab/window aktif kembali	Tab tidak aktif lalu dibuka lagi
Polling Fallback	15 detik	Polling `/api/data?meta=1` jika realtime gagal	Realtime timeout / error
WhatsApp	Instan	Pesan WA ke nomor yang terdaftar saat ada notifikasi baru	Nomor WA sudah diisi di profil staf

ℹ

Pause WhatsApp sementara? Settings → WhatsApp → toggle "⏸ Pause WA". Gunakan ini jika ada maintenance atau saat tidak ingin notifikasi dikirim.

⚠ Troubleshooting

Masalah umum dan cara mengatasinya.

Masalah	Kemungkinan Penyebab	Solusi
Data tidak tersimpan / "Save failed"	Koneksi internet putus / server error	Cek internet → klik 🔄 Update → refresh halaman (Cmd+R)
Notifikasi tidak muncul setelah refresh	Data sudah ter-mark di database	Klik 🔄 untuk pull data terbaru
App lambat / freeze	Memori browser penuh	Tutup tab lain → clear cache → coba browser lain
Tidak bisa login	Password salah / akun belum dibuat	Hubungi admin (Dissa) untuk reset password
Item baru tidak muncul di list	Data belum sync	Klik tombol 🔄 → cek status "✓ Saved" di bawah layar
WA notifications tidak terkirim	Nomor WA belum diisi / WA di-pause	Settings → Users → cek nomor WA → Settings → WA → cek status pause
Push notification error (browser)	Browser strict (Brave, Firefox) atau izin ditolak	Normal — app tetap berjalan, notifikasi lewat in-app dan WA

⚠

Jika data kelihatan hilang atau tidak sinkron: Jangan panik. Semua data tersimpan di Supabase. Cukup refresh halaman (Cmd+R / Ctrl+R) dan data akan di-load ulang dari database.

ℹ

Status bar bawah layar: ● Saving… = sedang simpan | ✓ Saved = berhasil | ✕ Save failed = gagal, akan retry otomatis (maks. 3x).