Figma가 Figma Make에 로컬 코드베이스 연동 기능을 추가했습니다. 이제 사용자는 Figma 안에서 실제 프로덕션 코드베이스를 연결하고, 화면을 보며 UI를 수정할 수 있습니다.
이번 업데이트는 Figma Make를 단순한 AI 프로토타이핑 도구에서 코드 기반 제품 제작 도구로 확장하는 변화입니다. Figma는 디자인 캔버스, 코드 기반 프로토타입, 실제 제품 코드를 하나의 작업 흐름 안에 연결하려는 방향을 제시했습니다.
새 기능의 핵심은 시각적 코드 편집입니다. 사용자는 Make에서 화면 요소를 선택한 뒤 레이아웃, 색상, 폰트, 크기 같은 속성을 직접 조정할 수 있습니다. 그러면 AI 에이전트가 관련 코드를 찾아 수정하고, 화면에 반영합니다. 사용자는 코드 파일을 직접 열지 않아도 UI 변경을 적용할 수 있습니다.
속성 변경을 넘어서는 작업에는 주석 기반 요청을 사용할 수 있습니다. 예를 들어 특정 요소에 애니메이션이나 인터랙션을 추가하고 싶을 때, 화면 위에 설명을 남기면 에이전트가 그 맥락을 참고해 코드를 수정합니다. Figma는 이를 직접 편집과 일반 프롬프트 사이에 있는 방식으로 설명했습니다.
개발 워크플로도 포함됩니다. Make는 Git 기반 작업을 지원합니다. 사용자는 Make 안에서 브랜치를 만들고, 변경 사항을 로컬 커밋으로 저장하고, 필요하면 되돌릴 수 있습니다. 최종적으로는 팀의 개발 프로세스에 맞게 PR을 열어 엔지니어가 검토할 수 있습니다.
협업 방식도 확장됩니다. Make에서 수정한 로컬 코드 변경 사항은 파일 링크로 공유할 수 있습니다. 팀원이 같은 브랜치에 접근할 수 있으면 변경 내용을 확인하고 이어서 작업할 수 있습니다. 커밋 히스토리를 통해 이전 상태와 수정 후 상태를 비교하는 것도 가능합니다.
Figma Design과 Make 사이의 왕복 흐름도 강화됩니다. 사용자는 Make의 화면, 페이지, 컴포넌트를 Figma 캔버스로 복사해 레이어로 붙여넣을 수 있습니다. 이후 팀이 Figma Design에서 코멘트하거나 수정하면, Figma가 변경 사항을 감지해 다시 Make로 가져와 코드에 적용하도록 제안합니다.
이번 업데이트는 디자이너와 개발자의 경계를 다시 정의하려는 시도로 볼 수 있습니다. Figma는 “디자인 대 코드”라는 구분이 잘못된 이분법이라고 설명했습니다. 사용자는 디자인 캔버스, 프로토타이핑 환경, 실제 코드 중 지금 필요한 도구를 선택해 이동할 수 있어야 한다는 입장입니다.
다만 초기 베타의 적용 범위는 제한적입니다. Figma는 이 기능이 회사 코드베이스에 접근할 수 있는 디자이너에게 가장 적합하다고 설명했습니다. 베타는 2026년 5월 28일부터 순차적으로 제공되며, 당분간 Mac용 Figma Beta 데스크톱 앱에서만 사용할 수 있습니다.
Figma Make의 새 기능에는 직접 편집, 주석, 채팅, PR 생성이 포함됩니다. 베타 기간에는 크레딧을 소모하지 않으며, AI 크레딧 가격 정책은 추후 발표될 예정입니다. 사용자는 대기자 명단에 등록할 수 있지만, 등록이 곧바로 베타 접근을 보장하지는 않습니다.
이번 발표는 AI 디자인 도구의 경쟁 축이 바뀌고 있음을 보여줍니다. 초기 AI 디자인 도구가 화면 생성과 프로토타입 제작에 집중했다면, Figma Make는 실제 코드베이스와 연결되는 방향으로 이동하고 있습니다. 앞으로 중요한 기준은 예쁜 화면을 생성하는 능력보다, 팀의 기존 코드와 디자인 시스템 안에서 안전하게 수정하고 배포 흐름까지 연결할 수 있는지에 가까워질 가능성이 큽니다.
더 보기 및 출처
https://www.figma.com/blog/figma-make-now-on-your-local-code
