A2UI v0.9: 휴대 가능하고 프레임워크 독립적인 생성형 UI의 새로운 표준

2026년 4월 17일

생성형 UI는 AI 에이전트가 사용자의 특정 상호작용에 맞춰 UI 위젯을 실시간으로 생성할 수 있게 해줘요. 하지만 데모 수준에서 실제 프로덕션으로 넘어가려면 각 요소가 깔끔하게 분리되어야 하죠. A2UI v0.9가 바로 그 해답이에요. UI 의도를 선언하기 위한 프레임워크 독립적인 표준이거든요. 이 표준을 통해 로컬 또는 원격 에이전트가 어떤 클라이언트 애플리케이션과도 공통 언어로 소통할 수 있어서, 에이전트가 기존 컴포넌트 카탈로그를 활용해 어떤 장치에서든 UI를 생성할 수 있게 해줘요.

에이전트가 여러분의 디자인 시스템으로 UI를 '이야기'할 수 있어요. 바꿀 필요 없죠!

A2UI는 웹, 모바일은 물론 사용자가 있는 어디에서든 작동하도록 설계되었어요.

A2UI v0.9의 새로운 점

이번 릴리스는 에이전트를 만들고 기존 프론트엔드에 통합하는 과정을 그 어느 때보다 쉽게 만드는 데 초점을 맞췄어요. 이번 릴리스로 내부 추상화가 더욱 견고해지고, 스트리밍이 간소화되었으며, 개발자 경험도 개선되었어요.

• 'Standard'에서 'Basic'으로 이름이 바뀌었어요: 프론트엔드 개발자들은 새로운 컴포넌트를 원하지 않아요. 이미 사용하고 있는 디자인 시스템과 컴포넌트들이 있잖아요? 에이전트는 기존 프론트엔드를 사용해서 동적으로 응답해야 하죠. 이 점을 더 명확하게 하기 위해 선택적 컴포넌트 세트 이름을 'Basic'으로 변경했어요. 컴포넌트 카탈로그 문서와 코드 샘플을 확인하고, A2UI를 여러분의 멋진 프론트엔드에 연결해보세요.
• 공유 웹 코어 라이브러리: 클라이언트 측에서는 어떤 브라우저 UI 렌더러든 엄청나게 단순화해주는 공유 웹 코어 라이브러리를 도입했어요. 또한 공식 React 렌더러를 출시하고 모든 A2UI 지원 렌더러 (Flutter, Lit, Angular, React)의 버전을 업데이트했어요. 그리고 커뮤니티 렌더러를 위한 전용 공간도 마련했구요.
• 에이전트 SDK: A2UI 에이전트 SDK 덕분에 에이전트 쪽 개발이 훨씬 쉬워졌어요. 고성능, 저지연 UI 경험을 보장하기 위해 새로운 캐싱 계층으로 생성 파이프라인을 최적화했어요.
• 새로운 언어 기능: A2UI 0.9에는 클라이언트 정의 함수 (유효성 검사에 완벽해요), 에이전트와의 협업 편집을 지원하는 클라이언트-서버 데이터 동기화, 개선된 오류 처리, 그리고 간소화된 모듈형 스키마가 추가되었어요.
• 간소화된 전송: 전송 인터페이스를 개선해서 에이전트와 클라이언트를 연결하는 것이 훨씬 원활해졌어요. MCP, 웹소켓, REST, AG UI, A2A 등 원하는 어떤 방식으로든 A2UI를 사용할 수 있어요.

이 예시는 스트리밍 청크의 재생을 보여주며, 렌더러 간 시나리오를 느리게 재생하거나 다시 재생하는 모습이에요.

이제 어떤 파이썬 에이전트에든 A2UI를 추가하는 것은 pip install 또는 uv add 명령 한 번이면 끝이에요 (Go와 Kotlin 지원은 곧 출시될 예정이에요).

pip install a2ui-agent-sdk

기존 에이전트에 A2UI를 통합하는 건 간단한 5단계 과정이에요. 여기 A2UI 통합의 '헬로 월드' 예시가 있어요:

