PerfectVector
작성: Jay Lee7분 읽기

After Effects Auto-Trace: 마스크와 SVG 모양 레이어 선택

After Effects 로고에 맞는 Auto-Trace 마스크 또는 편집 가능한 SVG 모양 레이어를 선택하고, 추적 설정을 조정하며 색상 영역과 글자 내부를 확인하세요.

목차

After Effects Auto-Trace는 레이어의 알파, 색상 또는 휘도 채널을 마스크로 바꿉니다. 애니메이션에 그런 윤곽이 필요할 때 사용하세요. 다색 로고를 색이 각각 칠해진 아트로 재구성하지는 않습니다. Adobe의 Auto-Trace 문서는 결과를 베지어 마스크로 정의합니다.

로고 부분을 개별적으로 편집하려면 SVG를 고려하세요. 2026년 6월 17일 업데이트된 Adobe의 현재 SVG 가져오기 문서는 연결된 푸티지와 편집 가능한 모양 레이어를 포함한 컴포지션을 구분합니다. 중간 형식을 요구하는 오래된 조언은 설치된 버전과 맞지 않을 수 있습니다.

로고가 해야 할 일부터 정하세요

로고는 비트맵, 마스크를 씌운 단색 레이어, 채워진 도형 모음일 때 똑같아 보일 수 있습니다. 글자 하나를 움직이거나 한 부분의 색상을 바꾸려 하면 차이가 드러납니다.

애니메이션 목표시작 방법먼저 살펴볼 것
윤곽선이나 효과에 로고 윤곽 사용Auto-Trace 마스크선택한 채널이 의도한 경계를 분리하는지
개별 로고 영역 이동 또는 색상 변경모양 레이어 컴포지션으로 가져온 SVG영역, 내부 빈 공간, 배경이 유용하게 표현되는지
벡터 로고를 연결된 하나의 항목으로 변형SVG 푸티지레이어 하나로 장면에 필요한 제어가 가능한지
입자, 명암, 채색 질감 보존래스터 푸티지원본이 장면에 충분히 큰지
의도한 선 하나를 따라 장식 획 그리기직접 만든 경로의도한 그리기 방향을 경로가 따르는지

채워진 리본에는 양쪽 가장자리가 있습니다. 보이는 윤곽을 추적해도 펜이 가운데를 따라 그렸을 선 하나를 복원하지는 않습니다. 글씨를 쓰듯 나타나는 장식 획에는 채워진 아트의 모든 가장자리를 애니메이션하려 하지 말고 중심 경로를 의도적으로 그리세요.

Adobe Animate를 뜻했다면 Trace Bitmap 작업 흐름은 다른 앱의 별도 기능입니다.

Apple Motion에서는 Apple Motion SVG 가져오기 확인 방법을 사용해 정적 미디어, 투명도 설정, 애니메이션에 필요한 별도 개체를 구분하세요.

마스크가 필요할 때 Auto-Trace를 사용하세요

원본 레이어를 선택하고 Layer > Auto-trace를 선택하세요. Current Frame은 프레임 하나를 추적하고, Work Area는 해당 범위에 마스크 키프레임을 만듭니다. Adobe 마스크 안내에 설명된 대로 조절 기능을 조정하면서 Preview를 사용하세요.

조절 기능바뀌는 것
Channel윤곽을 제공하는 채널
Threshold가장자리를 분류하는 데 사용하는 채널 값 경계
Tolerance윤곽에서 허용되는 편차, 픽셀 단위
Minimum Area유지할 원본 특징의 최소 크기
Blur추적 전 부드럽게 처리
Corner Roundness결과 꼭짓점의 둥근 정도
Invert가장자리 감지 전 입력 반전
Apply To New Layer새 단색 레이어에 마스크 배치

정지 로고에서는 프레임 하나로 시작하고 조정하면서 알아보기 쉬운 특징 몇 개를 비교하세요. 모서리, 글자 내부 빈 공간, 의도한 가장 작은 표시를 확인하세요. 세 가지 모두에 통하는 유용한 범용 프리셋은 없습니다.

배경이 투명한 로고는 알파 채널이 따라갈 실루엣을 제공합니다. 완전히 불투명한 직사각형 이미지는 같은 분리를 제공하지 않습니다. 불필요한 직사각형을 허용치 문제로 보기 전에 원본의 투명도를 확인하세요. Adobe는 알파 채널 및 마스크 안내에서 색상과 투명도의 차이를 설명합니다.

