AI 에이전트의 신뢰도를 높이는 다섯 가지 UI 패턴

AI 에이전트의 인터페이스는 사용자가 에이전트의 행동을 이해하고, 변경 사항을 검사하며, 필요할 때 개입할 수 있도록 도와야 합니다. 대화형 인터페이스만으로는 이러한 모든 가시성을 제공할 수 없습니다.

RapidNative의 커뮤니티 인턴인 Gracie가 AI 에이전트에 익숙한 UI 패턴에 대한 강연에서 확립된 인터페이스 패턴이 에이전트 경험에 어떻게 적용되는지 탐구합니다.

프론트엔드 개발자들에게 이러한 패턴은 더 명확한 상호 작용을 구축하기 위한 실질적인 시작점을 제공합니다.

1. 관찰 가능한 진행 상황 표시 (Show Observable Progress)

“생각 중…”이라는 메시지는 에이전트의 실제 활동에 대해 거의 알려주지 못합니다.

더 유용한 업데이트는 관찰 가능한 작업을 설명해야 합니다:

이러한 업데이트는 모델의 내부 추론에 대한 설명을 지어내기보다는, 실행 상태를 반영해야 합니다. 실패하거나 멈춘 작업 역시 보여야 합니다.

활동 로그는 리소스를 읽기, 편집하기, 생성하고 삭제하는 것을 구별해야 합니다.

“세 개의 파일 업데이트”는 요약일 뿐입니다. 사용자는 여전히 영향을 받은 파일과 그 diff(차이점)에 접근하여 변경 사항을 평가할 필요가 있습니다.

유용한 항목은 행동을 목적과 연결합니다: “로그인 컴포넌트를 업데이트하여 유효성 검사 오류를 표시함.” 단순히 파일 개수와 라인 개수만으로는 정확성을 확립할 수 없습니다.

“허용” 버튼은 정보에 입각한 결정을 내릴 만큼 충분한 맥락이 필요합니다.

예를 들어, 에이전트가 파일을 업로드하기 전에 인터페이스는 해당 파일, 그 목적지, 그리고 승인이 이 행동만 포함하는 것인지 아니면 미래의 업로드까지 포괄하는지를 식별해야 합니다.

“선택된 파일 업로드”와 같은 레이블은 “계속”보다 더 많은 것을 전달합니다. 시각적 경고는 메시지를 강화할 수 있지만, 명확한 언어를 대체해서는 안 됩니다.

채팅(Chat)은 의도를 표현하는 데 효과적입니다. 카드, 양식(forms), 테이블은 옵션을 검토하는 데 더 잘 작동할 수 있습니다.

여행 비서(travel assistant)는 대화형 요청을 받아 출발 시간과 가격에 대한 일관된 필드를 가진 항공편 옵션을 표시할 수 있습니다.

애플리케이션은 실행 가능한 컨트롤을 제시하기 전에 에이전트가 생성한 데이터를 검증하고, 누락된 필드나 지원되지 않는 동작을 처리하는 책임을 유지해야 합니다.

중지 버튼은 무엇을 중단할 수 있는지 설명해야 합니다.

에이전트를 중지시키는 것은 다른 서비스가 이미 수락한 요청을 되돌리지 않으면서 다음 동작을 막을 수 있습니다. 보류 중인 작업 취소(Cancelling pending work)와 완료된 작업 되돌리기(undoing completed work)는 별개의 기능입니다.

되돌리기가 어려운 동작의 경우, 미리보기(preview) 및 명시적인 승인 단계가 실행 전에 사용자에게 제어권을 부여할 수 있습니다.

이러한 패턴들은 사용자가 세 가지 질문에 답하는 데 도움을 줍니다: 무슨 일이 일어나고 있나요? 무엇이 바뀌었나요? 여전히 무엇을 통제할 수 있나요?

에이전트 인터페이스를 구축하는 개발자들에게는 정확한 진행 상황 보고(accurate progress reporting), 유용한 변경 로그(useful change logs), 아니면 끊임없는 중단을 피하는 권한 관리 중 어느 것이 구현하기 가장 어렵습니까?