Visual Cues
Panduan membaca Visual Cues pada BPMN Editor — switch tunggal, legenda, pill per elemen (klik untuk membuka kartu detail), tanda peringatan, nama aksi integrasi, dan tab status notifikasi.
Visual Cues menampilkan satu pill kecil di bawah setiap elemen diagram yang relevan, merangkum informasi yang kalau tidak begitu harus dicari satu per satu lewat panel Properties — misalnya apakah sebuah task sudah punya form, siapa yang mengerjakannya, atau apakah ada script yang berjalan otomatis. Di pojok kanan atas pool, sebuah tab notifikasi ikut menampilkan status notifikasi proses itu.
Semuanya dikendalikan oleh satu switch. Tidak ada lagi toggle terpisah per jenis cue.
Menyalakan Visual Cues
- Buka file BPMN melalui menu Drive.
- Di pojok kanan bawah canvas, nyalakan switch
Visual cues. Switch ini berada di satu bar kontrol yang sama dengan status linter, Reading guide, tombol (?), kontrol zoom, dan tombol layar penuh.
Switch ini Off secara default — diagram yang baru pertama kali dibuka tidak menampilkan pill maupun tab apa pun sampai Anda menyalakannya sendiri. Saat dibuka, tidak ada detail yang sudah terbuka.
Begitu switch menyala, pill muncul di tepi bawah tiap elemen dan tab notifikasi muncul di pojok
kanan atas pool. Pada contoh di bawah, Start Event hanya punya segitiga kuning (Form Input belum
ada), Service Task punya integrasi (angka 2) dan script, tiga User Task punya pill form dan
penugasan, dan Script Task hanya punya ikon script:
Posisi switch (On/Off) disimpan per browser lewat localStorage, bukan per diagram dan bukan
di server. Switch yang sudah Anda nyalakan tetap menyala untuk diagram berikutnya yang Anda buka
di browser yang sama, tetapi tidak ikut menyala saat Anda membuka Studio dari komputer lain, dan
tidak terlihat oleh rekan kerja yang membuka diagram yang sama. Kalau localStorage tidak bisa
diakses (mis. mode private / site data diblokir), switch selalu kembali ke Off dan Studio tetap
terbuka normal — bukan error.
Legenda (?)
Di sebelah switch ada tombol (?). Klik untuk membuka legenda berjudul Visual cues. Legenda berisi satu baris untuk tiap jenis cue — Form status, Assignment type, Integrations, dan Custom script — dengan ikon dan satu paragraf penjelas tentang arti cue itu. Legenda hanya penjelasan; tidak ada toggle di dalamnya.
Kalimat penjelas Integrations di legenda masih berbunyi "Hover or focus the pill to see which ones". Itu sisa teks lama: detail pill tidak terbuka lewat hover maupun fokus, hanya lewat klik, Enter, atau Spasi (lihat Membuka kartu detail).
Pill dan Kartu Detail
Setiap elemen yang punya cue mendapat satu pill di tepi bawahnya. Pill berisi deretan ikon kecil, satu ikon per jenis cue yang berlaku untuk elemen itu, dengan urutan tetap dari kiri ke kanan:
| Ikon | Cue | Berlaku pada |
|---|---|---|
| Dokumen | Form Input | User Task, Start Event |
| Dokumen dengan kaca pembesar | Form Detail | User Task |
| Orang (atau dua orang untuk Candidate Groups) | Assignment | User Task |
| Konektor (plug) + angka | Integrations | Elemen yang membawa integrasi |
<> | Custom script | Script Task, atau elemen dengan listener script buatan sendiri |
Elemen hanya mendapat ikon untuk cue yang berlaku baginya, dan urutannya selalu sama. Elemen tanpa satu pun cue tidak mendapat pill. Hanya Integrations yang memakai angka; ikon form tidak memakai counter.
Posisi pill: pada task, pill rata kanan di tepi bawah task. Pada Start Event, pill ada di kiri bawah supaya tidak menutupi label event. Cue pada sequence flow (mis. listener yang terpasang di garis) tampil sebagai satu pill di titik tengah garis itu.
Tanda peringatan
Dua bentuk tanda kuning (amber) berarti bagian itu perlu perhatian, dan keduanya punya arti yang berbeda:
| Tanda | Arti |
|---|---|
| Segitiga kuning (menggantikan ikon dokumen) | Form Input belum ada atau belum berisi. Ikon dokumen disembunyikan; hanya segitiga yang tampil. |
| Ikon orang + tanda tanya kuning | Assignment belum diset: belum ada Assignee, Candidate Users, maupun Candidate Groups. |
Warna kuning tidak berdiri sendiri: bentuknya (segitiga atau tanda tanya) membedakan jenis peringatannya, sehingga tetap terbaca tanpa membedakan warna.
Kartu detail
Detail dibuka dengan klik pada pill. Dari keyboard, fokuskan pill dengan Tab lalu tekan Enter atau Spasi. Hanya satu kartu yang terbuka pada satu waktu:
- Klik pill lain memindahkan kartu ke pill itu.
- Klik pill yang sama, tekan Escape, atau klik di luar pill menutup kartu.
- Menggeser kursor ke atas pill (hover) atau sekadar memfokuskannya dengan Tab tidak membuka kartu.
Saat terbuka, pill memanjang sedikit dan menyatu dengan kartu di bawahnya, sehingga pill dan kartu terlihat sebagai satu bentuk. Tiap baris kartu berisi ikon, nama cue, sebuah chip yang menyebut nilainya, dan kadang satu baris keterangan.
Contoh kartu untuk User Task yang sudah lengkap — Form Input berisi dan penugasan ke satu anggota:
Contoh kartu untuk User Task yang penugasannya belum diatur dan punya satu integrasi Odoo. Chip kuning menandai bagian yang perlu perhatian:
Kartu menampilkan isi yang sama dengan label yang dibacakan pembaca layar saat pill difokus.
Form Input dan Form Detail
Chip menunjukkan jumlah elemen di form itu pada file BPMN yang sedang dibuka:
| Chip | Arti |
|---|---|
3 elements (netral) | Form berisi 3 elemen (kolom input, heading, tabel, dan sejenisnya). |
0 elements (kuning) | Form sudah dibuat, tetapi belum berisi satu pun elemen. |
Not added (kuning) | Form belum pernah dibuat. |
Form Builder selalu membuat kerangka kosong begitu form dibuka, jadi form yang dibuka tetapi belum
diberi satu pun elemen tampil sebagai 0 elements, bukan sebagai form yang berisi.
Form Input tampil pada User Task dan Start Event; bila belum ada atau kosong, pill hanya menampilkan segitiga kuning (lihat Tanda peringatan). Form Detail hanya ada pada User Task dan bersifat opsional: barisnya hanya tampil kalau Form Detail berisi. Form Detail yang kosong atau belum dibuat tidak menambah ikon maupun baris.
Chip ini hanya berarti "file ini punya definisi form" — bukan berarti form itu adalah versi yang sedang aktif dipakai di proses yang sudah di-deploy. Sebuah proses bisa punya form di editor yang belum pernah di-deploy ulang, atau sudah diganti oleh versi form lain di riwayat Form Versioning (lihat BPMN Form Versioning). Untuk tahu form mana yang benar-benar dipakai user saat mengisi task, cek riwayat versi form tersebut, bukan cuma pill ini.
Assignment
Muncul pada User Task. Chip menunjukkan bagaimana penugasan task itu diselesaikan:
| Chip | Arti |
|---|---|
Individual | Ditugaskan ke satu anggota tertentu (Assignee). |
Multiple | Ditugaskan ke daftar Candidate Users. |
Group | Ditugaskan ke Candidate Groups. |
Dynamic | Nilainya dihitung saat proses berjalan (dari field atau expression), bukan nilai tetap. |
Not set (kuning) | Belum ada satu pun dari Assignee / Candidate Users / Candidate Groups yang diisi. Pill menampilkan ikon orang dengan tanda tanya kuning. |
Ikon pada pill berbentuk satu orang untuk Individual, Multiple, dan Dynamic, dan ikon
kelompok untuk Group. Baris keterangan di bawah chip menyebut nilainya, mis. Assignee:
finance@javan.co.id atau Candidate Groups: team. Kalau lebih dari satu kategori terisi
sekaligus, chip menampilkan yang paling spesifik (Individual > Multiple > Group >
Dynamic), dan keterangannya tetap mencantumkan semua kategori yang terisi.
Integrations
Muncul pada elemen yang membawa integrasi addon — baik lewat Execution Listener (mis. addon Odoo,
atau addon lain yang dipasang lewat panel Integration) maupun lewat properti integrasi pada
Service Task. Ikonnya diikuti angka jumlah integrasi; kartu menampilkan chip N attached
dan satu baris keterangan per integrasi dengan nama yang mudah dibaca, berbentuk
<nama addon> — <nama aksi>, mis. Odoo — Get employees atau Telegram — Send message. Nama
aksi diambil dari katalog addon, bukan kunci teknisnya (post_odoo_journals tampil sebagai
Create journal entry).
Pada diagram yang memakai integrasi di beberapa elemen — termasuk End Event/Message Event dan sequence flow — tiap elemen tetap hanya mendapat satu pill:
Kalau elemen tidak punya integrasi sama sekali, ikon ini tidak muncul — beda dengan Assignment
yang punya chip Not set. Ketiadaan ikon berarti "tidak terdeteksi ada integrasi", bukan tanda
peringatan.
Cue ini hanya menghitung berapa integrasi yang terpasang, bukan status jalannya. Sukses atau gagalnya eksekusi integrasi saat proses berjalan tidak ditampilkan di BPMN Editor sama sekali — cek riwayat eksekusi di tempat lain (mis. log addon atau Task History), jangan simpulkan integrasi "sehat" hanya karena angkanya muncul di editor.
Custom script
Muncul pada Script Task, atau elemen apa pun yang punya Execution/Task Listener bertipe script
(mis. Groovy) yang ditulis sendiri oleh pembuat diagram. Chip-nya Script; keterangannya
menyebut sumbernya (mis. Script task — groovy).
Listener yang dibuat otomatis oleh Studio — empat Task Listener bawaan tiap User Task, listener korelasi Message Event, dan listener addon Odoo — tidak memicu cue ini, karena bukan script yang ditulis pengguna.
Menemukan Elemen di Canvas
Pill bisa dijangkau lewat keyboard: tekan Tab sampai cincin fokus mendarat pada pill. Setiap pill berperan sebagai tombol dan membawa label ringkasan semua cue-nya, jadi pembaca layar langsung membacakan isinya begitu pill difokus. Tekan Enter atau Spasi untuk membuka kartu detail, dan Escape untuk menutupnya tanpa memindahkan fokus. Fokus saja tidak membuka kartu. Memindahkan fokus ke pill berikutnya dengan Tab menutup kartu yang terbuka.
Notification Status
Status notifikasi proses ditampilkan sebagai tab di pojok kanan atas pool (satu tab per pool, menunjukkan status proses di pool itu). Tab ini ikut switch Visual cues: menyala bersama pill, hilang bersama pill. Diagram tanpa pool tidak punya pojok untuk dijadikan jangkar, sehingga tab-nya muncul di pojok kanan atas canvas.
Tab berisi dua ikon — lonceng untuk New task assignment dan jam alarm untuk Reminder — dan ikon dicoret dan tampak redup ketika statusnya Off. Klik tab untuk membuka kartunya; aturannya sama dengan pill pada elemen (hanya klik, Enter, atau Spasi; hanya satu kartu terbuka pada satu waktu, termasuk dibanding pill elemen).
On, Off, dan sumbernya
Tiap baris kartu menunjukkan status On atau Off, beserta sumber nilainya:
| Sumber | Arti |
|---|---|
| Default workspace | Proses ini tidak punya pengaturan sendiri; status mengikuti konfigurasi notifikasi workspace. |
| Override for this process | Proses ini punya pengaturan notifikasi sendiri yang menimpa default workspace. |
Contoh saat kedua notifikasi Off — New task assignment mengikuti default workspace, Reminder punya override untuk proses ini. Kedua ikon di tab tampil dicoret:
Contoh saat New task assignment On (chip hijau, mengikuti default workspace) dan Reminder Off (ikon jam dicoret, punya override untuk proses ini):
Unknown
Kalau status tidak bisa dipastikan, kartu menampilkan satu baris Notifications dengan chip
kuning Unknown, dan tab hanya berisi satu ikon tanda tanya kuning:
- "Requires Admin SOP access" — akun yang sedang login tidak punya izin membaca konfigurasi notifikasi workspace ini.
- "Could not load notification status" — permintaan ke server gagal karena sebab lain (mis. jaringan).
Kartu juga menegaskan bahwa Unknown tidak sama dengan Off: status tidak bisa diperiksa.
Dalam kedua kondisi itu, Unknown bukan berarti notifikasi mati — artinya editor memang tidak
bisa memastikan status sebenarnya untuk akun yang sedang login.
Status ini dibaca per proses, bukan per task — kartu tidak bisa menjawab "apakah Reminder aktif untuk task X", hanya "apakah Reminder aktif untuk proses ini secara umum".
Kapan status diperbarui
Status dimuat sekali setiap kali switch dinyalakan atau diagram selesai dimuat — bukan setiap kali kartu dibuka, dan bukan setiap kali diagram diedit. Kalau pengaturan notifikasi diubah saat diagram sedang terbuka dengan switch menyala, kartu tetap menampilkan status lama sampai switch dimatikan lalu dinyalakan lagi (atau diagram dibuka ulang).
Catatan
- Switch Visual cues dan tombol (?) ada di baris kontrol canvas yang sama dengan Reading Guide; keduanya independen satu sama lain.
- Semua pill dihitung langsung dari XML diagram yang sedang terbuka di editor, termasuk perubahan yang belum disimpan — sama seperti Reading Guide. Status notifikasi pada tab adalah pengecualian: ia berasal dari server, bukan dari XML.
