Tooltip

Komponen teks yang bertujuan untuk memberikan informasi tambahan secara singkat dan kontekstual ketika pengguna melakukan interaksi tertentu, seperti hover, focus, atau tap pada sebuah elemen.


Tooltip - container

Anatomi

Tooltip - Anatomi

Jenis dan variasi

Tooltip panah kanan

Digunakan untuk penempatan Tooltip yang muncul di bagian kiri suatu elemen.

Tooltip - container2

Tooltip panah kiri

Digunakan untuk penempatan Tooltip yang muncul di bagian kanan suatu elemen.

Tooltip - container3

Tooltip panah bawah

Digunakan untuk penempatan Tooltip yang muncul di bagian atas suatu elemen.

Tooltip - container4

Tooltip panah atas

Digunakan untuk penempatan Tooltip yang muncul di bagian bawah suatu elemen.

Tooltip - container5

Behaviors

Tooltip hanya akan muncul jika ada sebuah aksi yang dilakukan terhadap suatu elemen, seperti Hover, Focus, atau Tap.

Panduan penggunaan

Gunakan Tooltip untuk informasi yang sifatnya sekunder/penjelas dari sebuah elemen

Jangan gunakan Tooltip untuk informasi yang sifatnya penting/utama.

Group 39960

Harus dipasangkan dengan suatu elemen (tidak berdiri sendiri)

Tooltip merupakan informasi tambahan sehingga kemunculannya harus dipicu oleh suatu interaksi pada sebuah elemen utama, tidak langsung muncul.

Group 7

Sifatnya tidak permanen

Tooltip tidak boleh menjadi distraksi dalam sebuah tampilan tatap muka, sehingga Tooltip ini hanya dapat keluar jika dipicu oleh sebuah aksi tertentu, dan bisa hilang dengan sendirinya.

Panduan penulisan

Tooltip - PT

Cukup satu atau dua kalimat

Untuk menyampaikan informasi, cukup berikan informasi inti dengan kata-kata inti. Jelaskan fungsi atau tindakan elemen dengan jelas dan sederhana.

Gunakan sentence case

Hanya huruf di awal kalimat yang ditulis kapital, serta hindari tanda titik “.” di akhir kalimat.