본문으로 건너뛰기
IFAI

오픈소스

코파일럿킷, 챗GPT식 동적 인터페이스 오픈소스 '오픈 인텔리전트 UI' 공개

게시 확산 지수 48

코파일럿킷이 챗GPT의 동적 인터페이스 생성 기능을 자체 앱에 구축할 수 있는 오픈소스 '오픈 인텔리전트 UI'를 공개했다. 에이전트가 작업에 맞춰 샌드박스 내 대화형 위젯을 실시간 생성하거나 기존 컴포넌트를 호출한다. 특정 모델에 얽매이지 않고 고유 디자인 시스템을 유지할 수 있는 점이 핵심이다.

이미지: youtube.com

오픈 인텔리전트 UI(Open Intelligent UI)는 챗GPT의 인텔리전트 UI와 같은 동적 인터페이스 생성 역량을 자체 애플리케이션에 구축할 수 있도록 지원하는 오픈소스 프레임워크입니다.

오픈AI가 챗GPT에 선보인 동적 UI는 대화 맥락에 따라 실시간으로 차트, 지도, 동작하는 도구를 만들어내지만, 외부 API가 제공되지 않는 폐쇄형 기능입니다. 코파일럿킷(CopilotKit)은 기존 제품의 컴포넌트와 디자인 시스템을 그대로 유지한 채 동일한 사용자 경험을 구현할 수 있도록 이 프로젝트를 오픈소스로 공개했습니다.

어떻게 동작하는가

이 도구는 작업 복잡도에 따라 완전 제어 방식부터 자율 생성 방식까지 유연하게 선택합니다.

간단한 데이터 표나 정형 정보의 경우 구글의 A2UI 규격을 활용해 제품에 이미 구축된 네이티브 프론트엔드 컴포넌트를 호출합니다. 이를 통해 기업 고유의 폰트, 색상, 레이아웃을 그대로 유지할 수 있습니다.

반면 인터랙티브 계산기나 3D 그래픽 같은 복잡한 도구가 필요할 때는 generateSandboxedUi 함수를 통해 HTML, CSS, 자바스크립트를 실시간 스트리밍으로 작성합니다. 작성된 코드는 안전하게 격리된 iframe 샌드박스 내부에서 렌더링되며, 생성되는 즉시 화면에 나타납니다.

생성된 위젯 내부의 버튼 클릭이나 조작은 다음 턴의 대화 맥락으로 에이전트에 다시 전달됩니다. 필요한 경우 생성된 인터페이스를 독립된 단일 HTML 파일로 내려받는 것도 가능합니다.

오픈 프로토콜과 실행 환경

기술적으로는 코파일럿킷의 오픈 제너러티브 UI를 기반으로 하며, 에이전트 구동에는 랭체인 딥 에이전트(LangChain Deep Agents)가 쓰입니다. 응답 생성은 오픈AI 모델이, 포맷 결정은 타입세이프(TypeSafe)의 Jev가 담당합니다.

특히 에이전트와 사용자 앱 간 오픈 표준인 AG-UI 프로토콜과 MCP Apps를 지원하므로 모델 종속성을 탈피했습니다. 프론트엔드 수정 없이 백엔드 에이전트를 마스트라(Mastra), 구글 ADK, 마이크로소프트 에이전트 프레임워크 등으로 교체할 수 있습니다.

프로젝트는 깃허브 CopilotKit/OpenIntelligentUI 저장소에서 누구나 내려받을 수 있습니다. 클론 후 make setup 및 make dev 명령어로 바로 구동되며, 챗 상단 헤더에 오픈AI와 타입세이프 API 키를 입력하면 즉시 테스트가 가능합니다.

왜 중요한가

우리는 이 프로젝트가 빅테크의 폐쇄형 UX를 일반 개발 생태계로 빠르게 가져왔다는 점에서 실용적 가치가 크다고 봅니다.

오픈AI 디자인 팀의 앤드루 첸(Andrew Chen)이 언급했듯, 생성형 UI의 핵심 과제는 단순히 UI를 찍어내는 것이 아니라 제품 본연의 디자인에 완벽히 녹아들게 만드는 일입니다. 자체 에이전트 서비스를 개발 중인 팀이라면 지금 바로 검토해볼 만합니다.

다만 완전 자율 샌드박스 생성 기능은 모델의 코드 생성 품질에 크게 좌우되므로, 실서비스 환경에서는 사전에 정의된 안전한 네이티브 컴포넌트를 호출하는 제어 모드 중심으로 적용하는 편이 유리합니다.

출처 (1)

  1. [1]

매일 AI 콘텐츠 픽