Hầu hết các đội ngũ sản phẩm thường phác thảo các trích dẫn AI dưới dạng những con số màu xanh nhỏ nhắn, gọn gàng nằm ngay cạnh văn bản được tạo ra. Họ thiết lập chúng một lần trên một kết nối mạng nhanh, xem bản xem trước hiện ra trong nửa giây, rồi chuyển sang việc khác. Điều đó hoạt động tốt trong môi trường staging. Nhưng nó hiếm khi trụ vững khi tiếp xúc với môi trường internet thực tế.

Nguồn tài liệu bị hỏng. Các công ty xóa các bài đăng trên blog. Các cổng thông tin chính phủ tổ chức lại URL mà không có chuyển hướng. Các tường phí (paywalls) xuất hiện. Các CDN gặp sự cố. Tài liệu mà AI đã quét ba tháng trước có thể đã được viết lại vào ngày hôm qua. Nếu thành phần trích dẫn của bạn chỉ biết cách trông thật đẹp khi mọi thứ diễn ra suôn sẻ, nó sẽ lừa dối người dùng khi có sự cố xảy ra. Tệ hơn, nó sẽ khiến họ bối rối không biết liệu bằng chứng đó có thực sự tồn tại hay không.

Một hệ thống trích dẫn đáng tin cậy cần phải truyền tải được trạng thái. Không chỉ là một siêu liên kết. Không chỉ là một tooltip. Nó cần cho người đọc biết điều gì đang xảy ra với bằng chứng đó trong thời gian thực.

Thiết kế cho bốn trạng thái thực tế

Hãy coi một trích dẫn như một máy trạng thái nhỏ. Mỗi nguồn mà AI của bạn hiển thị có thể rơi vào một trong bốn điều kiện, và giao diện của bạn nên xử lý từng điều kiện một cách trung thực.

Loading (Đang tải). Người dùng nhấp vào số mũ, và hệ thống sẽ lấy bản xem trước, một đoạn trích hoặc trang gốc. Trong khoảng thời gian đó, hãy cho họ thấy điều gì đó đang diễn ra. Một khung xương (skeleton placeholder), một khung trích dẫn nhấp nháy, hoặc thậm chí là dòng chữ thuần túy "Đang lấy nguồn..." sẽ tốt hơn là sự im lặng. Sự im lặng khiến mọi người tự hỏi liệu cú nhấp chuột có hiệu quả hay không. Trong một giao diện streaming (truyền dữ liệu liên tục) nơi các nguồn xuất hiện khi mô hình đang suy nghĩ, các trạng thái tải cũng giúp bạn có thêm thời gian để giải quyết các liên kết mà không làm gián đoạn quá trình tạo văn bản.

Available (Khả dụng). Đây là trạng thái mà mọi người đều thiết kế hướng tới. Liên kết hoạt động, văn bản vẫn khớp với những gì mô hình đã thấy, và người dùng nhận được một đoạn trích rõ ràng cùng với liên kết trực tiếp. Nhưng đừng chỉ dừng lại ở việc đưa ra một URL thô. Hãy hiển thị tiêu đề, tên miền và đoạn văn liên quan. Cung cấp cho người đọc đủ ngữ cảnh để họ quyết định xem có muốn rời khỏi trang hay không. Một thẻ href thô trong dấu ngoặc đơn về mặt kỹ thuật là một trích dẫn, nhưng đó không phải là một trải nghiệm người dùng tốt.

Changed (Đã thay đổi). Trạng thái này khá khó chịu. Trang web tải lên, nhưng nội dung không còn chứa câu trích dẫn hoặc số liệu thống kê mà AI đã gán cho nó. Có thể nhà xuất bản đã cập nhật bài viết. Có thể bản snapshot huấn luyện AI đã bắt được một tiêu đề mà sau đó đã thay đổi. Thành phần của bạn nên đánh dấu sự sai lệch này thay vì giả vờ như mọi thứ vẫn khớp nhau. Một ghi chú nhỏ như "Nguồn này đã được cập nhật kể từ khi được lập chỉ mục" sẽ giúp người dùng không phải lãng phí mười phút để tìm kiếm một câu không còn tồn tại. Nó cũng giúp duy trì sự tin tưởng. Nếu bạn che giấu sự không khớp này, người dùng cuối cùng sẽ cho rằng sản phẩm của bạn đang bịa đặt thông tin.

Missing (Bị thiếu). Lỗi 404. Hết thời gian chờ (timeout). Tường phí (paywall). Máy chủ trả về mã trạng thái 200 nhưng lại hiển thị trang "Nội dung đã bị xóa" chung chung. Đừng để liên kết đó treo lơ lửng màu xanh, giả vờ như nó vẫn hoạt động. Hãy thay thế bằng ngôn ngữ bình dân: "Trang đã bị xóa", "Liên kết không còn khả dụng" hoặc "Nguồn ngoại tuyến". Nếu bạn biết lý do tại sao nó thất bại, hãy nói rõ. Nếu có Internet Archive hoặc một bản sao lưu (cached copy), hãy cung cấp nó. Mục tiêu là hoàn tất quy trình, chứ không phải bỏ mặc người đọc.

