스프레드시트에 이미지 URL 넣기

스프레드시트에서 텍스트를 동기화할 때와 같은 이름 지정 방식으로, 외부 URL(또는 로컬 .zip 파일)의 이미지를 Figma 레이어의 이미지 채우기로 동기화할 수 있어요.

스프레드시트의 이미지를 텍스트가 아닌 Figma 레이어에 넣으려면 http:// 또는 https://로 시작하는 이미지 URL을 붙여 넣으세요(인라인 <svg></svg> HTML 태그도 사용할 수 있어요). CopyDoc 플러그인은 이 값을 자동으로 이미지로 인식해요. 이미지 열의 헤더 이름은 Figma 이미지 레이어 이름과 같게 지정하세요(예: #Poster).

#Poster
https://i.redd.it/3fl2s0q1ug661.jpg
https://i.redd.it/3fl2s0q1ug661.jpg
https://i.redd.it/3fl2s0q1ug661.jpg

유료 Figma 플랜에서는 동영상 파일도 지원돼요. Figma의 기본 동영상 지원에 관한 Figma 문서에 따라, 유료 Figma 플랜(Education, Professional, Organization, Enterprise 팀)에 속한 Figma 파일에서 CopyDoc을 실행하면 위의 이미지 동기화 예시와 같은 방식으로 동영상도 동기화할 수 있어요. 동영상 파일은 최대 100mb까지, .mp4, .mov, .webm 형식을 지원해요.

XLSX 가져오기로 내 컴퓨터의 로컬 이미지 파일 동기화 ​

영상 튜토리얼: 스프레드시트로 이미지 폴더를 Figma 레이어에 동기화

이 영상에서는 CopyDoc 플러그인으로 스프레드시트를 사용해 이미지 폴더를 Figma 레이어와 동기화하는 방법을 보여 줘요.

영상 튜토리얼: 스프레드시트의 SVG 아이콘을 Figma 레이어에 동기화

이 영상에서는 CopyDoc 플러그인으로 스프레드시트의 SVG 아이콘을 Figma 레이어에 동기화하는 방법을 보여 줘요.

온라인 이미지 URL 대신 내 컴퓨터에 이미 저장된 이미지를 사용하고 싶다면, 이미지와 XLSX 파일을 함께 ZIP으로 압축하면 돼요.

도움이 필요하면 위의 단계별 영상 튜토리얼에서 XLSX 스프레드시트로 이미지 폴더를 Figma 레이어에 동기화하는 방법을 확인하세요.

특수 문자가 들어간 이미지 파일의 ZIP 인코딩. “æøå” 같은 문자가 들어간 로컬 이미지 파일(예: Læge.png)을 압축한다면 ZIP 파일의 인코딩이 올바른지 확인하세요. 그렇지 않으면 이런 문자가 자동으로 제거되거나 바뀌어, 스프레드시트에 적은 파일 이름과 일치하지 않게 돼요. Mac에서는 마우스 오른쪽 버튼 클릭 -> “압축”을 사용하면 되고, Windows에서는 WinRAR 앱으로 올바르게 압축할 수 있어요.

로컬 ZIP 파일 최대 크기 2gb. 브라우저는 탭당 메모리 한도가 2gb(기가바이트)이고 Figma 앱과 브라우저 버전 모두 이 한도를 따르기 때문에, 콘텐츠 동기화를 위해 CopyDoc에 끌어다 놓는 로컬 이미지 .zip 파일은 2gb(기가바이트) 미만이어야 해요. 그렇지 않으면 플러그인에서 파일 압축을 풀 때 메모리 한도를 넘어 콘텐츠가 로드되지 않아요.

스프레드시트 행으로 Figma 레이어 하나를 자동 반복하기 ​

Content 또는 Styles 동기화 탭 옵션을 사용할 때 Auto Repeat 토글을 켜면 Figma 레이어 하나를 자동으로 반복할 수 있어요. 처음 선택한 Figma 레이어를 스프레드시트 데이터의 행 수만큼 자동으로 복제해요.

이 기능으로 카드, 카탈로그 항목, 캠페인 레이아웃 하나를 스프레드시트 행마다 콘텐츠가 채워진 디자인으로 만들 수 있어요. 디자인 안의 텍스트 레이어와 이미지 레이어에는 일치하는 스프레드시트 열의 값이 들어가요.

메인 컴포넌트를 선택하면 CopyDoc이 행마다 인스턴스를 만들어요. 기존 인스턴스를 선택하면 그 인스턴스를 복제하고, 프레임을 선택하면 프레임을 복제해요.

선택한 Figma 레이어가 이미 Auto Layout이 켜진 다른 Figma 레이어 바로 안에 있다면, 선택한 레이어가 그 부모 레이어 안에서 자동으로 복제돼요. 그렇지 않으면 CopyDoc이 완전히 새로운 Auto Layout 프레임을 만들고 그 안에 새 Figma 레이어를 복제해요.

자동 반복되는 부모 레이어의 동적 이름 ​

복제된 각 Figma 레이어의 이름을 스프레드시트에서 가져오려면 선택한 템플릿 레이어의 이름을 열 머리글과 맞추세요. CopyDoc은 각 행에서 해당 열의 값을 새 레이어 이름으로 사용해요.

맨 앞의 # 하나는 있어도 되고 없어도 돼요. #Title이라는 레이어는 Title 열과 일치할 수 있고, Title이라는 레이어는 #Title 열과 일치할 수 있어요. 두 머리글이 모두 있으면 값이 비어 있더라도 정확히 일치하는 쪽이 우선해요. 대소문자와 공백은 여전히 일치해야 해요.

스프레드시트에 일치하는 레이어 이름이 없으면 CopyDoc 플러그인은 원래 Figma 레이어 이름에 행 번호를 붙여 사용해요(예: My Frame Layer (Row 3)).