google-labs-code/stitch-sdk

Generate UI screens from text prompts and extract their HTML and screenshots programmatically.

해결하는 문제

개발자가 텍스트 프롬프트를 사용하여 UI 스크린을 프로그래밍 방식으로 생성, 편집, 반복할 수 있도록 합니다. 텍스트 기반의 디자인 아이디어와 실제 코드 사이의 격차를 메우며, 생성된 스크린의 HTML과 스크린샷을 제공합니다.

작동 방식

SDK는 백엔드 서비스와 상호작용하여 프로젝트를 생성하고 자연어 설명에 기반해 스크린을 생성합니다. 프롬프트를 수정하거나 여러 디자인 변형(레이아웃, 색상 테마 등)을 생성함으로써 반복적인 디자인을 지원합니다. 또한 "툴 클라이언트"와 Vercel AI SDK 및 Google Agent Development Kit (ADK) 통합을 제공하여 AI 에이전트가 자율적으로 디자인 도구를 호출해 인터페이스를 구축할 수 있도록 합니다.

대상 사용자

  • 프론트엔드 개발자: 텍스트에서 UI 스크린을 빠르게 프로토타이핑하고 싶은 분들.
  • AI 에이전트 개발자: 자율적인 디자이너나 인터페이스 생성 및 수정이 가능한 오케스트레이션 스크립트를 개발하는 분들.
  • 프로덕트 디자이너: 스크린의 다양한 시각적 변형을 프로그래밍 방식으로 탐색하고 싶은 분들.

주요 기능

  • 텍스트에서 UI 생성: 프롬프트로부터 전체 스크린을 생성하고 HTML 및 이미지 자산을 가져올 수 있습니다.
  • 반복 편집: 후속 텍스트 프롬프트를 사용해 기존 스크린을 수정할 수 있습니다.
  • 디자인 변형: 폰트나 색상 등 특정 요소에 대한 제어를 통해 여러 버전의 스크린을 생성할 수 있습니다.
  • 에이전트 호환: MCP (Model Context Protocol) 도구 내장 지원으로 Vercel AI SDK 및 Google ADK와 같은 LLM 프레임워크에 쉽게 통합할 수 있습니다.
  • 디자인 시스템 통합: 프로젝트 간 일관된 시각적 테마를 생성하고 적용할 수 있습니다.

관련

  • 프로젝트
  • 프로젝트
  • 프로젝트
  • 프로젝트
  • 프로젝트