Figma의 새로운 기능: 키 관리, 변형 및 JSON 내보내기

Smartcat Figma plugin의 에셋 번역(Asset translation) 모드가 대폭 업그레이드되었습니다. 이제 모든 텍스트 개체에 관리 가능한 키가 부여되고, 하나의 요소에 여러 콘텐츠 변형(variant)을 포함할 수 있으며, 전체 현지화 데이터를 개발자용 JSON 파일로 내보낼 수 있습니다. 이 모든 기능은 별도의 설정 없이 모든 사용자가 즉시 사용할 수 있습니다.

더욱 깔끔해진 개발팀 인수인계. 모든 텍스트 개체에 자동으로 키가 생성되며, 언제든지 이름을 변경할 수 있습니다. 즉, Figma 콘텐츠가 엔지니어링 팀이 코드에서 이미 사용 중인 키와 직접 매핑됩니다.

하나의 디자인, 다양한 콘텐츠 상태. 변형(Variant) 기능을 사용하면 단일 텍스트 개체가 하나의 요소 아래에 여러 콘텐츠(예: 빈 상태, 로딩 상태, 오류 상태)를 포함할 수 있으며, 각각 고유한 키를 갖습니다. 대체 문구를 보여주기 위해 레이어를 복제할 필요가 없습니다.

한 번의 내보내기로 디자인에서 코드까지. JSON 내보내기를 사용하면 완료된 현지화 작업이 모든 키, 소스 문자열, 번역 및 변형이 포함된 구조화된 파일로 변환되어 소프트웨어의 현지화 리소스에 바로 적용할 수 있습니다.

중복 문자열 감소. 플러그인에서 Smartcat 프로젝트를 생성할 때 동일한 키를 공유하는 세그먼트가 자동으로 병합됩니다. 따라서 디자인 전체에서 아무리 많이 반복되더라도 번역가는 각 문자열을 한 번만 보고 번역하게 됩니다.

내장된 충돌 감지 기능. 동일한 키가 두 개의 다른 텍스트에 연결되는 경우, 플러그인이 오류(Error) 탭에 즉시 표시하므로 번역가나 개발자에게 전달되기 전에 이름 충돌을 잡아낼 수 있습니다.

1. Keys and Variants 탭을 엽니다. 파일의 모든 텍스트 개체가 해당 키와 함께 여기에 나열됩니다. 키는 자동으로 생성되며, 원하는 개체에 대해 수동으로 설정할 수도 있습니다.

2. 필요한 곳에 변형을 추가합니다. 텍스트 개체를 선택하고 + Add variant를 클릭하여 대체 콘텐츠를 첨부합니다. 각 변형에는 자동으로 생성된(또는 수동으로 지정한) 고유한 키가 부여되며, 변형 간에 전환하여 Figma 캔버스에서 직접 각각을 미리 볼 수 있습니다.

3. 키 충돌 해결하기. 두 개의 다른 텍스트 콘텐츠가 동일한 키를 공유하는 경우, 플러그인의 Error 탭에 해당 내용이 표시됩니다. 텍스트를 동일하게 만들거나 키 중 하나를 변경하여 문제를 해결할 수 있으며, 일치하는 모든 인스턴스에 변경 사항을 한 번에 적용할 수 있습니다.

4. 콘텐츠의 번역 가능 여부 표시하기. 텍스트 개체를 번역 불가로 전환할 수 있습니다. 이 경우 Keys and Variants 탭에는 계속 표시되지만, 새로운 Untranslatable 탭에 별도로 수집됩니다.

5. Smartcat 프로젝트 생성하기. 플러그인에서 바로 번역을 시작하세요. 동일한 키를 가진 세그먼트는 자동으로 병합되며, 변형(variant)의 세그먼트에 초점을 맞추면 Figma 미리보기에 해당 변형이 정확히 표시되므로 번역된 변형을 검토하는 것이 소스를 검토하는 것만큼 쉽습니다.

번역은 캔버스나 번역 목록에서 직접 편집할 수도 있습니다. 수동으로 편집한 번역은 Translate instantly를 실행해도 덮어쓰이지 않지만, 콘텐츠가 Smartcat과 동기화될 때는 업데이트될 수 있습니다.

6. JSON으로 내보내기. 번역이 완료되면 Export JSON을 클릭하여 모든 개체의 Figma 노드 ID, 키, 소스 텍스트, 언어별 번역 및 모든 변형이 나열된 파일을 다운로드하여 엔지니어링 팀에 전달할 수 있습니다.

Figma에서 Smartcat 플러그인을 열고 Asset translation mode로 전환합니다.

새로운 Keys and Variants 탭은 기존 탭과 나란히 위치하며, 동일한 패널에서 Untranslatable 및 Export JSON을 사용할 수 있습니다.

Software localization mode에서 작업하는 경우, 이름이 변경된 두 개의 탭에 유의하세요. Text objects는 이제 Keys로, Hidden은 Untranslatable로 변경되었습니다. 워크플로우 자체는 변경되지 않았으며, 해당 모드에서는 변형(variants)이 지원되지 않습니다.

이 기능은 다국어 인터페이스를 출시하는 디자인 및 제품 팀과 그 결과물을 사용하는 개발자를 위해 제작되었습니다. 디자이너는 파일을 복잡하게 만들지 않고 반복 및 상태 기반 콘텐츠를 관리할 수 있는 더 깔끔한 방법을 얻고, 현지화 팀은 번역할 중복 문자열이 줄어들며, 엔지니어는 Figma 카피와 현지화 키를 수동으로 대조하는 대신 완성된 JSON 리소스 파일을 받을 수 있습니다.