# 1단계: 선택적 예시를 포함하여 카탈로그를 정의하세요 (기본 또는 직접 가져오기)
my_catalog = CatalogConfig.from_path(
    name="<MY_CATALOG_NAME>",
    catalog_path=("file:///path/to/catalog.json"),
    # 선택 사항: 소수 학습(few-shot learning)으로 LLM을 돕기
    examples_path="path/to/examples/folder/*.json"
),

# 2단계: A2UI Spec 버전을 관리하기 위해 스키마 매니저를 초기화하세요
schema_manager = A2uiSchemaManager(
    version="0.9",
    catalogs=[my_catalog],
)

# 3단계: 시스템 프롬프트를 생성하고 A2UI 명령어를 처리해요
system_instruction = schema_manager.generate_system_prompt(
    role_description="You are a helpful assistant great at generating UI...",
) 

# 4단계: 생성된 명령으로 LLM 에이전트를 초기화하세요
my_agent = AnyAgentFrameworkLLMAgent(instruction=system_instruction, ...)

# 5단계: UI를 실행하고 스트리밍하세요
def handle_turn(user_query):
    llm_response = my_agent.respond(user_query)

    # 실행기에서 SDK는 LLM의 JSON을 즉시 파싱, 수정, 검증하는 데 도움을 줘요

    selected_catalog = schema_manager.get_selected_catalog()
    final_parts = parse_response_to_parts(llm_response, selected_catalog.validator)
    yield {
        "is_task_complete": True,
        "parts": final_parts,
    }

기본을 넘어설 때

위 예시는 간단한 정적 통합을 보여주지만, A2UI 에이전트 SDK는 프로덕션 수준의 복잡성을 위해 만들어졌어요. 기본적으로 다음을 지원하죠:

• 버전 협상: 클라이언트의 기능에 따라 최적의 A2UI 사양 버전을 동적으로 선택해요.
• 동적 카탈로그: 특정 사용자 권한이나 장치 제약 조건에 맞춰 런타임에 여러 카탈로그 스키마 간을 전환해요.
• 탄력적인 스트리밍: LLM 출력을 점진적으로 파싱하고 복구해서, 클라이언트가 UI 컴포넌트가 생성되는 대로 렌더링할 수 있게 해줘요—전체 JSON 블록을 기다릴 필요가 없죠.

이러한 고급 기능들이 어떻게 작동하는지 보려면 저희 에이전트 샘플을 살펴보세요.

개발팀은 더 나은 MCP 앱 통합, A2UI를 위한 점진적 공개 '스킬', 인간 의도 추상화, PII 지원 등 멋진 기능들을 개발 중이에요. 업데이트된 로드맵을 확인하고 여러분이 무엇을 개발하고 있는지 꼭 보여주세요!

성장하는 생성형 UI 생태계

표준은 그 주변 생태계만큼이나 중요하죠. 그리고 이 분야는 빠르게 진화하고 있어요.

• AG2: AutoGen 개발자들이 만든 AG2는 A2UI의 네이티브 통합인 A2UIAgent를 만들었어요. 위 영상에서 작동하는 모습을 볼 수 있죠.
• A2A 1.0: Agent-to-Agent (A2A) 1.0 프로토콜이 공식 출시되었어요. 다른 에이전트와 소통하거나 에이전트를 프론트엔드에 직접 연결하는 강력한 전송 수단 역할을 해요.
• Vercel의 json-renderer: Vercel은 최근 A2UI를 지원하는 개념 증명용 json-renderer를 출시했어요. 이는 Vercel 커뮤니티를 위한 A2UI 전용 렌더러가 될 수도 있겠네요.
• Oracle의 Agent Spec: Oracle은 최근 Agent Spec + AG UI + A2UI + AG UI 지원을 발표했어요. Agent Spec은 무엇이 실행될지 정의하고, AG-UI는 상호작용을 전달하며, A2UI는 사용자가 접하는 UI를 정의하죠. 각 계층에서 구현을 바꿔도 사용자 경험은 안정적으로 유지돼요.
• AG-UI: A2UI, MCP 앱, Open Generative UI를 포함한 광범위한 GenUI 기능을 에이전틱 웹 앱에 연결하는 것을 지원해요.

