Figma Variables · 8개 언어
디자인 속 문구, 이제 코드처럼 관리하세요.
Figma Variables에 연결된 문구를 언어별로 번역하고 검수합니다. 확정된 값은 Figma와 코드에 그대로 반영됩니다.
언어가 하나 늘 때마다, 관리할 곳도 하나 늘어납니다.
-
번역이 흩어져 있습니다
Figma, 스프레드시트, 메신저. 필요한 문구 하나를 찾는 데도 세 곳을 뒤져야 합니다.
-
어느 것이 최신인지 모릅니다
원문과 번역이 서로 다른 시점에 수정됩니다. 디자인의 문구와 번역 문서의 문구가 조용히 달라집니다.
-
수정 하나가 일 다섯 개가 됩니다
원문 한 줄이 바뀌면 번역할 언어를 확인하고, 화면마다 반영하고, 개발팀에 다시 전달해야 합니다.
디자인과 번역이 같은 데이터에서 시작합니다.
- 01
그대로 가져오기
번역 문서를 새로 만들 필요가 없습니다. 기존 Variable 구조와 값은 물론, 스코프·설명 같은 메타데이터까지 그대로 불러옵니다.
- 02
언어별로 나란히
원문과 번역문을 한 화면에서 비교하고, 필요한 언어를 추가해 관리합니다.
- 03
상태가 보이게
누가 어떤 값을 수정했는지, 번역이 어느 단계인지 기록으로 남습니다.
- 04
확정한 값만 내보내기
검수를 마친 문구만 Figma에 반영하고, 개발에 필요한 형식으로 내보냅니다.
- 05
코드로 내보내기
웹에서 바로 붙여 쓰는 CSS · SwiftUI · Jetpack Compose 코드를 생성하고, DTCG · JSON · CSV와 read-only API · AI 도구용 MCP까지. 락인 없이 토큰은 당신의 것.
- 06
토큰 셋 하나, 여러 프로젝트
디자인 시스템은 라이브러리 프로젝트에 둡니다. 변경을 발행하면 제품 프로젝트마다 업데이트 함에서 확인하고, 원하는 것만 적용합니다.
- 07
번역가마다 담당 언어
시트를 만들 때 번역가를 넣고 각자 편집할 언어를 고릅니다. 다른 언어는 참고용으로 보이되 잠겨 있습니다. 번역가는 언제나 무료입니다.
실시간 협업
지금 누가 어떤 문구를 고치고 있는지 보입니다
수정 중인 값과 담당자가 표시됩니다. 같은 문구를 동시에 고치거나, 끝난 작업을 다시 하는 일이 줄어듭니다.
- 공유 커서와 커서챗 — 작업하는 자리에서 바로 대화
- 역할 기반 접근 — 디자이너·편집자·번역가가 알맞은 범위만
- 셀마다 댓글 스레드 — 논의를 그 자리에서 해결
토큰 구조를 한눈에
값 하나가 어디까지 영향을 주는지 따라갑니다
Reference된 Variable과 연결 구조를 보여줍니다. 하나를 바꾸면 어떤 문구와 화면이 함께 바뀌는지 미리 확인할 수 있습니다.
- 원시값 → semantic 참조를 시각적으로 배치
- 토큰을 클릭하면 '바꾸면 N개 영향' — 영향 렌즈로 바꾸기 전에 번질 범위를 확인
- 토큰 맵 — 프로젝트 전체를 묶음으로 보고, 검색과 타입·태그 필터로 좁히기
- '스코프' · 'Figma에 없음'으로 색을 입히고, 태그 색은 토큰 옆에 점으로 표시 — 상태를 한눈에
AI가 초안, 내가 검수
번역하고, 확인하고, 확정합니다
AI가 번역 초안을 만들고, 사람이 원문과 비교해 다듬습니다. 검수를 통과한 문구만 확정됩니다.
- 받아들이거나 고치거나 되돌릴 수 있는 AI 초안
- 내 교정을 다음 번역에 기억하는 용어집
- 파일에 닿기 전에 검수하고 승인
개발자 핸드오프를 위해
디자인과 코드가 같은 문구를 씁니다
확정한 값을 DTCG · JSON · CSV로 내보내거나, CSS · SwiftUI · Jetpack Compose 코드로 생성합니다. 디자인과 개발이 서로 다른 번역본을 쓰는 일이 사라집니다.
- CSS · SwiftUI · Jetpack Compose — 결정론적, 바로 붙여 쓰기
- CI 파이프라인에서 read-only API로 최신 토큰을 가져오기
- AI 코딩 도구가 토큰을 코드로 받아가는 MCP 서버
구조를 바꿔도 연결은 그대로
이름을 바꾸고 변수를 옮겨도 연결은 남습니다
변수·그룹·컬렉션 이름을 바꾸면 그것을 참조하는 alias가 프로젝트 전체에서 함께 바뀝니다. 토큰을 정리하다가 참조가 끊기거나 Figma 연결이 풀리는 일이 사라집니다.
- 이름 변경 — 변수·그룹·컬렉션 어느 쪽이든, 참조하는 alias가 자동으로 따라옴
- 다른 컬렉션으로 이동 — 게시하지 않은 컬렉션이면 다음 Sync에서 이 파일의 Figma 레이어를 옮긴 변수에 다시 연결
- 참조 대상 삭제 — Figma처럼 마지막 값이 남고 되돌릴 수 있음 · 순환 참조는 처음부터 차단
세 단계면 충분합니다.
- 1
Figma 연결
Figma 파일을 연결하면 사용 중인 Variables와 값을 가져옵니다.
- 2
번역과 검수
관리할 언어를 추가하고 번역합니다. 원문과 비교해 확인한 뒤 확정합니다.
- 3
Figma와 코드에 반영
확정한 값을 Figma에 적용하고, 개발 환경에서 쓸 수 있는 형식으로 내보냅니다.
토큰보다 중요한 건, 토큰이 바뀌는 과정입니다.
문구는 한 번 등록하고 끝나는 값이 아닙니다. 원문이 바뀌면 번역을 다시 봐야 하고, 확정된 내용은 디자인과 코드에 함께 반영되어야 합니다. variable Jar는 이 과정을 기록으로 잇습니다 — 누가 수정했는지, 어떤 언어가 검수를 마쳤는지, 어떤 속성에 쓰는 값인지, 마지막으로 어디에 반영됐는지까지.
- 붙인 게 아니라 내장된 번역 워크플로
- 우리 제품의 언어를 학습하는 용어집
- 번역가는 무료로, 맥락과 함께 참여
- 값만이 아니라 스코프·설명까지 왕복하는 동기화
- 조용히 덮어쓰지 않는 동기화 — 충돌은 멈추고 행마다 고름
자주 묻는 질문
Figma의 어떤 Variable을 가져올 수 있나요?
문자열·색상·숫자·불리언 네 타입을 모두 가져옵니다. alias(참조)와 모드도 그대로 지원해, 다국어 문구뿐 아니라 색·간격 토큰까지 한 프로젝트에서 관리합니다.
기존 Variable 구조를 바꿔야 하나요?
아니요. 지금 사용 중인 구조와 값을 그대로 가져와 시작합니다. 따로 지켜야 할 이름 규칙은 없고, 이름의 '/'로 나뉜 그룹도 그대로 읽습니다.
AI 번역을 꼭 사용해야 하나요?
아니요. 직접 입력하고 수정할 수 있습니다. AI 번역은 초안을 만드는 기능이고, 검수와 확정은 항상 사용자가 합니다.
원문이 바뀌면 어떻게 알 수 있나요?
원문이 수정되면 다시 확인이 필요한 언어를 표시합니다. 변경 내용을 확인하고 번역을 수정한 뒤 다시 확정하면 됩니다.
여러 사람이 함께 작업할 수 있나요?
네. 워크스페이스에 팀원을 초대하면 작업 중인 값, 담당자, 번역 상태를 함께 봅니다. 역할은 소유자·팀 멤버·편집자·번역가 네 가지이고, 번역가 좌석은 무료입니다.
개발 환경에서는 어떻게 사용하나요?
확정한 값을 DTCG · JSON · CSV로 내보내거나, 바로 붙여 쓰는 CSS · SwiftUI · Jetpack Compose 코드로 생성합니다. read-only API와 MCP 서버로 최신 토큰을 직접 가져갈 수도 있습니다.
Figma에 바로 반영할 수 있나요?
네. 플러그인의 동기화(Sync) 버튼 하나가 파일의 변수를 웹앱으로 보내고, 웹앱에서 바꾼 내용을 다시 파일에 적용합니다. 양쪽이 같은 변수를 고쳐 충돌하면 웹 그리드에서 행마다 어느 쪽을 쓸지 정합니다.
변수 이름을 바꾸거나 컬렉션을 옮기면 Figma 연결이 끊기나요?
아니요. 이름 변경은 Figma에도 이름 변경으로 전달되어 레이어 바인딩이 유지됩니다. 다른 컬렉션으로 옮긴 변수는 다음 Sync에서 이 파일의 레이어가 다시 연결되고, 연결하지 못한 것은 행에 표시됩니다. 어느 한쪽 컬렉션이 게시된 라이브러리면 이동은 적용되지 않고 거부됩니다. 그 변수를 참조하던 alias도 새 이름을 자동으로 따라갑니다.
지금 쓰고 있는 Figma Variables로 시작하세요.
번역 문서를 새로 만들기 전에, 디자인 안의 문구를 먼저 연결하세요. 번역부터 검수, Figma와 코드 반영까지 한 흐름으로 이어집니다.
variable Jar는 Figma Variables의 문구를 웹에서 번역·검수하고 Figma와 코드로 보내는 웹 앱이자 Figma 플러그인입니다. Google로 로그인하면 계정을 만드는 데 필요한 이름, 이메일 주소, 프로필 사진만 받습니다. 개인정보처리방침