Comments (0)
Mendesain Form Yang Lebih Baik – Bagian 2
Lanjutan dari kesalahan umum yang dibuat oleh perancang dan cara memperbaikinya.
8. Jadikan CTA deskriptif
Sebuah Call To Action/CTA (panggilan untuk bertindak) sebaiknya dijelaskan tujuannya.
9. Tempatkan keterangan error dalam satu baris
Tunjukkan kepada pengguna dimana letak terjadi kesalahan (error) dan berikan penyebabnya.
10. Gunakan validasi dalam satu baris setelah pengguna mengisi field (kecuali jika itu membantu mereka saat dalam prosesnya)
Jangan gunakan validasi dalam satu baris saat pengguna mengetik – kecuali jika itu membantu mereka – seperti dalam hal membuat kata sandi, nama pengguna atau pesan dengan jumlah karakter.
11. Jangan sembunyikan helper text dasar
Sebisa mungkin tampakkan teks pembantu (helper text) dasar. Untuk helper text yang kompleks, pertimbangkan untuk menempatkannya di sebelah input selama dalam keadaan fokusnya.
12. Bedakan tindakan primer dari sekunder
Terdapat perdebatan filosofis yang lebih besar mengenai apakah opsi sekunder pun bahkan harus dimasukkan.
13. Manfaatkan panjang field
Tempat data (field) yang panjang menghasilkan jawaban yang panjang. Gunakan ini untuk field yang memiliki jumlah karakter yang ditentukan seperti nomor telepon, kode pos, dll.
14. Singkirkan tanda bintang (*) dan tunjukkan field opsional
Pengguna tidak selalu tahu apa yang tersirat oleh penanda field yang diharuskan untuk diisi (*). Sebaliknya, jauh lebih baik untuk memberikan tanda pada field opsional.
15. Kelompokkan informasi terkait
Pengguna berpikir dalam kelompok-kelompok, dan form yang panjang bisa terasa membingungkan. Dengan mengelompokkan input, pengguna akan memahami form dengan lebih cepat.
(Sumber: https://uxdesign.cc – Andrew Coyle)
Recent Posts
Recent Comments
Archives
LATEST VIDEO
Tags
- ai
- analysis
- application
- art
- articles
- artificial intelligence
- audio
- block chain
- business
- cloud
- coding
- cryptocurrency
- culture
- data
- database
- design
- desktop
- development
- digital
- economy
- encryption
- enterprise
- events
- framework
- hardware
- health
- html/css
- Image
- industry
- infomation
- information
- internet
- jquery
- knowledge
- management
- mobile
- officesuite
- online
- open source
- program
- programming
- proprietary
- PROSolvIT
- Quote
- RDO-POS
- reendoosystem
- RHomeS
- robotic
- security
- server
- SiReDisH
- SiReDU
- SiReGi
- software
- sound
- spreadsheet
- system
- technology
- tips
- tool
- tricks
- tutorial
- ui
- userexperience
- userinterface
- ux
- video
- virtual reality
- vr
- web
- web design
- website
- wordpress
LEAVE A REPLY
Your email address will not be published. Required fields are marked *