ทีมผลิตภัณฑ์ส่วนใหญ่มักจะออกแบบการอ้างอิง (citations) ของ AI ให้เป็นเพียงตัวเลขสีฟ้าเล็กๆ ที่วางอยู่อย่างเป็นระเบียบข้างข้อความที่สร้างขึ้น พวกเขาเชื่อมต่อระบบเพียงครั้งเดียวผ่านการเชื่อมต่อที่รวดเร็ว ดูตัวอย่างที่เด้งขึ้นมาในเวลาเพียงครึ่งวินาที แล้วก็ข้ามไปทำอย่างอื่น นั่นอาจจะใช้ได้ในสภาพแวดล้อมจำลอง (staging environment) แต่แทบจะไม่รอดเมื่อต้องเผชิญกับโลกอินเทอร์เน็ตจริงๆ

แหล่งข้อมูลมีการเปลี่ยนแปลง (rot) บริษัทต่างๆ ลบบล็อกโพสต์ พอร์ทัลของรัฐบาลจัดระเบียบ URL ใหม่โดยไม่มีการเปลี่ยนเส้นทาง (redirect) มีการตั้งกำแพงการชำระเงิน (paywalls) หรือ CDN เกิดขัดข้อง เอกสารที่ AI สแกนเมื่อสามเดือนก่อนอาจถูกเขียนขึ้นใหม่เมื่อวานนี้ก็ได้ หากคอมโพเนนต์การอ้างอิงของคุณทำได้แค่ดูดีเมื่อทุกอย่างราบรื่น มันจะกลายเป็นการโกหกผู้ใช้เมื่อเกิดปัญหาขึ้น และที่แย่กว่านั้นคือ มันจะทำให้ผู้ใช้สับสนว่าหลักฐานนั้นเคยมีอยู่จริงหรือไม่

ระบบการอ้างอิงที่เชื่อถือได้จำเป็นต้องสื่อสาร "สถานะ" (state) ไม่ใช่แค่ไฮเปอร์ลิงก์ ไม่ใช่แค่ทูลทิป (tooltip) แต่มันต้องบอกผู้อ่านได้ว่าเกิดอะไรขึ้นกับหลักฐานนั้นๆ แบบเรียลไทม์

ออกแบบสำหรับ 4 สถานะที่เกิดขึ้นจริง

ให้คิดว่าการอ้างอิงคือเครื่องจักรบอกสถานะขนาดเล็ก แหล่งข้อมูลทุกอย่างที่ AI นำเสนอสามารถตกอยู่ในสภาวะใดสภาวะหนึ่งจาก 4 สภาวะนี้ และอินเทอร์เฟซของคุณควรจัดการกับแต่ละสภาวะอย่างตรงไปตรงมา

Loading. เมื่อผู้ใช้คลิกที่ตัวเลขยก (superscript) ระบบจะไปดึงตัวอย่าง ข้อความบางส่วน หรือหน้าต้นฉบับมา ในช่วงเวลานั้น ควรแสดงให้เห็นว่ากำลังมีบางอย่างเกิดขึ้น การใช้ skeleton placeholder, กรอบข้อความที่กำลังกะพริบ (pulsing excerpt frame) หรือแม้แต่ข้อความธรรมดาว่า "กำลังดึงข้อมูลแหล่งที่มา..." ยังดีกว่าการปล่อยให้เงียบไป เพราะความเงียบจะทำให้คนสงสัยว่าคลิกติดหรือไม่ ในอินเทอร์เฟซแบบ streaming ที่แหล่งข้อมูลทยอยมาตามการประมวลผลของโมเดล สถานะการโหลดจะช่วยซื้อเวลาให้คุณจัดการลิงก์ได้โดยไม่ขัดจังหวะการสร้างข้อความ

Available. นี่คือสถานะที่ทุกคนออกแบบไว้ ลิงก์ใช้งานได้ ข้อความยังตรงกับสิ่งที่โมเดลเห็น และผู้ใช้ได้รับข้อความบางส่วนที่ชัดเจนพร้อมลิงก์โดยตรง แต่อย่าหยุดแค่การวาง URL ดิบๆ ลงไป ควรแสดงชื่อเรื่อง โดเมน และเนื้อหาที่เกี่ยวข้อง เพื่อให้ผู้อ่านมีบริบทเพียงพอในการตัดสินใจว่าจะออกจากหน้าเว็บนี้หรือไม่ การวาง href ดิบๆ ในวงเล็บอาจถือเป็นการอ้างอิงในทางเทคนิค แต่มันไม่ใช่ประสบการณ์ผู้ใช้ (UX) ที่ดี

