피그마, AI 에이전트에 캔버스 개방

협업 디자인 및 제품 개발 플랫폼 피그마는 AI 에이전트가 ‘피그마 캔버스’에서 디자인을 직접 생성하고 수정할 수 있도록 지원한다고 25일 발표했다.

피그마 MCP 서버를 통해 제공되는 ‘use_ figma’ 도구를 사용하면 클로드코드, 오픈AI 코덱스 등 주요 MCP 클라이언트에서 팀의 디자인 시스템(컴포넌트, 변수, 토큰 등)에 기반한 디자인 에셋을 생성하고 수정할 수 있다.

기존 AI 활용 워크플로우에서는 AI 에이전트가 생성한 UI와 팀의 디자인 시스템 사이에 괴리가 발생하는 점이 한계로 지적돼 왔다. 새 도구 ‘use_ figma’를 통해 디자인팀과 개발팀은 에이전트와 같은 컨텍스트 안에서 코드와 캔버스를 보다 매끄럽게 오갈 수 있게 된다. 명명 규칙, 컴포넌트 구조, 라이브러리 구성 방식 등 디자인팀이 오랜 시간 축적해 온 의사결정이 AI 에이전트의 작업 방식에 직접 반영되는 구조다.

피그마는 ‘use_figma’ 도구와 함께 AI 에이전트의 작업 방식을 정의하는 신규 기능 ‘Skills’를 선보인다. Skills는 피그마 캔버스에서 에이전트가 어떤 단계와 순서, 규칙에 따라 작업할지를 안내하는 마크다운 기반의 지침 세트다. 플러그인 개발이나 별도의 코딩, 승인 절차 없이 누구나 작성할 수 있으며, 피그마에 익숙한 사용자라면 팀 고유의 워크플로우에 맞춰 에이전트의 작업 방식을 세밀하게 설계할 수 있다.

Skills의 핵심에는 다른 모든 스킬의 기반이 되는 ‘/use-figma’가 있다. 이 스킬은 피그마의 구조부터 핵심 원칙에 이르기까지, 피그마가 어떻게 작동하는지에 대한 공통된 이해를 에이전트에 제공한다. 출시 시점에 라이브러리 생성, 디자인 생성 등 8종의 예시 스킬이 제공되며, 향후 더 많은 스킬이 순차적으로 추가될 예정이다.

Skills는 이른바 ‘자기 수정 루프(self-healing loop)’를 통해 AI 에이전트의 출력 품질을 높이는 데에도 활용될 수 있다. 에이전트가 화면을 생성한 뒤 스크린샷을 촬영해 실행 중인 코드와 비교하고, 차이가 있는 부분을 반복적으로 수정하는 방식이다. 에이전트는 컴포넌트, 변수, 오토 레이아웃 등 실제 구조를 바탕으로 동작하기 때문에 시각적 결과뿐 아니라 시스템 전반까지 함께 조정할 수 있다.

이번 기능은 피그마 MCP 서버에 네이티브로 구현돼 피그마의 보안성과 안정성을 그대로 활용할 수 있다. 또한 플러그인 API를 통해 코드 커넥트, 피그마 드로우, 피그잼 등 주요 기능에도 접근할 수 있다. 피그마는 앞으로 에이전트가 캔버스에서 수행할 수 있는 작업 범위를 지속적으로 확대하고, Skills의 활용과 공유를 더욱 쉽게 지원해 나갈 계획이다. 아울러 현재 플러그인 API를 통해 구현 가능한 기능과의 수준을 맞추는 것을 목표로 관련 기능을 순차적으로 추가할 예정이다.

‘use_ figma’ 도구와 ‘Skills’ 기능은 24일부터 피그마 MCP 서버를 통해 베타 버전으로 제공되고 있다. 베타 기간 동안에는 무료로 이용할 수 있으며, 이후 유료 API 형태로 전환될 예정이다. 현재 Augment, 클로드콛, 코덱스, 코파일럿 CLI, 코파일럿 인 VS코드, 커서, 팩토리, 파이어벤더, 와프 등 주요 MCP 클라이언트에서 사용할 수 있다.

피그마 최고제품책임자(CPO) 유키 야마시타는 “이제 팀은 다양한 에이전트를 통해 기존 디자인 시스템을 충분히 인지한 상태에서 실제 피그마 에셋을 생성하고 편집할 수 있다”며 “이를 통해 초기 디자인 구상부터 디자인 시스템 구축 및 업데이트에 이르기까지, 에이전트 활용 범위를 한층 넓힐 수 있게 됐다”고 밝혔다.

글. 바이라인네트워크
<김우용 기자>yong2@byline.network