피그마, ‘메이크’로 디자인과 제품 개발 환경 통합한다
시각적이고 협업 중심적인 제품 개발 워크플로우 구축해
구글 검색 선호 매체로 추가
글로벌 협업 디자인 및 제품 개발 플랫폼 피그마가 피그마 메이크(Figma Make)를 통해 디자인과 실제 코딩 환경을 통합하고, 디자인부터 구현까지의 제품 개발 과정을 하나의 워크플로우로 연결하는 기능을 공개했다.
이번 피그마 메이크 업데이트의 핵심은 로컬 코드베이스와의 직접 연동 및 시각적 코드 편집 기능이다. 사용자가 피그마 메이크에 실제 운영 환경이나 테스트용 코드 저장소를 연결하면, 시스템이 로컬 개발 서버를 자동으로 실행하고 필요한 의존성을 자동으로 설치해, 실제 사용자와 동일한 데이터 및 환경을 기반으로 앱을 피그마 내에서 확인할 수 있도록 지원한다.
이를 통해 사용자는 실제 데이터와 환경이 반영된 앱 화면을 보면서 레이아웃, 색상, 글꼴 크기, 위치, 효과 등을 시각적으로 직접 조정할 수 있으며, 시각적 변경 사항을 적용하면 내장된 AI 에이전트가 관련 코드 파일을 실시간으로 찾아 자동 수정해 화면에 반영한다.
복잡한 상호작용이나 애니메이션 수정이 필요할 경우에는 렌더링 화면 위 요소에 직접 주석을 달아 코딩 에이전트에게 지시할 수 있다. 직접 편집과 일반 프롬프트 사이의 유연함을 제공하기 위해, 단순 텍스트 입력뿐만 아니라 음성, 이미지, 피그마 프레임 등을 추가해 구체적인 맥락을 전달하는 것이 특징이다. 사용자는 코딩 에이전트와 채팅을 통해 반복적인 수정 작업을 진행할 수 있으며, 설정이나 구성 관련 문제 발생 시에도 채팅 패널을 활용해 즉각 대응할 수 있다.
또한 피그마 캔버스와의 매끄러운 양방향 연동 기능도 강화됐다. 사용자는 메이크에서 제작한 화면이나 페이지, 구성 요소를 복사해 기존 피그마 디자인 캔버스에 레이어로 붙여넣고 팀원들과 자유롭게 의견을 공유하며 발전시킬 수 있다. 캔버스에서 발생한 디자인 변경 사항을 피그마가 스스로 감지해 이를 다시 메이크로 가져오도록 안내하며, 최종적으로 실제 코드에까지 반영되도록 돕는다.
개발자와의 효율적인 협업을 돕기 위해 실제 엔지니어링 팀이 사용하는 Git 워크플로우도 지원한다. 사용자는 디자인 작업과 함께 코드 분기 생성, 변경 사항 저장, 코드 검토 요청 등의 개발 작업을 캔버스 안에서 수행할 수 있으며, 엔지니어링 팀이 일반적인 풀 리퀘스트와 동일한 방식으로 변경 사항을 검토할 수 있다.
피그마 메이크의 직접 편집, 주석, 채팅, 코드 검토 요청 생성 기능은 28일부터 맥 사용자를 위한 베타 데스크톱 앱에서 제한된 베타 버전으로 제공된다. 베타 기간 동안에는 AI 크레딧이 차감되지 않는다. 얼리 액세스를 원하는 사용자는 대기자 명단에 등록할 수 있다.
피그마 관계자는 “이번 변화는 AI 에이전트가 더 많은 코드를 생성하고 디자인 판단의 중요성이 높아지는 환경에 맞춘 업데이트다”라고 설명하며 “작업이 시작되는 위치와 관계없이 사용자가 현재 단계에 가장 적합한 도구를 활용할 수 있는 시각적이고 협업 중심적인 제품 개발 워크플로우를 지속적으로 강화해 나갈 계획”이라고 설명했다.
뉴스콘텐츠는 저작권법 제7조 규정된 단서조항을 제외한 저작물로서 저작권법의 보호대상입니다. 본 기사를 개인블로그 및 홈페이지, 카페 등에 게재(링크)를 원하시는 분은 반드시 기사의 출처(로고)를 붙여주시기 바랍니다. 영리를 목적으로 하지 않더라도 출처 없이 본 기사를 재편집해 올린 해당 미디어에 대해서는 합법적인 절차(지적재산권법)에 따라 그 책임을 묻게 되며, 이에 따른 불이익은 책임지지 않습니다.
- 에디터김동욱 (jkkims@ditoday.com)