Khả năng tiếp cận là điều không thể thương lượng

Các thành phần trích dẫn nằm ở những phần có lưu lượng truy cập cao và có tầm quan trọng lớn trong UI. Chúng xứng đáng được chú trọng kỹ lưỡng như một biểu mẫu thanh toán hoặc quy trình đặt vé máy bay.

Sử dụng văn bản để hiển thị trạng thái. Người mù màu không thể chỉ dựa vào một dấu chấm xanh lá hoặc một đường viền đỏ. Hãy kết hợp các chỉ báo của bạn với từ ngữ: "Khả dụng", "Đã thay đổi", "Không khả dụng". Nhãn nhỏ đó cũng giúp ích cho mọi người dùng có thị lực, vì màu sắc trạng thái hiếm khi mang cùng một ý nghĩa giữa các nền văn hóa hoặc các sản phẩm khác nhau.

Viết tên mô tả cho trình đọc màn hình (screen reader). Hãy gắn nhãn cho các liên kết của bạn để người sử dụng trình đọc màn hình nghe được điều gì đó hữu ích. Thay vì một từ "Liên kết" chung chung, hãy đọc là "Nguồn 3: Chính sách lưu trữ nhật ký kiểm toán". Điều này cho người nghe biết chính xác họ sẽ nhận được gì trước khi họ quyết định mở nó.

Bảo vệ luồng trải nghiệm. Việc nhấp vào một trích dẫn không nên làm biến mất câu trả lời do AI tạo ra. Hãy sử dụng một bảng điều khiển (panel), một cửa sổ modal, hoặc một phần mở rộng ngay trong dòng (inline expansion). Người đọc mở nguồn để xác minh một khẳng định cụ thể. Nếu giao diện của bạn xóa sạch khẳng định mà họ vừa đọc, bạn đã buộc họ phải ghi nhớ văn bản đó trong bộ nhớ làm việc trong khi họ đi tìm bằng chứng. Đó là một gánh nặng nhận thức không cần thiết.

Quản lý tiêu điểm (focus) một cách có chủ đích. Khi người dùng mở một trích dẫn, hãy chuyển tiêu điểm bàn phím vào bảng điều khiển hoặc cửa sổ bật lên mới. Khi họ đóng nó, hãy gửi tiêu điểm trở lại nút kích hoạt. Đừng chiếm quyền điều khiển tiêu điểm trong khi luồng dữ liệu vẫn đang ghi các nguồn vào trang. Hãy để người dùng luôn giữ quyền kiểm soát.

Hãy xử lý luồng dữ liệu (streaming) một cách cẩn thận. Nếu giao diện tạo nội dung của bạn đang thêm các trích dẫn ngay khi chúng xuất hiện, đừng làm phiền người dùng trình đọc màn hình bằng cách thông báo cho từng số mũ trên mới. Hãy gom chúng lại. Khi đã tích lũy được hai hoặc ba trích dẫn, hãy đưa ra một thông báo tóm tắt lịch sự như "Đã thêm hai nguồn." Việc ngắt quãng liên tục sẽ khiến nội dung đầu ra trở nên không thể đọc được đối với người dùng công nghệ hỗ trợ.

Hãy nhớ trích dẫn chứng minh điều gì

Điểm này cần phải được nhấn mạnh nhiều lần. Một trích dẫn cho thấy nguồn gốc. Nó không chứng minh sự thật.

Khi một AI trích dẫn một nguồn, nó đang nói rằng: "Tôi tìm thấy cách diễn đạt này ở đây." Nó không nói rằng: "Chuyên gia này đúng." Nó không nói rằng: "Nghiên cứu này được thực hiện tốt." Nó thậm chí không nói rằng: "Tôi đã hiểu đúng ngữ cảnh." Một trích dẫn là bản đồ dẫn quay lại bằng chứng gốc. Người đọc vẫn phải tự mình đi trên con đường đó và quyết định xem bằng chứng đó có đủ sức thuyết phục hay không.

Thiết kế của bạn nên làm rõ sự phân biệt đó. Hãy sử dụng các đoạn trích cho phép người dùng lướt qua các dòng liên quan. Hiển thị ngày xuất bản để người đọc biết bằng chứng đó mới đến mức nào. Nếu nguồn là một diễn đàn, một thông cáo báo chí hoặc một nghiên cứu sơ cấp, hãy làm nổi bật ngữ cảnh đó để người đọc có thể cân nhắc một cách phù hợp. Hãy xây dựng giao diện để hỗ trợ sự phán đoán của con người, chứ không phải thay thế nó.

Kiểm chứng với thực tế

Một thành phần trích dẫn vượt qua được đánh giá về mặt thị giác mới chỉ hoàn thành được một nửa. Bạn cần