Circca HIG · Design system Divistant
Aplikasi kerja yang tenang dan cepat dibaca.
Token, komponen React, dan pedoman untuk BizOps dan produk Divistant lain. Mengikuti prinsip Apple Human Interface Guidelines, disesuaikan untuk dokumen bisnis berbahasa Indonesia: PO, BAST, invoice, dan pipeline penjualan.
- Mulai memakaiPasang paket, atur tema, dan pakai komponen pertama di Next.js.
- FoundationsWarna semantik, tipografi Manrope + Inter, material kaca.
- Semua komponen65 keluarga komponen beserta status kodenya.
Prinsip
- Tenang
- Antarmuka kerja harian: netral, lega, warna dipakai untuk makna — bukan dekorasi. Satu warna aksen (biru sistem) untuk yang bisa diklik.
- Cepat dibaca
- Data banyak tetap mudah dipindai: hierarki lewat tipografi dan ruang, bukan bingkai di mana-mana. Angka rata kanan dan tabular.
- Fleksibel
- Satu komponen untuk desktop, tablet, dan ponsel; tiga brand (Divistant, BizOps, IntegraCI); terang, gelap, dan kontras tinggi.
- Figma = kode
- Nama token, komponen, properti, dan varian sama persis di Figma dan di React. Desain dulu, lalu kode.
Status
Desain di Figma sudah lengkap; kode React dibangun bertahap mengikuti prioritas produk.
65keluarga komponen di Figma
11komponen siap di React
3 × 4brand × tema (terang, gelap, kontras tinggi)
Library Figma
Aktifkan ketiga library di file desain produk lewat panel Assets › Libraries.