결과가 흰색이면 레이어를 확인하세요

Auto-Trace 결과가 단색이면 마스크를 적용한 단색 레이어를 보고 있는지 확인하세요. 마스크는 레이어의 투명도를 바꿀 수 있지만 로고의 별도 색상 채우기를 저장하지는 않습니다. 개별 마스크와 모드를 살펴보세요. 효과 전용 경로에는 None 모드를 사용하면 알파가 유지됩니다. Adobe 마스크 동작 참고 문서

장면에 서로 다른 색상 영역이 필요하다면 임계값을 다시 조정하기 전에 아트 작업 방식을 선택하세요.

편집 가능한 아트가 필요하면 SVG를 가져오세요

현재 문서에 안내된 작업 흐름에서는 File > Import > File을 선택한 다음, 편집 가능한 도형을 위해 Import As에서 Composition - Retain Layer Sizes를 선택합니다. Contents 또는 Layer Contents에서 경로, 채우기, 변형을 살펴보세요. Footage는 외부 SVG에 연결된 벡터 레이어 하나를 유지하며, 여전히 전체를 변형할 수 있습니다. Adobe는 가져온 벡터 푸티지를 변환하는 Create > Create Shapes from Vector Layer도 안내합니다. Adobe SVG 가져오기 안내

다른 릴리스용 튜토리얼을 따르기 전에 설치된 앱의 옵션을 확인하세요. 가져오기 지원과 SVG 구조의 품질은 별개의 문제입니다. 서로 관계없는 조각이 수백 개 들어 있는 파일에는 여전히 애니메이션 계획이 필요합니다.

컴포지션에 넣기 전에 로고를 살펴보세요

다음은 기존 PerfectVector 데모 원본과 결과입니다. VECTOR라는 단어 위에 풍경 문양이 있습니다. 이 글을 위해 저장된 SVG를 검사했습니다. 경로 22개, 채우기 색상 6개가 있으며 포함된 이미지 요소는 없습니다. 이미지는 기존 변환 결과를 보여 주며 After Effects Auto-Trace 결과나 가져오기 테스트가 아닙니다.

SVG 준비 상태 검사
원본 풍경 로고 비트맵, 실제 SVG 변환 결과, 청록색 위에 따로 표시한 O 내부의 크림색 경로
기존 SVG를 그대로 보여 줍니다. 확대 부분은 모양이 보이도록 O 내부의 실제 크림색 채우기 경로를 청록색 배경에 따로 표시했습니다. 가져오기 전 파일 구조를 보여 주며 After Effects 화면 캡처나 가져오기 성공 주장에 해당하지 않습니다.

배경은 캔버스 전체를 덮는 크림색 경로입니다. O와 R 안에서 빈 공간처럼 보이는 부분도 어두운 글자 위에 놓인 크림색 채우기 경로입니다. 크림색 배경에서는 빈 공간처럼 보이지만 색이 칠해진 개체입니다. 모든 크림색 개체를 지우는 것은 좋지 않은 지름길입니다. 내부 경로를 삭제하면 구멍이 생기는 대신 아래의 어두운 도형이 드러납니다.

O를 영상 위에서 움직일 계획이라면 이 점이 중요합니다. 같은 색 배경에서 글자와 내부 경로를 함께 유지할지, 실제 빈 공간을 갖도록 글자를 재구성할지 결정하세요. 그런 다음 대비되는 배경에서 결과 투명도를 확인하세요. 의도한 시각적 동작이 편집 방향을 결정합니다.

로고의 강과 지형도 별도 색상 영역으로 구성됩니다. 추적은 원본에서 보이는 것을 따릅니다. 강 뒤에 가려진 풍경을 복원하거나 어떤 영역을 함께 움직일지 자동으로 결정하지 않습니다. 애니메이션에서 부분을 분리한다면 아래 아트가 완전하다고 가정하지 말고 새로 드러나는 가장자리를 살펴보세요.

경로 22개라는 수치는 목록이며 애니메이션 성능 점수가 아닙니다. 작은 조각, 중복 도형, 장면에서 쓸모없는 개체를 찾으세요. 의도한 디테일은 유지하세요. 이 파일에는 텍스트 요소도 없습니다. 단어는 도형이므로 문구를 바꾸는 일은 글자를 움직이는 것과 다른 작업입니다.

다른 파일에서는 포함된 래스터 검사 안내부터 시작하세요. 벡터 원본이 있다면 픽셀에서 로고를 재구성하기 전에 사용하세요. 로고 벡터화 안내에서 추적이나 수동 다시 그리기가 적합한 경우를 다룹니다.