Changed. สถานะนี้สร้างความลำบากใจ หน้าเว็บโหลดขึ้นมาได้ แต่เนื้อหาไม่มีคำพูดหรือสถิติที่ AI อ้างถึงอีกต่อไป อาจเป็นเพราะสำนักพิมพ์อัปเดตบทความ หรือข้อมูลที่ใช้เทรน AI เป็นเพียงหัวข้อข่าวที่ถูกเปลี่ยนในภายหลัง คอมโพเนนต์ของคุณควรแจ้งเตือนความไม่สอดคล้องนี้ แทนที่จะแสร้งทำเป็นว่าทุกอย่างยังเหมือนเดิม การระบุหมายเหตุเล็กๆ เช่น "แหล่งข้อมูลนี้ได้รับการอัปเดตหลังจากที่ถูกจัดทำดัชนี" จะช่วยป้องกันไม่ให้ผู้ใช้เสียเวลาสิบนาทีเพื่อตามหาประโยคที่ไม่มีอยู่จริงอีกต่อไป และยังช่วยรักษาความเชื่อมั่นด้วย หากคุณปกปิดความผิดพลาดนี้ ในที่สุดผู้ใช้จะทึกทักเอาเองว่าผลิตภัณฑ์ของคุณกุเรื่องขึ้นมา

Missing. ไม่ว่าจะเป็นข้อผิดพลาด 404, การหมดเวลา (timeout), กำแพงการชำระเงิน (paywall) หรือเซิร์ฟเวอร์ที่ส่งรหัสสถานะ 200 กลับมาแต่แสดงหน้า "Content Removed" ทั่วไป อย่าปล่อยให้ลิงก์สีฟ้าค้างอยู่ตรงนั้นราวกับว่ามันยังใช้งานได้ ให้เปลี่ยนเป็นภาษาที่เข้าใจง่ายแทน เช่น "Page removed," "Link no longer available," หรือ "Source offline" หากคุณทราบสาเหตุที่ล้มเหลว ก็ให้บอกไปเลย หากมี Internet Archive หรือสำเนาที่แคชไว้ (cached copy) ก็ควรเสนอให้ด้วย เป้าหมายคือการทำให้ข้อมูลครบถ้วนสมบูรณ์ ไม่ใช่ทิ้งผู้อ่านไว้กลางทาง

การเข้าถึง (Accessibility) เป็นเรื่องที่ต่อรองไม่ได้

คอมโพเนนต์การอ้างอิงอยู่ในส่วนที่มีการใช้งานสูงและมีความสำคัญมากใน UI พวกมันควรได้รับการดูแลอย่างเข้มงวดเช่นเดียวกับฟอร์มชำระเงินหรือขั้นตอนการจองเที่ยวบิน

ใช้ข้อความเพื่อแสดงสถานะ ผู้ใช้ที่มีอาการตาบอดสีไม่สามารถพึ่งพาเพียงจุดสีเขียวหรือขอบสีแดงได้ ควรใช้คำควบคู่ไปกับตัวบ่งชี้ เช่น "Available," "Modified," "Unavailable" ป้ายกำกับเล็กๆ นี้ยังช่วยผู้ใช้ที่มองเห็นปกติด้วย เพราะสีของสถานะมักจะมีความหมายไม่เหมือนกันในแต่ละวัฒนธรรมหรือแต่ละผลิตภัณฑ์

เขียนชื่อที่อธิบายรายละเอียดสำหรับเครื่องอ่านหน้าจอ (screen readers) กำหนดป้ายกำกับ (label) ให้กับลิงก์เพื่อให้คนที่ใช้เครื่องอ่านหน้าจอได้ยินข้อมูลที่เป็นประโยชน์ แทนที่จะเป็นคำว่า "Link" เฉยๆ ให้ระบุว่า "Source 3: Audit-log retention policy" สิ่งนี้จะบอกผู้ฟังอย่างชัดเจนว่าพวกเขาจะได้พบกับอะไรก่อนที่จะตัดสินใจเปิดมัน

