Unity SVG 가져오기: UI Toolkit과 스프라이트용 도안 준비
편집기 버전과 사용 대상에 맞는 Unity SVG 가져오기 경로를 선택하세요. 경로와 미지원 효과를 준비하고 실제 맥락에서 UI Toolkit 이미지나 스프라이트를 확인합니다.
목차
Unity SVG 가져오기는 두 가지 결정에서 시작합니다. 사용 중인 편집기 버전과 도안이 표시될 위치입니다. Unity 6.3은 UI Toolkit과 Texture2D용 SVG 가져오기를 포함합니다. SVG를 Sprite나 uGUI 자산으로 직접 가져올 때는 Vector Graphics 패키지를 사용하며, 이전 편집기는 이전 패키지 계열을 사용합니다. Unity의 Vector Graphics 버전 안내가 이 구분을 설명합니다.
이미 편집 가능한 SVG가 있다면 가져오기 도구에 맞게 준비하세요. PNG나 JPG만 있다면 벡터 도형이 필요할 때만 추적하세요. 텍스처나 픽셀 아트 스프라이트는 래스터로 유지할 수 있습니다.
전체 세트를 처리하기 전에 대표 아이콘 하나를 시험해 원본 도안 문제와 Unity 가져오기 및 표시 문제를 구분하세요.
다른 엔진의 장면 형상에는 Unreal Engine SVG 가져오기 확인 사항을 사용해 Motion Design 원본 도형, 구멍과 별도 조각을 확인하세요.
도안 편집 전에 가져오기 경로 선택하기
대상 컴포넌트로 경로를 선택하세요. UI Toolkit 레이아웃에서 동작하는 자산이 자동으로 Sprite Renderer 필드에 적합한 것은 아닙니다.
| Unity 편집기 | 대상 | 시작 경로 |
|---|---|---|
| 6.3 이상 | UI Toolkit | UI Toolkit 벡터 이미지로 기본 SVG 가져오기 |
| 6.3 이상 | Texture2D를 사용하는 대상 | 텍스처로 기본 SVG 가져오기 |
| 6.3 이상 | Sprite Renderer 또는 uGUI SVGImage | Vector Graphics 3.0 프리뷰 패키지 |
| 6.3 이전 | 패키지 기반 SVG 작업 방식 | 호환되는 Vector Graphics 2.0 프리뷰 패키지 |
표는 Unity 패키지 요구 사항을 따릅니다. 프로젝트에서 사용하는 편집기와 패키지 버전을 고정하세요. Unity 2018이나 2.0 프리뷰 가져오기 안내는 현재 6.3 프로젝트와 다른 옵션을 설명할 수 있습니다.
도안 옆에 작은 가져오기 시험을 보관하세요
곡선, 내부 구멍과 세트에 필요한 색상 효과를 가진 아이콘을 선택하세요. 원본 SVG를 단색 도형으로 만든 단순한 버전 옆에 보관하세요. 단순한 버전이 올바르게 가져와지면 전체 프로젝트를 바꾸기 전에 복잡한 도안을 조사하세요.
가져오기 도구가 재현할 수 있는 SVG 준비하기
벡터 편집기에서 원본을 열어 실제 객체를 확인하세요. 원본을 보존하고 별도 Unity 전달 파일을 내보내세요.
도안에 경로가 있는지 확인하기
SVG는 <image> 요소로 비트맵을 담을 수 있습니다. 확장자만으로 도안이 벡터 형상이라고 판단할 수 없습니다. W3C 내장 콘텐츠 사양이 그 차이를 설명합니다. 편집기에서 도안 일부를 선택해 객체나 마크업을 확인하세요. 하나의 이미지 사각형이라면 내장 래스터 진단을 사용하세요.
원본 벡터 파일이 있다면 다시 내보내세요. 원본에서 내보낸 PNG를 추적하면 재구성 작업이 늘어나고 실루엣이 달라질 수 있습니다. 아이콘 계열은 먼저 캔버스, 여백과 시각적 두께에 합의하세요. UI 키트 SVG 준비 안내가 세트 단위 결정을 다룹니다.
미지원 기능을 의도적으로 대체하기
Unity 기본 가져오기 도구는 SVG 1.1의 일부를 지원합니다. 문서의 제외 항목에는 편집 가능한 텍스트, 픽셀 마스크, 필터, 상호작용과 애니메이션이 있습니다. 따라서 브라우저 미리보기는 올바르지만 Unity 결과는 다를 수 있습니다. Unity의 SVG 제한을 참고하세요.
도안 요구에 맞게 전달 사본을 준비하세요.
- 장식 글자를 외곽선으로 변환하세요. 편집이나 현지화가 필요한 인터페이스 라벨은 인터페이스 안의 텍스트로 유지하세요.
- 필요한 그림자나 발광을 대상에서 지원하는 효과로 다시 만들거나 도안을 래스터로 유지하세요.
- 마스크와 클리핑 경로를 따로 확인하세요. 부드러운 픽셀 마스크와 기하학적 클리핑은 다른 구조입니다.
- SVG에 내장된 애니메이션에 의존하지 말고 Unity에서 애니메이션을 계획하세요.
필터가 미지원이라는 이유만으로 모든 그라디언트를 평면화하지 마세요. 디자인에 실제로 사용한 효과를 시험하세요. 복잡한 배지가 실패하면 단색 채우기 버전을 내보내고 효과를 하나씩 다시 추가하세요. 모습을 바꾸는 기능을 분리할 수 있습니다.
우연히 생긴 복잡성 제거하기
아이콘에 속하지 않는 작은 점, 숨긴 중복과 배경 사각형을 삭제하세요. 눈에 띄게 불규칙한 곡선은 원본과 비교하면서만 단순화하세요. 정리 중 작은 구멍이 닫히면 파일이 짧아져도 실패한 편집입니다.
모든 게임 도안에 유용한 보편적 노드 목표는 없습니다. 기하학적 화살표와 손으로 그린 캐릭터는 필요한 세부 수준이 다릅니다. SVG 노드 정리 안내는 어떤 점이 형태 정보를 담는지 결정하는 데 도움을 줍니다.
Unity 6.3 이상에서 UI Toolkit으로 가져오기
실루엣과 효과를 이미 검토한 전달 SVG로 시작하세요.
- 프로젝트의 Assets 폴더에 SVG를 추가하고 선택하세요.
- Inspector에서 Generated Asset Type을 UI Toolkit Vector Image로 설정하세요.
- 가져오기 설정을 적용하고 결과 벡터 이미지를 사용할 UI Toolkit 요소에 넣으세요.
- 실제 레이아웃을 사용할 최소 및 최대 표시 크기로 미리 보세요.
Unity는 벡터 그래픽 작업에서 기본 자산 선택을 설명합니다. 사용 대상이 Texture2D를 요구하면 해당 출력을 선택하고 목표 크기에서 결과 텍스처를 검토하세요.
UI Toolkit에는 권장 기본 테셀레이션 설정으로 시작하세요. Target Resolution과 Zoom Factor는 목표 표시 조건에 맞춰 가져오기 도구가 곡선 분할을 설정하게 합니다. Unity는 만족스러운 결과를 제공하는 가장 낮은 목표 해상도를 권장합니다. 이미지 가져오기 설정이 제어를 설명합니다.
두 검토를 구분하세요. SVG가 올바른 형상을 나타내는지와 가져온 자산이 그 형상을 잘 표시하는지입니다. 테셀레이션을 늘려도 원본 내보내기에서 사라진 구멍을 복원할 수는 없습니다.
Sprite Renderer 또는 uGUI용 가져오기
대상에 Sprite나 uGUI 지원이 필요하면 Package Manager로 호환되는 com.unity.vectorgraphics 패키지를 설치하세요. 컴포넌트에 맞는 생성 자산을 선택하고 받아들이는지 확인하세요. 패키지의 현재 문서는 이런 가져오기 유형을 기본 UI Toolkit 경로와 구분합니다.
Sprite Renderer에는 프리팹으로 복사하기 전에 객체의 장면 크기와 회전축을 확인하세요. uGUI에는 프로젝트가 사용하는 SVGImage 방식을 확인하세요. 필요한 치수에서 이미 도안이 올바르게 보인다면 일반 래스터 스프라이트 작업도 대안입니다.
이전 2.0 패키지는 장면 단위당 SVG 단위, 스프라이트 회전축과 테셀레이션 제어를 설명합니다. 패키지를 실험적이라고 명시하고 운영 사용을 권하지도 않습니다. 해당 경로를 유지하는 팀은 추가 전에 프로젝트 제약과 함께 2.0 패키지 설명서를 검토하세요.
기존 프로젝트를 업그레이드한다면 사본이나 버전 관리 브랜치에서 가져오기를 시험하세요. 실제 프리팹과 장면에서 생성 자산 유형과 참조를 비교하세요. 썸네일 미리보기 성공만으로 마이그레이션을 시험하지 말고 특정 문제를 재현하지 않은 채 오래된 포럼 글의 일괄 .meta 수정을 적용하지 마세요.
처음 보이는 차이 진단하기
각 대표 자산에 짧은 시험 기록을 사용하세요. 원본 파일, 편집기 및 패키지 버전, 대상 컴포넌트, 예상 표시 크기와 처음 보이는 불일치입니다.
| 보이는 증상 | 처음 확인할 것 | 유용한 다음 시험 |
|---|---|---|
| 자산을 컴포넌트 필드에 넣을 수 없음 | 생성 자산 유형과 대상 | 실제 사용하는 컴포넌트용으로 가져오기 |
| 글자, 그림자나 움직임 누락 | 미지원 원본 기능 | 외곽선 또는 단색 도형 내보내기 시험 |
| 추가 여백이나 가장자리 잘림 | 원본 캔버스와 요소 크기 | 원본 경계와 대상 사각형 비교 |
| 큰 크기에서 곡선이 각져 보임 | 테셀레이션과 표시 배율 | 목표 해상도나 확대 설정을 점진적으로 증가 |
| 확대 시 텍스처가 흐림 | 래스터 치수와 표시 크기 | 생성 목적 크기에서 비교 |
| 결과는 맞지만 기존 장면 손상 | 참조, 재질과 가져오기 변경 | 일괄 재가져오기 전에 영향받은 프리팹 하나 시험 |
예를 들어 별 배지가 가져와지지만 중심 구멍이 사라진다고 가정해 보세요. 먼저 전달 SVG를 열어 구멍이 있는지 확인하세요. 있다면 Unity에서 단순화한 배지 내보내기와 비교하세요. 해당 버전에서 구멍이 유지되면 원래 배지의 겹친 도형, 채우기 구성이나 마스크를 확인하세요. 원본 재추적은 경로 형상 자체가 잘못됐을 때만 유용합니다.
채택한 자산은 편집기뿐 아니라 대상 빌드에서도 시험하세요. 가장 작은 크기에서 읽을 수 있는지, 색상과 투명도가 일치하는지, 새로 가져온 후 장면이나 프리팹 참조가 유지되는지 기록하세요. 성능 결정에는 자신의 장면을 프로파일링해야 합니다. SVG 확장자는 성능 측정이 아닙니다.
PerfectVector에서는 어떻게 하나요?
적절한 원본이 래스터뿐이고 편집 가능한 도형이 필요할 때 PerfectVector는 Unity 가져오기 전 단계에 적합합니다. 평면 색상의 PNG나 JPG 하나를 PerfectVector 이미지-벡터 변환기에 업로드하고 추적한 실루엣과 구멍을 원본과 비교하세요. 다운로드한 SVG를 벡터 편집기에서 확인한 뒤 Unity로 가져오세요.
전체 전달 과정에서 같은 대표 아이콘을 사용하세요. 원하는 영역을 편집할 수 있고 빈 공간이 열려 있으며 정리로 형태가 왜곡되지 않았을 때만 추적 결과를 채택하세요. 그런 다음 위 Unity 대상 시험을 적용하세요.
원하는 모습을 보존한다면 사진, 텍스처, 부드러운 발광이나 의도적인 픽셀 아트 스프라이트는 래스터로 유지하세요. 단순한 기하학적 심볼은 수동 그리기가 추적보다 제어하기 쉬울 수 있습니다. PerfectVector는 SVG 원본 형상을 준비하며 Unity 지원 기능을 바꾸거나 런타임 렌더링을 검증하지 않습니다. 형식 차이가 익숙하지 않다면 SVG 파일의 내용부터 참고하세요.
FAQ
Unity 6에는 Vector Graphics 패키지가 필요한가요? 마이너 버전과 사용 대상에 따라 다릅니다. Unity 6.3에는 기본 UI Toolkit 및 Texture2D SVG 가져오기가 있습니다. Sprite와 uGUI 가져오기는 3.0 프리뷰 패키지를 사용합니다. 이전 Unity 버전은 호환되는 2.0 프리뷰 패키지 경로를 사용합니다.
PNG 확장자를 SVG로 바꾸면 벡터 스프라이트가 되나요? 아닙니다. 이름 변경은 픽셀을 추적하지 않습니다. 원본 벡터를 사용하거나 도형을 그리거나 적절한 래스터를 추적하고 결과 경로를 확인한 뒤 Unity로 가져오세요.
Unity가 잘못 가져오는 SVG를 추적으로 고칠 수 있나요? 원본 형상을 다시 만들어야 할 때만 가능합니다. 올바른 경로가 있지만 잘못된 생성 자산 유형이나 미지원 효과가 문제라면 해당 가져오기 또는 내보내기 결정부터 고치세요.
Sources
- Unity — Vector Graphics 3.0 패키지 안내 — 편집기 버전 구분과 기본 및 Sprite/uGUI 패키지 경로.
- Unity — 벡터 그래픽 작업 — 기본 자산 선택과 미지원 SVG 기능.
- Unity — 이미지 가져오기 설정 — UI Toolkit 벡터 이미지 설정과 테셀레이션 제어.
- Unity — Vector Graphics 2.0 패키지 설명서 — 이전 가져오기 도구, 장면 단위 및 회전축 제어와 실험적 상태.
- W3C — SVG 내장 콘텐츠 — SVG가 래스터 이미지 콘텐츠를 포함할 수 있음을 설명.
Unity 자산이 평면 PNG나 JPG에서 시작하고 편집 가능한 경로가 필요하다면 PerfectVector로 이미지를 변환하세요. 실루엣, 구멍과 불필요한 배경 도형을 확인한 뒤 출시할 Unity 컴포넌트와 표시 크기에서 SVG를 시험하세요.