재구성이 필요한 부분만 변환하세요

로고가 깔끔한 PNG나 JPG로만 있고 편집 가능한 채우기 영역이 필요하다면 PerfectVector로 로고를 벡터화한 다음 가져오기 전에 SVG를 살펴보세요. 색상 영역 하나, 글자 내부 하나, 배경을 확인하세요. 가져온 후 애니메이션할 개체를 독립적으로 제어할 수 있는지 확인하세요. 질감이 중요하면 래스터 푸티지를 유지하고, 마스크로 장면을 해결할 수 있다면 기본 Auto-Trace를 사용하세요.

로고 전체를 정리하기 전에 간단한 모션 테스트를 해 보세요. 부분 하나를 움직이고, 채우기 하나를 바꾸고, 대비되는 배경 위에 아트를 놓으세요. 그룹과 투명도에 관한 결정을 일찍 확인할 수 있습니다. 모든 것이 멈춰 있을 때 모양이 맞다는 이유만으로 파일을 받아들이는 것보다 유용합니다.

마스크 경로를 모양 경로로 변환하기

기존 마스크 도형을 재사용해야 하면 복사 전에 Mask Path 속성을 선택하세요. 그런 다음 모양 레이어에 있는 기존 모양의 Path 속성을 대상으로 선택하세요. 레이어나 그룹 선택은 같은 대상이 아닙니다. 필요하면 임시 베지어 경로를 만드세요. Adobe는 마스크 경로 선택 요건과 모양 경로 붙여넣기 대상을 모두 안내합니다.

도형을 옮긴 후에는 모양의 채우기, 스트로크, 배치, 애니메이션을 살펴보세요. 윤곽을 복사해도 Auto-Trace가 그 마스크에 저장하지 않은 색상을 복원하지는 않습니다. 다색 로고에서는 여러 마스크를 개별적으로 옮기는 것보다 준비된 아트를 가져오는 편이 더 직접적일 수 있습니다.

FAQ

After Effects Auto-Trace가 모양 레이어를 만드나요? Auto-Trace는 마스크를 만듭니다. 모양 작업 흐름에서 그 경로 도형을 재사용할 수 있지만, 원본 로고의 색상 아트를 자동으로 재구성하지는 않습니다.

After Effects에서 SVG 파일을 직접 가져올 수 있나요? 네. Adobe의 현재 문서는 푸티지 가져오기와 편집 가능한 모양 레이어를 포함한 컴포지션 가져오기를 설명합니다. 설치된 버전의 가져오기 옵션을 확인하고 애니메이션 전에 결과 개체를 살펴보세요.

Auto-Trace가 로고 대신 직사각형을 추적하는 이유는 무엇인가요? 선택한 채널과 원본 투명도를 확인하세요. 완전히 불투명한 이미지는 배경이 단순해 보여도 직사각형 알파 영역을 갖습니다. 원본을 준비하거나 의도한 윤곽을 구분하는 채널을 선택하세요.

로고를 SVG로 변환하면 편집 가능한 텍스트가 복원되나요? 아닙니다. 추적은 보이는 아트를 도형으로 재구성합니다. 원래 텍스트 문서가 있으면 보관하거나 올바른 글꼴로 문구를 다시 만드세요. 읽을 수 있는 단어를 편집 가능한 텍스트라고 가정하지 말고 SVG 개체를 살펴보세요.

Sources

  1. Adobe: 마스크 만들기 — Auto-Trace의 마스크 출력, 시간 범위, 조절 기능.
  2. Adobe: SVG 파일 가져오기 — 현재 푸티지 및 편집 가능한 컴포지션 가져오기 작업 흐름.
  3. Adobe: 알파 채널과 마스크 — 투명도, 마스크 모드, 도형 복사 시 Mask Path 선택.
  4. Adobe: 모양과 마스크 만들기 및 사용자 지정 — 붙여넣을 때 기존 모양의 Path 속성을 대상으로 선택하는 방법.

애니메이션에 필요한 개체를 선택하세요. 부족한 것이 편집 가능한 아트라면 자신의 로고를 SVG로 변환하고, 영역과 내부 빈 공간을 확인한 다음, After Effects로 가져와 독립적인 움직임 하나를 시험하세요.

블로그의 다른 글

편집하기 쉬운
더 깔끔한 SVG로 다시 시작하세요