Bagaimana Kami Membuat Elemen UI Input Untuk Platform Chatbot Kami
Diterbitkan: 2017-01-01Chatbots, seperti yang ada saat ini, tidak memiliki banyak kemampuan untuk memahami bahasa alami manusia. Dan ini adalah salah satu alasan utama mengapa sebagian besar aplikasi perpesanan (Messenger, Kik, dll.) menggunakan campuran UI grafis dan teks di platform bot mereka — pikirkan tombol, komidi putar, kartu gambar, dan bukan hanya respons teks.
Kami, di Tars, menggunakan browser sebagai platform untuk membangun antarmuka obrolan kami sendiri agar bot dapat beroperasi. Dan ini memberi kita kebebasan penuh atas semua komponen yang kita miliki. Jika Anda telah mencoba salah satu bot kami (jika belum, coba dulu di sini dan di sini), Anda akan tahu bahwa kami sangat mendukung pendekatan berbasis teks + UI grafis. Sebagai bagian dari proses pemikiran ini, kami telah membuat sejumlah input keyboard khusus di antarmuka front-end kami untuk memfasilitasi interaksi dan situasi pengguna yang berbeda.
Messenger, Kik, Telegram adalah platform besar tempat pengembang menyebarkan ratusan bot setiap hari. Saya masih merasa platform perpesanan ini belum melakukan cukup banyak pada komponen front-end untuk membantu pembuat booming menciptakan interaksi pengguna yang memperkaya.
Dan itulah mengapa, saya ingin berbicara lebih banyak tentang bagaimana kami membuat setiap UI khusus, mengapa masing-masing dari mereka masuk akal dan bagaimana kurangnya mereka mengacaukan interaksi pengguna saat ini.
Jadi di sini kita pergi:
Penggulir Tanggal dan Waktu
Pikirkan skenario di mana Anda perlu bertanya kepada pengguna kapan dia ingin membuat janji? Ada beberapa cara untuk memberikan informasi yang sama.
25 November, 25 November, 25 November, 25/11, 25–11–2016, 25/11/16 — semuanya pada dasarnya memiliki arti yang sama tetapi menjadi sulit bagi mesin untuk memahami data ini.
Inilah sebabnya kami telah memasukkan penggulung tanggal dan waktu di mana pengguna dapat memutar tombol dan memilih tanggal/waktu.
Saya belum melihat platform perpesanan lain yang menyediakan UI ini sampai sekarang dan saya merasa ini harus dimiliki jika bot meminta tanggal atau waktu dari pengguna.
Tombol Vertikal
Anggap ini sebagai opsi pilihan ganda dalam bentuk di mana Anda memiliki sejumlah hal untuk dipilih. Mengetuk tombol membuat interaksi lebih cepat dan juga membatasi ruang lingkup percakapan.
Pendekatan berbasis tombol masuk akal ketika Anda harus memilih antara pizza vegetarian dan non-sayuran, tetapi itu mungkin bukan UI terbaik jika Anda memiliki 100 polis asuransi untuk dipilih.
Apa lagi yang bisa dilakukan dengan tombol vertikal?
- tambahkan gambar di sebelah setiap opsi untuk membuatnya lebih menarik secara visual.
- Anda dapat membiarkan pengguna merespons satu ketukan atau membuatnya mengeklik "Kirim" setelah ia mengetuk salah satu opsi. Yang terakhir membantu dalam mengonfirmasi ulang jika pengguna tidak memilih opsi tertentu secara tidak sengaja. Tidak ada cara untuk kembali ke alur obrolan dan itulah mengapa penyesuaian ini masuk akal.
- tambahkan menu info cepat ke setiap opsi untuk memberikan informasi terperinci dan membuat proses pengambilan keputusan menjadi lebih baik.
Tidak semua orang tahu perbedaan antara Advance dan Basic Facial. Menambahkan detail seputar apa saja yang disertakan dan harga membuat pengalaman pengguna menjadi lebih baik.
Satu hal lagi yang penting untuk diingat saat Anda menggunakan UI Tombol adalah membingkai pertanyaan Anda dengan cara yang benar. Seperti yang dijelaskan Leszek dalam artikelnya di sini, lebih baik mengajukan pertanyaan dengan cara yang membatasi rentang opsi dan menetapkan konteks daripada mengajukan pertanyaan yang sangat terbuka.
Membatasi Masukan Pengguna
Saya merasa ini adalah salah satu hal terbaik yang telah kami lakukan pada antarmuka obrolan kami. Setiap kali kami memberikan UI input grafis (tombol, korsel dll), kami tidak mengizinkan pengguna untuk mengetikkan apa pun dalam teks.
Mengapa melakukan itu? Karena pengguna dapat mengetik apa saja di luar sana dan bot Anda belum siap untuk itu. Sampai Anda berada di sana, lebih baik tetap sederhana dan terbatas daripada memutuskan percakapan.
Direkomendasikan untukmu:
Bagaimana Metaverse Akan Mengubah Industri Otomotif India
Apa Arti Ketentuan Anti-Profiteering Bagi Startup India?
Bagaimana Startup Edtech Membantu Tenaga Kerja India Meningkatkan Keterampilan & Menjadi Siap Masa Depan...
Saham Teknologi Zaman Baru Minggu Ini: Masalah Zomato Berlanjut, EaseMyTrip Posting Stro...
Startup India Mengambil Jalan Pintas Dalam Mengejar Pendanaan
Platform Pemasaran Digital Logicserve Bags Pendanaan INR 80 Cr, Berganti Nama Sebagai LS Dig...
Apa yang kami lakukan adalah ini:
Ini adalah antarmuka obrolan kami
Dan inilah yang terjadi ketika Anda tidak memiliki sesuatu seperti ini:
Ini adalah Facebook Messenger yang tidak mengizinkan input teks terbatas saat Anda memiliki balasan cepat
Tombol Selesai dan Lulus
Ini adalah dua nuansa yang sangat kecil yang akhirnya kami gabungkan karena kami selalu menganggap chatbot bernaskah sebagai evolusi bentuk.
Saat Anda mengirim melalui alamat Anda atau memberikan umpan balik terperinci melalui antarmuka obrolan, perilaku umum adalah menekan tombol kirim setelah menulis beberapa kata dan seluruh tanggapan akhirnya tersebar di 3-4 pernyataan. Dengan “Tombol Selesai”, Anda dapat terus mengetik dan menekan tombol ini setelah Anda memberikan respons yang lengkap.
Jika Anda tidak memiliki opsi seperti itu, pesan berikutnya dari mesin akan datang setelah instance pertama itu sendiri yang menghasilkan respons yang tidak lengkap.
Miliki tombol "Selesai" ketika Anda harus memilih beberapa opsi atau memiliki respons multi-baris
Mungkin juga ada kasus di mana pengguna ingin melewatkan pertanyaan dan untuk itu, kami memiliki "tombol Lulus" sebagai pengganti "tombol Kirim". Segera setelah pengguna mulai mengetik, tombol Lulus berubah menjadi tombol Kirim.
Tidak ingin memberikan email Anda? Ketuk "Lulus" untuk melewati pertanyaan.
Saran Pelengkapan Otomatis
Ini seperti fungsionalitas pelengkapan otomatis di pencarian google tempat Anda mulai mengetik dan ini menyarankan opsi yang memungkinkan. Ini menjadi sangat berguna ketika Anda memiliki daftar opsi yang panjang dan memiliki tombol vertikal bukanlah opsi yang layak. Pikirkan daftar panjang daerah, kota, model mobil, dll.
Bintang dan Suka
Sangat berguna ketika Anda meminta umpan balik atau pengalaman pengguna dan responsnya lebih kualitatif. Dan Anda bahkan dapat menyesuaikan ikon menjadi bintang, suka, hati, emotikon.
Kartu Gambar
Ini berguna di mana Anda perlu menampilkan banyak informasi tentang setiap item sekaligus. Bisa jadi burger dalam proses pemesanan makanan atau kemeja dalam alur belanja. Semua kartu ditumpuk satu sama lain dan Anda dapat menggulir untuk melihat semua opsi.
Ada 4 bagian dari elemen UI ini — gambar, judul, deskripsi, dan footer. Anda dapat memanfaatkan ini secara berbeda tergantung pada apa yang ingin Anda tampilkan di sana.
Jika Anda ingin menguji semua elemen UI input ini, berikut adalah tautan ke chatbot yang akan membawa Anda melalui satu per satu.
Obrolan menjadi antarmuka minimalis hanya dengan gelembung dan kotak teks tidak memberikan banyak ruang lingkup. Dan saya yakin kita harus memikirkan kembali bagaimana kita dapat memfasilitasi berbagai interaksi dengan menggunakan elemen yang ada dan menambahkan elemen baru ke antarmuka obrolan.
Ingin tahu apakah Anda telah bermain-main dengan antarmuka perpesanan sendiri dan telah menambahkan beberapa elemen GUI keren lainnya ke dalamnya?
[Postingan oleh Ish Jindal ini pertama kali muncul di Medium dan telah direproduksi dengan izin.]