Fulfillment Wireframes

4 layar utama fulfillment Phase 2. Setiap wireframe pakai design system LabaBersih v2 dan bisa langsung diterjemahkan ke Phoenix LiveView HEEx template.

Phase 2 4 Screens Interactive Phoenix LiveView Ready
/app/fulfillment

Screen 1: Fulfillment Dashboard

Overview untuk Nelly dan kepala gudang. Lihat pipeline, bottleneck, dan aktivitas terkini.

Pick
45
Pack
23
Ship
12
Selesai
95
8 order menunggu packing > 2 jam. Pertimbangkan tambah packer.
Menunggu Pick 45
PS2603-042 3 mnt
Budi Santoso
x6 items | Zona Frozen
PS2603-041 5 mnt
Siti Rahayu
x3 items | Zona Dry
PS2603-040 8 mnt
Andi Wijaya
x2 items | Zona Frozen
PS2603-039 12 mnt
Dewi Lestari
x4 items | Zona Frozen
PS2603-038 15 mnt
Rizky Pratama
x1 item | Zona Dry
+40 lainnya...
Buat Pick List
Menunggu Pack 23
PS2603-035 18 mnt
Ahmad Fauzi
x4 items | Nelly
PS2603-034 25 mnt
Maya Sari
x2 items | Belum di-assign
PS2603-033 30 mnt
Joko Susanto
x5 items | Belum di-assign
PS2603-032 2 jam+
Putri Handayani
x3 items | Terlalu lama
PS2603-031 2.5 jam+
Hendra Kusuma
x6 items | Terlalu lama
+18 lainnya...
Buka Packing Station
Siap Kirim 12
PS2603-028 45 mnt
Fajar Nugroho
x3 items | JNE
PS2603-027 50 mnt
Rina Wulandari
x1 item | J&T
PS2603-026 55 mnt
Tommy Susanto
x2 items | SiCepat
PS2603-025 1 jam
Linda Agustin
x4 items | JNE
PS2603-024 1.2 jam
Bambang Hermawan
x2 items | J&T
+7 lainnya...
Handover Kurir

Aktivitas Terkini

PS2603-042 picked → packing — 2 menit lalu
PS2603-038 packed → shipped (JNE) — 5 menit lalu
PS2603-036 masalah dilaporkan: item salah — 12 menit lalu
PL2603-002 pick list selesai oleh Andi — 18 menit lalu
Handover JNE selesai (32 paket) oleh Nelly — 45 menit lalu
Hari ini: 95 order dikirim, 3 masalah dilaporkan, rata-rata 45 menit pick-to-ship
/app/fulfillment/pick/PL2603-001

Screen 2: Pick List

Layar focused untuk picker. Mobile-friendly. Items dikelompokkan per lokasi gudang.

Gudang Kediri 1 Apr 2026 7 item, 3 order
4/7 items
57%
Zona Frozen — Rak A 2/3 items picked
FB-AYM-1KG
Forbest Ayam 1kg
x6
Bin A-03
FB-SPI-500G
Forbest Sapi 500g
x3
Bin A-05
FB-NUG-250G
Forbest Nugget 250g
x4
Bin A-08
Zona Frozen — Rak B 2/2 items picked
RTN-1L
Ritrina 1 Liter
x2
Bin B-01
ORG-MAX-500
Orgamax 500ml
x1
Bin B-04
Zona Dry — Rak C 0/2 items picked
BMP-SAUCE-250
Bumbu Sauce 250ml
x2
Bin C-12
SAMP-PKT-10
Sampler Pack 10pcs — Tidak ditemukan
x1
Bin C-15
4/7 items picked
/app/fulfillment/pack

Screen 3: Packing Station

Layar focused untuk packer. Desktop, scan-heavy. 2 state: menunggu scan dan order loaded.

State A: Menunggu Scan
Scan barcode untuk mulai packing
State B: Order Loaded (setelah scan)
Verifikasi Item 3/5 items — 60%
FB-AYM-1KG
Forbest Ayam 1kg
3/3 ✓
FB-SPI-500G
Forbest Sapi 500g
1/1 ✓
RTN-1L
Ritrina 1 Liter
2/2 ✓
ORG-MAX-500
Orgamax 500ml
0/1 — scan
← Scan sekarang
BMP-SAUCE-250
Bumbu Sauce 250ml
0/2
FB-AYM-1KG verified (3/3)
FB-SPI-250G bukan milik order ini
Forbest Ayam sudah 3/3, jangan scan lagi

Info Order

Customer Budi Santoso
Toko TikTok Bestari
Kurir JNE REG
Resi JX77099001
Items 5
Total Rp 735.000

Packer

Nama Nelly
Mulai 14:32 WIB
Durasi 2:45
/app/fulfillment/handover

Screen 4: Courier Handover

Serah terima paket ke driver kurir. Scan resi, catat driver, print manifest.

45
JNE
32
J&T
18
SiCepat
95
Total
Semua 95
JNE 45
J&T 32
SiCepat 18
JNE Express
12/45 paket diserahkan
Resi
Order
Customer
Total
JX77099001
PS2603-028
Fajar Nugroho
Rp 245.000
JX77099002
PS2603-025
Linda Agustin
Rp 180.000
JX77099003
PS2603-022
Agus Setiawan
Rp 312.000
JX77099004
PS2603-020
Wati Rahmawati
Rp 155.000
JX77099005
PS2603-018
Dian Permata
Rp 490.000
... +40 paket lainnya
Info Driver
Navigasi Wireframes
1
Fulfillment Dashboard
/app/fulfillment
2
Pick List
/app/fulfillment/pick/:id
3
Packing Station
/app/fulfillment/pack
4
Courier Handover
/app/fulfillment/handover