개발자로 20년 가까이 일하면서, 코드와 디자인 사이의 간극은 언제나 골칫거리였다. 디자이너가 만든 시안을 개발자가 구현하고, 그 결과물이 다시 디자이너에게 돌아가면… 뭔가 달라져 있다. 이 무한 루프를 얼마나 많이 경험했던가.
Figma가 최근 발표한 “Claude Code to Figma” 기능은 이 오래된 문제에 대한 흥미로운 해답을 제시한다. 이미 운영 중인 프로덕션 코드를 분석해서 편집 가능한 Figma 디자인으로 변환해준다는 것이다.
역방향 워크플로우
기존의 워크플로우는 항상 디자인 → 코드였다. 하지만 현실에서는 코드가 먼저인 경우도 많다. 급하게 만든 MVP, 레거시 시스템 리디자인, 컴포넌트 라이브러리 문서화. 이런 상황에서 코드 → 디자인 변환은 엄청난 시간을 절약해줄 수 있다.
마흔 넘은 개발자의 감회
20년 전 내가 처음 웹 개발을 시작했을 때, 포토샵 PSD 파일을 받아서 테이블 태그로 슬라이싱했다. 그때에 비하면 지금은 완전히 다른 세상이다. AI가 코드를 읽고 디자인을 만들어내는 시대라니.
솔직히 말하면, 이런 도구들이 등장할 때마다 복잡한 감정이 든다. 편리함에 대한 기대와 함께, 어딘가 대체될 수 있다는 불안감. 하지만 결국 도구는 도구일 뿐이다. 중요한 것은 무엇을 만들 것인가, 왜 만들 것인가에 대한 답이다.
Claude Code to Figma가 얼마나 실용적일지는 직접 써봐야 알겠지만, 적어도 이 방향성만큼은 옳다고 생각한다. 개발자와 디자이너가 더 쉽게 협업할 수 있다면, 그것만으로도 가치가 있다.
이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.