Skip to content
푸땡로그
Go back

SDUI, json-render, A2UI: AI가 UI를 설계하는 방식이 바뀌는 중

AI가 UI를 만든다는 말은 이제 낯설지 않습니다.
다만 요즘 중요한 질문은 더 구체적입니다. 무엇을 생성하게 할 것인가, 어디까지 허용할 것인가, 어떤 표준으로 안전하게 렌더링할 것인가입니다.

이 질문을 정리할 때 가장 큰 우산이 바로 SDUI(Server-Driven UI) 입니다.
그리고 최근 흐름을 보면 이 SDUI는 단순히 “서버가 화면 JSON을 내려준다”는 전통적 의미를 넘어서고 있습니다. Vercel의 json-render 같은 생성형 UI 프레임워크, Google의 A2UI 같은 agent-driven interface 프로젝트가 그 다음 단계를 밀고 있습니다.

먼저 결론부터 말하면, 저는 지금의 흐름을 이렇게 봅니다.

UI는 점점 더 ‘코드’가 아니라 ‘계약’이 되고, AI는 그 계약 안에서만 창작하게 된다.


SDUI는 정확히 무엇인가요?

SDUI는 말 그대로 서버가 UI의 일부 또는 대부분을 결정하는 구조입니다.
클라이언트는 화면을 완전히 독립적으로 조립하기보다, 서버가 내려준 스키마나 구성 정보를 바탕으로 렌더링합니다.

전통적인 SPA는 보통 이런 식입니다.

SDUI는 이 역할 분리를 조금 다르게 잡습니다.

이 접근은 특히 다음 상황에서 강합니다.

즉, SDUI는 “서버가 HTML을 직접 뿌리는 옛 방식”이 아니라, UI 구성 책임을 데이터화하는 설계 패턴에 가깝습니다.

flowchart TB
    A["요청"] --> B["서버 정책/상태"]
    B --> C["UI 스펙 또는 스키마"]
    C --> D["허용된 컴포넌트 카탈로그"]
    D --> E["클라이언트 렌더링"]
    E --> F["사용자 화면"]

json-render는 SDUI를 AI 시대에 맞게 다시 해석합니다

Vercel의 json-render는 공식 사이트에서 스스로를 The Generative UI Framework라고 부릅니다.
핵심 문구도 분명합니다. 프롬프트로부터 대시보드, 위젯, 앱을 만들되, 사용자가 정의한 컴포넌트 안으로 안전하게 제한하겠다는 겁니다.

이게 중요한 이유는 명확합니다.
LLM에게 UI를 직접 생성하게 하면 자유도는 높아지지만, 실서비스에서는 바로 문제가 생깁니다.

json-render는 이 문제를 “코드 생성”이 아니라 “구조 생성”으로 바꿉니다.
모델이 JSX를 마음대로 쓰게 하지 않고, 허용된 컴포넌트와 액션 카탈로그 안에서 JSON을 생성하게 하는 방식입니다.

이건 사실 SDUI의 현대적 버전으로 볼 수 있습니다.
예전 SDUI가 서버가 화면 구성을 정한다면, json-render는 AI가 서버 역할의 일부를 맡되, 결국 정해진 계약 안에서만 말하게 한다는 점이 다릅니다.

핵심 차이
SDUI는 보통 서버 주도 렌더링 패턴을 말하고, json-render는 그 패턴을 생성형 UI에 맞게 바꿔 놓은 쪽에 가깝습니다. 즉, “서버가 정한다”에서 “모델이 정하되, 정해진 스키마 안에서만”으로 이동합니다.

json-render 공식 문서에서 눈에 띄는 키워드는 components, actions, structured output, React, React Native입니다.
이 조합은 단순한 데모를 넘어서, 웹과 모바일 모두에서 재사용 가능한 UI 계약을 만들겠다는 방향을 보여줍니다.


A2UI는 한 단계 더 멀리 갑니다

Google의 A2UI는 공식 블로그에서 agent-driven interfaces를 위한 오픈 프로젝트라고 설명합니다.
설명만 보면 방향이 더 선명합니다.

여기서 중요한 차이는 “UI를 누가 결정하느냐”입니다.
SDUI가 서버를 중심에 둔다면, A2UI는 에이전트가 상황에 맞는 인터페이스를 조립하는 구조를 더 노골적으로 전면에 둡니다.

말하자면 이런 흐름입니다.

A2UI는 이름 그대로 Agent to UI에 가깝습니다.
즉, 사람 중심의 화면 제어가 아니라 에이전트 중심의 인터페이스 편성을 염두에 둔 표준화 시도입니다.

관찰 포인트
A2UI의 핵심은 “화려한 위젯을 많이 만들자”가 아닙니다. 오히려 에이전트가 임의 코드 대신 선언적 포맷만 내보내게 해서, 멀티에이전트 환경에서도 UI를 안정적으로 합성하자는 쪽에 가깝습니다.

세 흐름의 관계를 정리하면

SDUI, json-render, A2UI는 같은 계열이지만 초점이 조금씩 다릅니다.

관점SDUIjson-renderA2UI
중심서버생성형 프레임워크에이전트
출력화면 구성 데이터제약된 JSON UI선언적 인터페이스 포맷
강점일관성, 실험, 운영안전한 생성형 UI에이전트-UI 연결
핵심 질문무엇을 내려줄까무엇을 생성하게 할까어떤 UI를 고르게 할까

이 셋을 한 문장으로 묶으면 이렇습니다.

