Skip to content

에이전트 생태계에서의 A2UI

에이전트 기반 UI(Agentic UI) 분야는 빠르게 발전하고 있으며, 스택의 각 부분을 해결하기 위한 훌륭한 도구들이 등장하고 있습니다. A2UI는 이러한 프레임워크들을 대체하려는 것이 아닙니다. 대신, 상호운용 가능하고 크로스 플랫폼을 지원하며, 생성형 또는 템플릿 기반의 UI 응답이라는 구체적인 문제를 해결하는 특화된 프로토콜입니다.

한눈에 보기

A2UI의 접근 방식은 JSON을 메시지 형태로 클라이언트에 보내고, 클라이언트의 렌더러가 이를 네이티브 UI 컴포넌트로 변환하는 것입니다. LLM은 실시간으로 컴포넌트 레이아웃을 생성할 수도 있고, 기존의 템플릿을 사용할 수도 있습니다.

이 방식은 데이터처럼 안전하고 코드처럼 표현력이 풍부합니다.

이 페이지의 나머지 내용에서는 다른 옵션들과 비교하여 A2UI의 위치를 이해하는 데 도움을 드립니다.

에이전트 기반 UI 생태계 탐색하기

1. "호스트" 애플리케이션 UI 구축

풀스택 애플리케이션(사용자가 상호작용하는 "호스트" UI)을 구축하는 경우, 개발자는 실제 UI를 직접 만드는 것 외에도 상태 동기화, 채팅 기록 및 입력 처리를 담당하는 프레임워크(AG UI / CopilotKit, Vercel AI SDK, 그리고 이미 내부적으로 A2UI를 사용하고 있는 Flutter용 GenUI SDK 등)를 활용할 수 있습니다.

A2UI의 위치: A2UI는 이러한 프레임워크들을 보완합니다. AG UI를 사용하여 호스트 애플리케이션을 연결하는 경우, 호스트 에이전트뿐만 아니라 서드파티나 원격 에이전트의 응답을 렌더링하기 위한 데이터 형식으로 A2UI를 사용할 수 있습니다. 이를 통해 두 세계의 장점을 모두 누릴 수 있습니다. 즉, 상태가 유지되는 풍부한 호스트 앱을 가지면서 동시에 외부 에이전트로부터의 콘텐츠를 안전하게 렌더링할 수 있습니다.

  • A2A를 사용한 A2UI: A2A를 통해 클라이언트 프론트엔드로 직접 전송할 수 있습니다.
  • AG UI를 사용한 A2UI: AG UI를 통해 클라이언트 프론트엔드로 직접 전송할 수 있습니다.
  • REST, SSE, WebSockets 및 기타 전송 방식은 기술적으로 가능하지만 아직 정식 지원되지 않습니다.

2. "리소스"로서의 UI (MCP 앱)

모델 컨텍스트 프로토콜(MCP)은 최근 서버가 대화형 인터페이스를 제공할 수 있도록 하는 새로운 표준인 MCP Apps을 발표했습니다. 이 접근 방식은 UI를 도구가 반환할 수 있는 리소스(ui:// URI를 통해 접근)로 취급하며, 일반적으로 격리와 보안을 위해 샌드박스 처리된 iframe 내에서 미리 빌드된 HTML 콘텐츠를 렌더링합니다.

A2UI의 차이점: A2UI는 MCP 앱의 리소스 페칭 모델과는 구별되는 "네이티브 우선(native-first)" 접근 방식을 취합니다. 샌드박스에 표시할 불투명한 페이로드를 가져오는 대신, A2UI 에이전트는 네이티브 컴포넌트의 설계도(blueprint)를 보냅니다. 이를 통해 UI가 호스트 앱의 스타일링과 접근성 기능을 완벽하게 상속받을 수 있습니다. 멀티 에이전트 시스템에서 오케스트레이터 에이전트는 하위 에이전트의 가벼운 A2UI 메시지 내용을 쉽게 이해할 수 있어, 에이전트 간의 더욱 유연한 협업이 가능해집니다.

3. 플랫폼 특정 생태계 (OpenAI ChatKit)

ChatKit과 같은 도구들은 특히 OpenAI 생태계 내에서 에이전트를 배포할 때 고도로 통합되고 최적화된 경험을 제공합니다.

A2UI의 차이점: A2UI는 웹, Flutter, 네이티브 모바일 등에서 자신만의 에이전트 기반 플랫폼을 구축하려는 개발자나, 에이전트가 신뢰 경계를 넘어 통신해야 하는 엔터프라이즈 메시(예: A2A)를 위해 설계되었습니다. A2UI는 호스트 클라이언트 애플리케이션과의 시각적 일관성을 높이기 위해, 에이전트의 제어권을 일부 줄이는 대신 클라이언트에게 더 많은 스타일링 제어권을 부여합니다.