피그마, 코드와 기획 문서를 캔버스로 가져오다

피그마가 디자인과 코드, 기획 문서와 실제 데이터를 연결하는 업데이트를 발표했습니다. 10월 15일 인도 벵갈루루에서 열린 ‘Config India 2026’에서 공개한 내용입니다. 주요 기능은 캔버스에서 코드를 실행하는 ‘코드 레이어’, 제품의 의도와 요구사항을 기록하는 ‘피그마 스펙스’, 데이터와 콘텐츠를 연결하는 ‘페이로드’ 통합입니다.

코드 레이어는 실제 코드로 작동하는 프로토타입을 디자인 옆에 배치합니다. 디자인 프레임을 변환하거나 깃허브 저장소를 가져와 만들 수 있습니다. 크롬 확장 프로그램으로 웹페이지의 코드를 캡처하거나, 빈 레이어에서 AI에 요청해 시작하는 방식도 지원합니다. 팀은 같은 캔버스에서 화면과 동작을 함께 확인할 수 있습니다.

피그마 스펙스는 디자인의 배경과 기술 요구사항을 함께 다루는 문서입니다. 디자인 옆에 문서를 놓고 여러 안을 비교하거나, 디자인을 바탕으로 기술 명세를 작성할 수 있습니다. 피그잼에서 나눈 피드백을 스펙스로 정리하는 기능도 제공합니다. 화면을 설명하는 글을 작업 공간 안에 두고, 팀원과 AI 에이전트가 함께 참고하도록 구성했습니다.

페이로드는 피그마 메이크와 코드 레이어에 데이터베이스, 콘텐츠 관리, 파일 저장, 로그인 기능 등을 연결합니다. 화면에 표시할 콘텐츠를 관리하고 데이터를 저장할 수 있어, 실제 데이터가 바뀌는 상황을 다룰 수 있습니다.

이번 업데이트의 특징은 시각 자료와 실행 가능한 코드, 설명 문서를 한 작업 공간에 배치한 구성입니다. 화면이 어떻게 보이는지와 어떻게 작동하는지, 왜 그렇게 만들었는지를 함께 검토하도록 연결했습니다. 코드 레이어와 스펙스는 공개 베타로, 페이로드 통합은 전체 요금제에 순차 제공됩니다.

더보기 및 출처

https://config.figma.com/india/
https://help.figma.com/hc/en-us/articles/43663368947863-What-s-new-from-Config-India-2026

박종민
프리랜서에서 유니콘급 스타트업 헤드 오브 디자인까지. 18년 넘게 브랜드와 프로덕트를 디자인하며 임팩트를 만들어 왔습니다. 현재는 디자인 나침반 CEO이자 편집장으로서 비즈니스 임팩트를 내는 디자인을 연구하고 있습니다.

디자인 나침반 뉴스레터

최근 소식