RANGGAEGHAPERMANA
Kembali ke daftar proyek
  • Vertical SaaS · Service Operations
  • 2026

Studi kasus · 02 / 08

Tritama Barber

Booking, antrean, transaksi, dan komisi dalam satu alur layanan.

Tritama Barber — tangkapan layar

Sistem manajemen barbershop yang menghubungkan customer journey dengan operasional internal—mulai dari appointment hingga slip gaji barber.

Peran saya
Full-stack Engineer
Status
Public repository

Pencapaian utama

Menghubungkan booking, antrean, kasir, dan komisi barber dalam satu siklus layanan yang bisa ditelusuri.

Tritama Barber — tangkapan layar

01 · Konteks

Masalah yang ingin diselesaikan.

Pengguna utama

  • Owner barbershop
  • Petugas front desk
  • Barber

Masalahnya

Booking, antrean walk-in, pembayaran, performa barber, dan penggajian sering dicatat terpisah sehingga jadwal bentrok dan komisi sulit direkonsiliasi.

Pendekatannya

Sistem membentuk satu lifecycle layanan: appointment atau antrean memilih barber dan layanan, transaksi menyelesaikan pembayaran, lalu komisi masuk ke perhitungan slip gaji.

Angka kunci

  • 5alur operasional terhubung
  • 4metode pembayaran
  • 10%komisi otomatis

02 · Peran saya

Bagian yang saya kerjakan.

Full-stack Engineer

Teknologi yang digunakan

  • Laravel 12
  • Sanctum
  • React 19
  • Vite
  • Tailwind CSS
  • Zustand
  • MySQL
  • DomPDF
  1. 01

    Membangun booking dengan slot waktu dan barber pilihan untuk mencegah jadwal bentrok.

  2. 02

    Membuat papan antrean dengan status menunggu, dikerjakan, dan selesai.

  3. 03

    Membangun kasir yang mendukung cash, debit, QRIS, transfer, diskon, dan promo.

  4. 04

    Menghitung komisi secara otomatis dan menerbitkan slip gaji PDF untuk barber.

03 · Sorotan

Beberapa tampilan pilihan.

Klik gambar untuk melihatnya lebih besar.

Geser untuk melihat semua, ketuk gambar untuk memperbesar.

Web

Dashboard bisnis

KPI penjualan, metode pembayaran, layanan terlaris, dan performa barber.

Web

Papan antrean

Antrean menunggu, diproses, dan selesai yang diperbarui langsung.

Web

Transaksi kasir

Transaksi harian beserta nilai dan petugasnya.

Web

Slip gaji barber

Rekap payroll bulanan yang menggabungkan gaji pokok dan komisi.

01 / 04

04 · Tantangan & keputusan

Masalah teknis dan cara saya menyelesaikannya.

01 · Tantangan

Jadwal barber sering bentrok

Pendekatan

Booking menyimpan slot waktu dan barber pilihan, sementara antrean walk-in mengikuti status layanan.

Hasil

Owner dan front desk tahu siapa melayani siapa, dan kapan.

02 · Tantangan

Komisi sulit direkonsiliasi

Pendekatan

Setiap item transaksi mencatat barber dan layanannya, lalu masuk ke perhitungan slip gaji.

Hasil

Barber menerima slip gaji yang bisa ditelusuri sampai ke transaksinya.

01 / 02

05 · Hasil

Apa yang dihadirkan solusi ini.

Owner dapat membaca pendapatan dan performa barber, petugas dapat mengelola antrean harian, dan barber memperoleh perhitungan komisi yang dapat ditelusuri.

Alur penggunaan

  1. 01Booking / walk-in
  2. 02Pilih barber & layanan
  3. 03Masuk antrean
  4. 04Layanan berlangsung
  5. 05POS & pembayaran
  6. 06Komisi tercatat
  7. 07Slip gaji & laporan

Arsitektur

Experience

React SPA · queue board · booking · POS · dashboard

API

Laravel REST API · Sanctum · notification & PDF services

Business rules

slot booking · queue status · transaction · commission

Data

MySQL relational model · scheduled jobs · mail delivery

Model data

Customer

name

phone

visit_count

Barber

user_id

specialization

commission

Service

name

duration

price

Appointment

customer_id

barber_id

scheduled_at

Queue

appointment_id

number

status

Transaction

customer_id

payment_method

total

Transaction Item

transaction_id

service_id

barber_id

Salary Slip

barber_id

period

base

commission

  • Customer 1—N Appointment / Transaction
  • Barber 1—N Appointment / Transaction Item
  • Appointment 0—1 Queue
  • Transaction 1—N Transaction Item
  • Barber 1—N Salary Slip
Proyek berikutnyaTCF SuperappsSatu pintu untuk cuti, lembur, absensi, izin, dan ruang meeting karyawan.