산업 전반에 걸쳐 A2UI의 놀라운 구현 사례들이 나타나고 있어요. 최근 몇 가지를 소개해 드릴게요:

개인 건강 도우미

GenUI 개인 건강 도우미는 정적인 대시보드를 모듈형 AI 기반 인터페이스로 대체하여 '데이터 사일로'와 '내비게이션 피로'를 없애기 위해 설계된 오픈 소스 앱이에요. Rebel App Studio와 Codemate의 전문 플러터(Flutter) 팀이 개발한 이 솔루션은 실시간 데이터 오케스트레이션을 활용해 파편화된 의료 기록과 웨어러블 원격 측정 데이터 사이의 간극을 메워줘요. 사용자들을 하위 메뉴를 뒤지도록 강요하는 대신, 앱은 중앙 LLM 기반 챗봇을 활용해서 즉각적인 맥락에 따라 중요한 검사 결과, 백신 만료일, 진료소 위치 등 UI 위젯을 동적으로 생성해 즉시 보여줘요. 사용자의 고유한 건강 데이터에 AI 통찰력을 직접 그라운딩함으로써, 이 앱은 수동적인 건강 추적을 현대 디지털 환자를 위한 능동적이고 의도 중심적인 도우미로 변화시켜 줘요.

건강 도우미가 어떻게 구축되었는지 더 자세히 알아보려면 Codemate 블로그를 살펴보세요. 그리고 GitHub에서 오픈 소스 데모도 확인할 수 있어요.

개인 재무 플래너

인생 목표 시뮬레이터는 생성형 UI가 소비자 기대치와 현재 금융 서비스 산업이 제공하는 정적인 경험 사이의 간극을 어떻게 메워주는지 보여주는 인터랙티브 데모에요. 토요타(Toyota)나 가이코(GEICO)와 같은 브랜드들이 신뢰하는 플러터 및 GenUI 컨설팅 회사인 Very Good Ventures (VGV)가 구축한 이 앱은 사용자 삶을 경험의 중심에 두어, 전통적인 일률적인 인터페이스를 넘어섰어요. 은퇴 자금 마련이나 첫 집 구매와 같은 페르소나와 목표를 선택하면, 사용자는 제미나이(Gemini)에게 주도권을 넘겨줘요. 제미나이는 플러터 GenUI SDK를 활용해 슬라이더, 막대 차트, 다중 선택 등 선별된 인터랙티브 위젯 카탈로그에서 네이티브 느낌의 실시간 UI를 생성하죠.

이 데모의 오픈 소스 코드를 확인하고, 이 경험의 라이브 인터랙티브 데모도 볼 수 있어요.

어떤 에이전트 프레임워크와도 함께하는 A2UI (AG-UI를 통해)

이미 AG-UI와 소통하는 에이전트라면 어떤 것이든 바로 A2UI v0.9를 구동할 수 있어요. 별도의 커스텀 통합은 필요 없죠. 이는 AG-UI의 미들웨어 시스템을 통해 작동하는데요. 기존 에이전트 파이프라인에 연결되는 작은 코드 조각이에요. 이 미들웨어는 에이전트에게 A2UI와 소통하는 법을 가르쳐주고, 응답을 올바르게 연결하며, 에이전트의 출력을 A2UI의 내장 렌더러나 여러분의 커스텀 컴포넌트를 사용해 UI가 즉시 렌더링할 수 있는 컴포넌트로 변환하는 스트리밍을 처리해요.

이 스타터 템플릿을 여러분의 머신에서 실행해보세요.

npx copilotkit@latest create my-app --framework a2ui

시작하기

에이전트의 속박을 풀고, 여러분이 가진 어떤 컴포넌트든 활용해서 프론트엔드를 구동할 준비가 되셨나요?

재생 기능을 제공하는 새로운 A2UI 시어터를 확인하거나, 지금 바로 유연하고 휴대 가능한 생성형 UI를 구축하기 위한 문서, 샘플 및 개발 가이드가 있는 A2UI.org로 깊이 들어가 보세요.