SDUI는 UI의 결정을 데이터로 바꾸고, json-render는 그 데이터를 AI가 만들 수 있게 제한하며, A2UI는 에이전트가 그 결정을 더 잘 수행하도록 표준을 잡는다.


AI와 UI의 관계는 왜 이렇게 바뀌나요?

저는 이 변화가 단순 유행이 아니라, AI 제품이 자리를 잡는 방식 자체의 변화라고 봅니다.

1. 텍스트만으로는 부족합니다

AI가 답을 잘해도, 사용자가 그 답을 해석하고 다음 행동으로 옮겨야 하면 마찰이 남습니다.
그래서 더 나은 결과는 종종 텍스트가 아니라 카드, 차트, 폼, 상태, 액션 버튼으로 나옵니다.

2. 자유도보다 통제가 중요해졌습니다

모델이 무엇이든 만들 수 있으면 데모는 멋집니다.
하지만 제품은 예측 가능해야 합니다. 그래서 생성형 UI는 결국 허용 목록, 스키마, 카탈로그, 검증 규칙으로 수렴합니다.

3. 웹과 모바일을 같이 다뤄야 합니다

하나의 AI 경험이 웹에서만 작동하면 점점 부족합니다.
실제 제품은 브라우저, iOS, Android, 데스크톱, 내부 툴에 걸쳐 있으니, 플랫폼 중립적인 UI 계약이 더 중요해집니다.

4. 에이전트는 화면까지 관여하게 됩니다

이제 AI는 답변만 만드는 게 아니라, 다음에 보여줄 화면을 고릅니다.
즉, LLM의 역할이 언어 생성에서 인터페이스 오케스트레이션으로 넓어집니다.

이 흐름은 예전에 다뤘던 OpenGenerativeUI 살펴보기Vercel의 json-render 살펴보기와도 이어집니다.
전자는 “시각적인 생성형 UI를 실제로 어떻게 붙일까”에 더 가깝고, 후자는 “안전한 생성형 UI를 어떤 계약으로 만들까”에 가깝습니다.


현재 트렌드는 어디로 가고 있나요?

최근 흐름은 꽤 분명합니다.

1. 자유형 생성에서 계약형 생성으로

초기 생성형 UI는 “무엇이든 그려보자”에 가까웠습니다.
하지만 지금은 “허용된 컴포넌트만 조합하자”로 이동 중입니다.

2. 렌더링보다 조율이 중요해짐

모델이 직접 최종 HTML을 뱉는 방식보다,
에이전트가 의도를 해석하고, UI를 고르고, 상태를 유지하고, 렌더러는 안전하게 출력하는 분업 구조가 더 현실적입니다.

3. 디자인 시스템이 중심이 됨

생성형 UI는 디자인 시스템을 대체하지 않습니다.
오히려 디자인 시스템을 카탈로그화해서 AI가 재사용하도록 만드는 방향이 더 유력합니다.

4. 멀티모달보다 멀티표면이 중요해짐

한 모델이 여러 입력을 이해하는 것만으로는 부족합니다.
그 결과를 웹, 모바일, 내부 운영 도구, 에이전트 콘솔 같은 여러 표면에 맞게 보여주는 능력이 중요해지고 있습니다.


앞으로의 발전 방향

제가 보기엔 앞으로는 다음 네 가지가 중요해질 가능성이 큽니다.

1. 더 강한 스키마와 검증

생성형 UI는 결국 안전장치 싸움입니다.
스키마 검증, 액션 화이트리스트, 상태 경계, 접근 제어가 점점 더 중요해질 겁니다.

2. 에이전트 친화적 UI 카탈로그

디자인 시스템이 사람 디자이너를 위해 정리됐다면, 앞으로는 에이전트가 읽기 쉬운 카탈로그가 필요합니다.
컴포넌트 이름, props 제약, 의도 설명, 상호작용 규칙이 더 구조화될 겁니다.

3. 선언적 UI와 코드를 오가는 워크플로

AI가 만든 UI를 그대로 실행하기보다,
먼저 선언적으로 생성하고, 필요하면 코드로 export하고, 사람이 다시 다듬는 흐름이 일반적이 될 수 있습니다.

4. UI는 점점 제품 정책이 됨

어떤 화면을 누구에게 보여줄지, 어떤 액션을 열어둘지, 어떤 정보 밀도를 허용할지는 점점 제품 로직과 정책의 문제로 바뀝니다.
즉, UI는 더 이상 단순한 프런트엔드 코드가 아니라 운영 가능한 정책 계층이 됩니다.


정리하면

SDUI는 오래된 개념이지만, AI 시대에 다시 살아났습니다.
json-render는 그 흐름을 생성형 UI로 밀어붙이고, A2UI는 에이전트가 UI를 선택하고 조립하는 미래를 표준화하려고 합니다.

그래서 지금의 변화는 단순히 “AI가 화면을 그린다”가 아닙니다.
더 정확히는 AI가 화면을 결정하되, 그 결정은 점점 더 제한되고 구조화된다는 쪽에 가깝습니다.

이 방향이 마음에 드는 이유는 분명합니다.
AI에게 무한한 자유를 주는 대신, 좋은 제약을 설계하는 쪽이 실제 제품을 더 강하게 만들기 때문입니다.

앞으로의 UI는 아마도 사람과 모델이 함께 읽을 수 있는 계약서에 더 가까워질 겁니다.
그리고 그 계약서의 핵심 문법이 바로 SDUI일 가능성이 큽니다.


참고 자료


Share this post on:

Previous Post
DTCG Design Tokens Format Module 2025.10과 DESIGN.md: 디자인 토큰을 에이전트가 읽는 법