วิธีที่เราไปเกี่ยวกับการสร้างองค์ประกอบ UI อินพุตสำหรับแพลตฟอร์ม Chatbot ของเรา
เผยแพร่แล้ว: 2017-01-01Chatbots อย่างที่มันมีอยู่ในปัจจุบัน มีความสามารถไม่มากที่จะเข้าใจภาษามนุษย์ตามธรรมชาติ และนี่คือเหตุผลหลักประการหนึ่งที่ทำให้แอปรับส่งข้อความส่วนใหญ่ (Messenger, Kik ฯลฯ) หันไปใช้ UI แบบกราฟิกและข้อความในแพลตฟอร์มบอท — ลองนึกถึงปุ่ม ภาพหมุน การ์ดรูปภาพ ไม่ใช่แค่การตอบกลับด้วยข้อความ
พวกเราที่ Tars กำลังใช้เบราว์เซอร์เป็นแพลตฟอร์มในการสร้างส่วนต่อประสานการแชทของเราเองเพื่อให้บอททำงาน และสิ่งนี้ทำให้เรามีอิสระอย่างเต็มที่ในสิ่งที่เรามีส่วนประกอบทั้งหมด หากคุณได้ลองใช้บอทของเราแล้ว (หากยังไม่ได้ลอง ลองใช้ที่นี่และที่นี่ก่อน) คุณจะรู้ว่าเราสนับสนุนอย่างยิ่งต่อ UI แบบกราฟิก + วิธีการแบบข้อความ ในกระบวนการคิดนี้ เราได้สร้างอินพุตคีย์บอร์ดแบบกำหนดเองจำนวนมากในอินเทอร์เฟซส่วนหน้าของเรา เพื่ออำนวยความสะดวกในการโต้ตอบและสถานการณ์ของผู้ใช้ที่แตกต่างกัน
Messenger, Kik, Telegram เป็นแพลตฟอร์มขนาดใหญ่ที่นักพัฒนาปรับใช้บอทหลายร้อยตัวในแต่ละวัน ฉันยังรู้สึกว่าแพลตฟอร์มการส่งข้อความเหล่านี้ยังไม่เพียงพอในองค์ประกอบส่วนหน้า เพื่อช่วยบูมเมคเกอร์สร้างการโต้ตอบกับผู้ใช้ที่สมบูรณ์ยิ่งขึ้น
นั่นเป็นเหตุผลที่ฉันต้องการพูดคุยเพิ่มเติมเกี่ยวกับวิธีที่เราดำเนินการสร้าง UI แบบกำหนดเองแต่ละรายการ เหตุใดแต่ละอินเทอร์เฟซจึงสมเหตุสมผล และการที่ขาดอินเทอร์เฟซเหล่านี้ทำให้การโต้ตอบกับผู้ใช้แย่ลงได้อย่างไร
ไปกันเลย:
ตัวเลื่อนวันที่และเวลา
ลองนึกถึงสถานการณ์ที่คุณต้องถามผู้ใช้ว่าต้องการนัดหมายเมื่อใด สามารถให้ข้อมูลเดียวกันได้หลายวิธี
25 พ.ย. 25 พ.ย. 25 พ.ย. 25/11 25-11-2559 วันที่ 25/11/2559 โดยพื้นฐานแล้วมีความหมายเหมือนกัน แต่เครื่องจะเข้าใจข้อมูลนี้ได้ยากขึ้น
นี่คือเหตุผลที่เราได้รวมตัวเลื่อนวันที่และเวลาซึ่งผู้ใช้สามารถหมุนแป้นหมุนและเลือกวันที่/เวลาได้
ฉันไม่เคยเห็นแพลตฟอร์มการส่งข้อความอื่นใดที่มี UI นี้มาก่อน และฉันรู้สึกว่านี่เป็นสิ่งที่ต้องมีหากบอทขอวันที่หรือเวลาจากผู้ใช้
ปุ่มแนวตั้ง
คิดว่าสิ่งเหล่านี้เป็นตัวเลือกแบบหลายตัวเลือกในรูปแบบที่คุณมีตัวเลือกจำนวนจำกัด การแตะที่ปุ่มจะทำให้การโต้ตอบเร็วขึ้นและยังจำกัดขอบเขตของการสนทนาอีกด้วย
วิธีการแบบใช้ปุ่มนั้นสมเหตุสมผลเมื่อคุณต้องเลือกระหว่างพิซซ่ามังสวิรัติและพิซซ่าที่ไม่ใช่ผัก แต่อาจไม่ใช่ UI ที่ดีที่สุดหากคุณมีกรมธรรม์ให้เลือก 100 กรมธรรม์
ปุ่มแนวตั้งสามารถทำอะไรได้อีก?
- เพิ่มรูปภาพข้างตัวเลือกแต่ละตัวเพื่อให้ดูน่าสนใจยิ่งขึ้น
- คุณสามารถให้ผู้ใช้ตอบกลับด้วยการแตะเพียงครั้งเดียวหรือทำให้เขาคลิก "ส่ง" หลังจากที่เขาแตะตัวเลือกใดก็ได้ หลังช่วยในการยืนยันอีกครั้งหากผู้ใช้ไม่ได้เลือกตัวเลือกโดยไม่ได้ตั้งใจ ไม่มีทางที่จะย้อนกลับไปในโฟลว์การแชทได้ และนั่นเป็นเหตุผลว่าทำไมการปรับแต่งนี้จึงสมเหตุสมผล
- เพิ่มเมนูข้อมูลด่วนในแต่ละตัวเลือกเพื่อให้ข้อมูลโดยละเอียดและทำให้กระบวนการตัดสินใจดีขึ้น
ไม่ใช่ทุกคนที่รู้ถึงความแตกต่างระหว่าง Advance และ Basic Facial การเพิ่มรายละเอียดเกี่ยวกับสิ่งที่รวมอยู่ทั้งหมดและราคาทำให้ประสบการณ์ผู้ใช้ดีขึ้น
สิ่งสำคัญอีกประการหนึ่งที่ต้องจำไว้เมื่อคุณใช้ Button UI คือการกำหนดกรอบคำถามของคุณอย่างถูกวิธี ดังที่ Leszek อธิบายในบทความของเขาที่นี่ เป็นการดีกว่าที่จะถามคำถามในลักษณะที่จำกัดช่วงของตัวเลือกและกำหนดบริบทแทนที่จะถามคำถามปลายเปิด
การจำกัดการป้อนข้อมูลของผู้ใช้
ฉันรู้สึกว่านี่เป็นหนึ่งในสิ่งที่ดีที่สุดที่เราได้ทำกับอินเทอร์เฟซการแชทของเรา เมื่อใดก็ตามที่เราจัดเตรียม UI สำหรับการป้อนข้อมูลแบบกราฟิก (ปุ่ม ภาพหมุน ฯลฯ) เราจะไม่อนุญาตให้ผู้ใช้พิมพ์ข้อความใดๆ ในข้อความ
ทำไมทำอย่างนั้น? เนื่องจากผู้ใช้สามารถพิมพ์อะไรก็ได้และบอทของคุณไม่พร้อมสำหรับสิ่งนั้น จนกว่าคุณจะอยู่ที่นั่น ดีกว่าที่จะทำให้มันเรียบง่ายและจำกัดมากกว่าที่จะทำลายการสนทนา
แนะนำสำหรับคุณ:
Metaverse จะพลิกโฉมอุตสาหกรรมยานยนต์อินเดียได้อย่างไร
บทบัญญัติต่อต้านการแสวงหากำไรสำหรับสตาร์ทอัพในอินเดียมีความหมายอย่างไร?
Edtech Startups ช่วยให้แรงงานอินเดียเพิ่มพูนทักษะและเตรียมพร้อมสู่อนาคตได้อย่างไร...
หุ้นเทคโนโลยียุคใหม่ในสัปดาห์นี้: ปัญหาของ Zomato ยังคงดำเนินต่อไป, EaseMyTrip Posts Stro...
สตาร์ทอัพอินเดียใช้ทางลัดในการไล่ล่าหาทุน
แพลตฟอร์มการตลาดดิจิทัล Logicserve ระดมทุน INR 80 Cr รีแบรนด์เป็น LS Dig...
สิ่งที่เราทำคือ:
นี่คืออินเทอร์เฟซการแชทของเรา
และนี่คือสิ่งที่จะเกิดขึ้นเมื่อคุณไม่มีสิ่งนี้:
นี่คือ Facebook Messenger ที่ไม่อนุญาตให้ป้อนข้อความเมื่อคุณตอบกลับอย่างรวดเร็ว
ปุ่มเสร็จสิ้นและผ่าน
นี่เป็นความแตกต่างเล็ก ๆ น้อย ๆ สองประการที่เราลงเอยด้วยการรวมเข้าด้วยกันเพราะเราคิดเสมอว่าแชทบอทที่มีสคริปต์เป็นวิวัฒนาการของรูปแบบ
เมื่อคุณส่งผ่านที่อยู่ของคุณหรือให้ข้อเสนอแนะโดยละเอียดเกี่ยวกับอินเทอร์เฟซการแชท พฤติกรรมทั่วไปคือการกดปุ่มส่งหลังจากเขียนคำสองสามคำ และในที่สุดคำตอบทั้งหมดจะกระจายไปทั่ว 3-4 ข้อความ ด้วย "ปุ่มเสร็จสิ้น" คุณสามารถพิมพ์ต่อไปและกดปุ่มนี้เมื่อคุณได้รับคำตอบทั้งหมดแล้ว
ถ้าคุณไม่มีตัวเลือกดังกล่าว ข้อความถัดไปของเครื่องจะมาหลังจากอินสแตนซ์แรกเองซึ่งส่งผลให้มีการตอบกลับไม่สมบูรณ์
มีปุ่ม "เสร็จสิ้น" เมื่อคุณต้องเลือกหลายตัวเลือกหรือมีคำตอบหลายบรรทัด
อาจมีบางกรณีที่ผู้ใช้ต้องการข้ามคำถามและสำหรับสิ่งนั้น เรามี "ปุ่มผ่าน" แทน "ปุ่มส่ง" ทันทีที่ผู้ใช้เริ่มพิมพ์ ปุ่มผ่านจะเปลี่ยนเป็นปุ่มส่ง
ไม่ต้องการให้อีเมลของคุณ? แตะที่ "ผ่าน" เพื่อข้ามคำถาม
คำแนะนำในการเติมข้อความอัตโนมัติ
นี่เป็นเหมือนฟังก์ชันเติมข้อความอัตโนมัติในการค้นหาของ Google ที่คุณเริ่มพิมพ์และจะแนะนำตัวเลือกที่เป็นไปได้ สิ่งนี้มีประโยชน์อย่างยิ่งเมื่อคุณมีตัวเลือกมากมายและการมีปุ่มแนวตั้งนั้นไม่ใช่ตัวเลือกที่เป็นไปได้ ลองนึกถึงรายชื่อสถานที่ เมือง รุ่นรถ ฯลฯ
ดาวและไลค์
มีประโยชน์อย่างยิ่งเมื่อคุณขอความคิดเห็นหรือประสบการณ์ของผู้ใช้ และการตอบสนองนั้นมีคุณภาพมากกว่า และคุณยังสามารถปรับแต่งไอคอนให้เป็นดาว ไลค์ หัวใจ อีโมติคอนได้อีกด้วย
การ์ดรูปภาพ
สิ่งนี้มีประโยชน์เมื่อคุณต้องแสดงข้อมูลหลายชิ้นเกี่ยวกับแต่ละรายการในคราวเดียว อาจเป็นเบอร์เกอร์ในกระบวนการสั่งอาหารหรือเสื้อเชิ้ตในกระแสการช็อปปิ้ง ไพ่ทั้งหมดเรียงซ้อนกัน และคุณสามารถเลื่อนดูเพื่อดูตัวเลือกทั้งหมดได้
องค์ประกอบ UI นี้มี 4 ส่วน — รูปภาพ ชื่อ คำอธิบาย และส่วนท้าย คุณสามารถใช้สิ่งเหล่านี้ได้แตกต่างกันไปขึ้นอยู่กับสิ่งที่คุณต้องการแสดงในนั้น
ในกรณีที่คุณต้องการทดสอบองค์ประกอบ UI อินพุตเหล่านี้ นี่คือลิงค์ไปยังแชทบอทซึ่งจะนำคุณผ่านทีละรายการ
แชทเป็นอินเทอร์เฟซที่เรียบง่ายด้วยฟองอากาศและกล่องข้อความไม่ได้ให้ขอบเขตมากนัก และฉันเชื่อว่าเราจะต้องคิดใหม่ว่าเราจะสามารถอำนวยความสะดวกในการโต้ตอบที่หลากหลายโดยใช้องค์ประกอบที่มีอยู่และเพิ่มองค์ประกอบใหม่ลงในอินเทอร์เฟซการแชทได้อย่างไร
อยากรู้ไหมว่าคุณเคยเล่นอินเทอร์เฟซการส่งข้อความด้วยตัวเองและได้เพิ่มองค์ประกอบ GUI เจ๋ง ๆ อื่น ๆ เข้าไปหรือไม่?
[โพสต์นี้โดย Ish Jindal ปรากฏตัวครั้งแรกบนสื่อและทำซ้ำโดยได้รับอนุญาต]