รักษาความต่อเนื่อง (flow) การคลิกที่การอ้างอิงไม่ควรทำให้คำตอบที่ AI สร้างขึ้นหายวับไป ควรใช้แผงควบคุม (panel), หน้าต่างป๊อปอัป (modal) หรือการขยายเนื้อหาในบรรทัด (inline expansion) ผู้อ่านเปิดแหล่งข้อมูลเพื่อตรวจสอบข้ออ้างเฉพาะเจาะจง หากอินเทอร์เฟซของคุณลบข้อความที่พวกเขากำลังอ่านอยู่ทิ้งไป คุณกำลังบังคับให้พวกเขาต้องใช้ความจำเพื่อจำข้อความนั้นไว้ในขณะที่กำลังตามหาหลักฐาน ซึ่งเป็นการเพิ่มภาระทางความคิด (cognitive load) โดยไม่จำเป็น

จัดการโฟกัส (focus) อย่างตั้งใจ เมื่อผู้ใช้เปิดการอ้างอิง ให้ย้ายโฟกัสของคีย์บอร์ดไปยังแผงควบคุมหรือป๊อปอัปใหม่ และเมื่อพวกเขาปิดมัน ให้ส่งโฟกัสกลับไปยังจุดที่คลิก (trigger) อย่าแย่งชิงโฟกัสในขณะที่ระบบ streaming ยังคงเขียนแหล่งข้อมูลลงในหน้าเว็บ ให้ผู้ใช้เป็นผู้ควบคุมสถานการณ์เสมอ

จัดการการสตรีมมิ่งอย่างระมัดระวัง หากอินเทอร์เฟซแบบ generative ของคุณมีการเพิ่มการอ้างอิงในขณะที่ข้อมูลกำลังไหลเข้ามา อย่ารบกวนผู้ใช้โปรแกรมอ่านหน้าจอด้วยการประกาศแจ้งเตือนสำหรับตัวเลขยกกำลังใหม่ทุกตัว ให้รวบรวมพวกมันไว้เป็นกลุ่ม เมื่อมีการสะสมครบสองหรือสามรายการแล้ว จึงค่อยประกาศสรุปอย่างสุภาพ เช่น "เพิ่มแหล่งอ้างอิงสองรายการ" การขัดจังหวะอย่างต่อเนื่องจะทำให้เนื้อหาอ่านยากสำหรับผู้ใช้เทคโนโลยีสิ่งอำนวยความสะดวก

จำไว้ว่าการอ้างอิงพิสูจน์อะไร

ประเด็นนี้สำคัญมากจนต้องย้ำเตือนอยู่เสมอ การอ้างอิงแสดงถึงแหล่งที่มา แต่มันไม่ได้แสดงถึงความจริง

เมื่อ AI อ้างอิงแหล่งที่มา มันกำลังบอกว่า "ฉันพบข้อความนี้จากที่นี่" มันไม่ได้บอกว่า "ผู้เชี่ยวชาญท่านนี้ถูกต้อง" มันไม่ได้บอกว่า "งานวิจัยนี้ทำออกมาได้ดี" หรือแม้แต่บอกว่า "ฉันเข้าใจบริบทนี้อย่างถูกต้อง" การอ้างอิงคือแผนที่ที่นำทางกลับไปยังหลักฐานต้นฉบับ ผู้อ่านยังคงต้องเดินตามเส้นทางนั้นและตัดสินใจด้วยตัวเองว่าหลักฐานนั้นน่าเชื่อถือหรือไม่

การออกแบบของคุณควรทำให้ความแตกต่างนี้ชัดเจน ใช้ข้อความบางส่วนที่ช่วยให้ผู้ใช้สามารถกวาดสายตาดูบรรทัดที่เกี่ยวข้องได้ แสดงวันที่เผยแพร่เพื่อให้ผู้อ่านทราบว่าหลักฐานนั้นทันสมัยเพียงใด หากแหล่งที่มาคือฟอรัม ข่าวประชาสัมพันธ์ หรือการศึกษาวิจัยขั้นต้น ให้แสดงบริบทนั้นออกมาเพื่อให้ผู้อ่านสามารถประเมินน้ำหนักได้อย่างเหมาะสม จงสร้างอินเทอร์เฟซเพื่อสนับสนุนการตัดสินใจของมนุษย์ ไม่ใช่เพื่อมาแทนที่

ทดสอบกับความเป็นจริง

คอมโพเนนต์การอ้างอิงที่ผ่านการตรวจสอบด้วยสายตาเป็นเพียงการทำเสร็จไปเพียงครึ่งทางเท่านั้น คุณจำเป็นต้อง