Figma Design Agent 공부 정리 | 캔버스 안에 있다는 게 뭘 바꾸는 걸까
Figma 캔버스에 내장된 에이전트 발표를 읽었다. MCP 서버와 뭐가 달라졌는지, 디자인 시스템과 어떻게 연결되는지 정리한 것.
Figma 공식 블로그에서 에이전트 발표가 올라왔다. “The Figma design agent is here”라는 제목을 보고 처음엔 “기존 MCP 기능 업데이트겠지” 하고 넘어가려다가, 캔버스 안에서 직접 작동한다는 설명에서 멈추게 됐다.
읽어보니 이전에 Figma가 내놨던 MCP 서버랑 구조적으로 다른 이야기를 하고 있었다. 그래서 뭐가 달라진 건지 정리해봤다.
1️⃣ 이게 뭐냐?
Figma Design Agent는 Figma 캔버스 안에 내장된 AI 에이전트다. 핵심은 에이전트가 파일 전체를 맥락으로 들고 있다는 점이다. 컴포넌트 구조, 토큰, 기존 레이어 구성을 기준 삼아 작업한다.
크게 세 가지를 한다.
방향 탐색: 체크아웃 플로우나 정보 구조의 여러 버전을 동시에 만들어 비교하는 식이다. 컴포넌트나 토큰을 지정해서 결과 방향을 잡아줄 수도 있다.
반복 작업 처리: 컴포넌트 일괄 교체, 패딩 일관성 맞추기, 더미 콘텐츠 채우기, 다크모드 변환. 규모가 큰 파일에서 손으로 하면 시간이 걸리는 것들이다.
피드백 통합: 댓글을 읽어서 패턴을 정리하고, 다른 이해관계자 관점에서 디자인을 점검한다.
이전 MCP 서버 방식은 코드 에디터나 외부 도구에서 Figma 파일에 접근하는 구조였는데, 이번 에이전트는 파일 안에 있다. 작업 흐름이 캔버스를 벗어나지 않는다는 게 가장 눈에 띄는 차이인 것 같다.
2️⃣ 내가 든 생각
읽으면서 계속 걸렸던 건 “문맥을 안다”는 표현이었다. 같은 “패딩 일관성 맞추기”라도, 파일 전체를 기준으로 처리하는 것과 선택된 레이어만 보고 처리하는 건 결과가 다를 것 같다.
👉🏻 그렇다면 디자인 시스템이 잘 정리된 파일과 그렇지 않은 파일에서 같은 에이전트가 만드는 결과물이 어떻게 달라질지가 궁금해졌다. 컴포넌트 이름이 제각각이고, 토큰도 없고, 레이어 구조도 흐릿하면 에이전트가 “이해”할 거리 자체가 적어지는 게 아닐까.
디자이너로서 보면 이 에이전트는 파일을 잘 만들어둔 팀에서 더 효과를 낼 것 같다. 반대로 말하면, 파일 정리 습관이 AI 도구의 활용 폭을 결정하는 변수가 된다는 거기도 하고.
💡 여기서 드는 질문? 에이전트가 파일 맥락을 “이해한다”고 할 때, 그게 어디까지를 의미하는 걸까. 컴포넌트 구조는 파악해도 디자인 결정의 이유까지 알진 않을 텐데, 그 빈자리는 어떻게 채워지는 걸까.
3️⃣ 앞으로 어떻게 쓸까?
아직 베타이고 직접 닿아본 적은 없는데, 문서를 읽으면서 든 생각이 하나 있었다.
에이전트가 반복 작업을 처리해주면, 그 시간에 뭘 결정해야 하는지를 더 잘 알아야 할 것 같다는 거다. “여러 방향을 빠르게 생성”해주는 도구가 생기면, 방향들 중에서 고르는 판단이 더 중요해지는 게 아닐까 싶었다.
⭐️ 마지막으로, 디자이너 입장에서 공부하며 든 생각
결국 핵심은 에이전트가 얼마나 똑똑한가가 아니라, 에이전트에게 넘겨줄 맥락이 얼마나 정리되어 있냐쪽에 있는 것 같다.
파일 안에 맥락이 없으면 이해할 거리도 없다. 컴포넌트 정리, 토큰 정리, 레이어 구조 정리 — 이게 결국 AI 도구를 잘 쓰기 위한 준비이기도 하다는 게 이번 공부에서 남은 인상이었다.