AI로 Figma 디자인을? 새로운 CLI 도구 등장!
AI 에이전트가 Figma 디자인을 할 수 있도록 돕는 CLI 도구, Figma-use가 출시됨
기존 플러그인 API의 한계를 극복하고, JSX 임포트 속도 100배 향상을 달성
자연어 기반 디자인 프로토타이핑에 대한 긍정적 평가와 코드 핸드오프(Code Handoff) 문제 제기
Figma MCP(Multiplayer Protocol) 서버의 한계와 CLI 기반 접근 방식의 장점에 대한 논의
Figma-use: AI 기반 디자인 자동화의 핵심
Figma-use는 AI 에이전트가 Figma 디자인을 직접 수행할 수 있도록 설계된 CLI 도구이다. 100개 이상의 명령어를 지원하며, JSX를 사용하여 컴포넌트를 임포트하는 방식을 통해 기존 플러그인 API보다 100배 빠른 속도를 제공한다. 개발자는 Bun과 Citty를 사용하여 CLI를 구축하고, Elysia WebSocket 프록시를 통해 Figma의 내부 멀티플레이어 프로토콜에 접근한다.
MCP(Multiplayer Protocol) 서버의 한계와 CLI의 대안
커뮤니티에서는 Figma의 MCP 서버가 가진 제한 사항에 주목하며, Figma-use와 같은 CLI 기반 접근 방식의 장점을 강조한다. 특히, MCP 서버는 파일 읽기만 가능하지만, CLI는 AI 에이전트가 디자인을 생성하고 수정할 수 있도록 지원한다. 또한, Figma MCP는 프로 라이선스를 요구하지만, CLI의 라이선스 정책에 대한 추가적인 정보는 언급되지 않았다.
자연어 기반 디자인 프로토타이핑과 코드 핸드오프(Code Handoff) 문제
자연어를 사용하여 디자인을 프로토타이핑하는 방식에 대한 긍정적인 평가가 있는 반면, 코드 핸드오프(Code Handoff) 과정에서 발생하는 문제점도 지적된다. 특히, AI를 통해 생성된 디자인을 기존 코드베이스에 통합하는 과정에서 디자인 시스템(Design System)과의 일관성 유지 및 코드 품질 관리의 어려움이 발생할 수 있다. 따라서, 기존 컴포넌트와 디자인 토큰을 활용하는 방안이 제시된다.
PenPot과 Figma 생태계 비교
일부 사용자들은 Figma의 경쟁 플랫폼인 PenPot에 주목하며, PenPot의 개발자 친화적인 기능과 무료 코드 모드(Code Mode)를 언급한다. 이는 Figma-use와 같은 도구의 등장이 Figma 생태계 내 경쟁을 심화시키고, 개발자 경험을 개선하려는 노력을 촉진할 수 있음을 시사한다. PenPot은 Figma의 대안으로, 오픈소스 디자인 도구(Open Source Design Tool)로서의 강점을 가지고 있다.