피그마 PDF를 내보낼 때 가장 큰 문제는 텍스트가 벡터로 변환되어 수정이 불가능하다는 점입니다. PDF를 Illustrator로 열어도 텍스트가 살아있지 않아서 다시 작업해야 하는 번거로움이 있습니다.
하지만! SVG를 활용하면 텍스트 속성을 유지한 채 PDF로 변환할 수 있습니다. 이 방법을 활용하면 PDF에서도 텍스트를 선택하고 복사할 수 있습니다.
오늘은 Figma에서 편집 가능한 PDF를 만드는 방법을 소개하겠습니다.
피그마 PDF 내보내기 시 발생하는 문제와 해결법
Figma에서 직접 PDF를 내보내면 다음과 같은 문제가 발생합니다.
✅ 텍스트가 벡터로 변환됨 (선택 및 편집 불가)
✅ 파일 크기 최적화가 안됨
✅ 이미지 품질이 저하될 수 있음
즉, PDF로 내보낸 후 Illustrator에서 수정하려고 해도 텍스트가 깨져서 재작업이 필요합니다.
👉 해결책? SVG를 거쳐 PDF로 변환하면 텍스트 속성을 유지할 수 있습니다!
피그마에서 편집 가능한 PDF로 내보내는 방법
1. 피그마에서 텍스트와 이미지를 분리하기
- 수정 가능한 텍스트를 포함한 디자인을 준비합니다.
- 텍스트와 이미지를 별도로 분리합니다.
- 텍스트만 있는 대지를 하나 만들고,
- 이미지만 있는 대지를 따로 만듭니다.
- 그룹이 있다면 해제합니다.
- Figma에서 그룹이 Illustrator에서는 클리핑 마스크로 변환되므로 해제하는 것이 좋습니다.
2. SVG로 내보내기 (Outline Text 해제 필수!)
- Figma의 “Export” 옵션에서 SVG를 선택합니다.
- “Outline Text” 옵션을 해제합니다.
- 이 옵션을 해제해야만 텍스트 속성이 유지됩니다.
- SVG 파일로 저장합니다.
3. Illustrator에서 SVG를 열고 PDF로 저장
- Illustrator에서 방금 내보낸 SVG 파일을 엽니다.
- 텍스트 속성이 유지된 것을 확인합니다.
- 필요하면 텍스트 수정 후 PDF로 저장합니다.
이제, 텍스트가 선택 가능한 PDF 완성!
이 방법의 장점과 한계점
장점
✔️ PDF에서 텍스트 선택 & 복사 가능
✔️ Illustrator에서 재작업 필요 없음
✔️ 포트폴리오, 이력서 제작 시 유용
한계점
❌ 텍스트가 한 줄씩 개별 박스로 인식됨
❌ 이미지와 텍스트를 별도로 합쳐야 함
따라서, 최종 수정 단계에서 활용하면 가장 효과적입니다. 전체적인 레이아웃이 완성된 후 최종 오타 체크나 디테일 조정용으로 사용하는 것이 좋아요!
피그마에서 PSD 파일로 변환할 때도 유용!
이 방법은 PDF로 내보낼 때만 유용한 게 아닙니다.
국내에서는 아직도 디자인 원본을 PSD(포토샵 파일)로 요구하는 곳이 많습니다. 그래서 디자이너들이 Figma에서 PSD로 저장하는 방법을 자주 찾곤 하죠.
하지만, 웹사이트나 플러그인을 통해 PSD로 변환해 보면…
❌ 텍스트가 깨지거나
❌ 레이어가 뒤죽박죽되어 쓸 수 없는 경우가 많습니다 (경험담)
특히 일부 텍스트를 SVG로 내보내도, Illustrator에서 열어보면 글자가 유실되는 경우가 생깁니다.
이럴 때 이 방법을 사용하면?
✔️ 폰트 서체를 유지하면서 텍스트가 사라지지 않음
✔️ Illustrator에서 편집 가능한 상태로 유지
✔️ 포토샵에서도 문제없이 불러올 수 있음
대부분 포토샵을 구독하는 기업은 Illustrator도 함께 사용하므로, PSD 변환이 필요할 때도 SVG 방식을 활용하면 안정적입니다.
포토샵에서 고급 객체로 SVG 불러오기
- Photoshop에서 SVG 파일을 고급 객체(Smart Object)로 불러옵니다.
- 더블 클릭하면 Illustrator에서 열리고, 여기서 텍스트를 편집할 수 있습니다.
이 방법을 사용하면 PSD 변환 시에도 텍스트 손실 없이 유지할 수 있습니다!
참고: Photopea (PSD 변환 가능 온라인 툴)결론
솔직히 피그마 PDF 내보내기 기능이 제대로 지원되면 이런 번거로운 작업을 안 해도 되겠죠? 하지만 지금으로서는 이 방법이 가장 현실적인 해결책입니다. 저도 재작업 시간을 줄일 수 있었던 꿀팁이었어요. 필요한 분들은 꼭 활용해보세요!
출처
관련 글