# 여러 애니메이션 파일 다루기
`.lottie`(dotLottie) 파일은 하나의 번들 안에 둘 이상의 애니메이션을 담을 수 있습니다. 이 페이지는 플러그인이 여러 애니메이션 파일을 감지하는 방식, 삽입할 애니메이션을 고르는 방법, 단일 파일 가져오기와 여러 애니메이션 워크플로가 어떻게 다른지 다룹니다.

## 여러 애니메이션의 의미

표준 `.lottie` 파일은 하나의 Lottie 애니메이션을 감쌉니다. 여러 애니메이션 `.lottie` 파일은 두 개 이상을 감싸며, 번들에는 이름으로 인덱싱된 여러 애니메이션이 들어 있습니다. 보통 다음에 사용됩니다.

- 관련 아이콘 세트(success / error / loading 변형).
- 여러 개의 구분된 애니메이션을 가진 캐릭터(idle, hover, click).
- 같은 애니메이션의 테마 변형(light / dark mode).

## 여러 애니메이션 감지

여러 애니메이션 `.lottie`를 Import 탭에 드롭하거나 붙여넣으면 플러그인이 감지하고 미리 보기를 단일 플레이어 대신 **carousel** 모드로 전환합니다.

보이는 항목:

- 위쪽의 더 큰 미리 보기 영역에서 재생되는 활성 애니메이션 하나.
- 현재 애니메이션 번호와 이름을 보여주는 counter pill.
- 번들의 각 애니메이션을 나타내는 애니메이션 썸네일 행.
- 항목 사이를 스크롤하고 선택하는 컨트롤.

{
  // TEMP_IMAGE_HIDDEN: 임시 릴리스에서는 숨김. 시각 QA 때 이 소스 위치에 이미지를 복원하세요.
  false ? (

  <Image
        src="/images/screenshots/ae-import-multi-animation-carousel.webp"
        alt="Import tab in multi-animation mode with preview carousel, thumbnail strip, and active thumbnail highlighted"
        caption="여러 애니메이션 Import 미리 보기"
        zoom
        variant="default"
      />
  ) : null
}

{/* [needs review] carousel UI 위치(상단, 하단, 측면)와 선택 동작 확인 */}

## 선택하고 삽입하기

1. carousel의 썸네일을 클릭해 미리 보기를 해당 애니메이션으로 전환합니다.
2. 미리 보기가 원하는 것과 맞으면 Insert를 클릭합니다.
3. 플러그인은 선택한 애니메이션만 컴포지션의 새 레이어로 삽입합니다.

같은 `.lottie`에서 여러 애니메이션을 삽입하려면:

- 첫 번째를 삽입합니다.
- Import 탭을 벗어나지 않은 상태에서 다음 썸네일을 선택하고 다시 삽입합니다.
- 각 삽입은 새 레이어를 배치합니다.

{/* [needs review] 여러 삽입이 하나씩인지 일괄인지 확인 */}

## 상태 머신이나 테마가 있을 때

여러 애니메이션 `.lottie`에 상태 머신이나 테마(고급 dotLottie 기능)가 포함되어 있으면 플러그인은 미리 보기 영역에 추가 정보를 표시합니다.

- **상태 머신** — 목록으로 표시되지만 보통 AE 플러그인 미리 보기 안에서는 구동되지 않습니다. 상태 머신은 목적지 런타임에서 활성화됩니다.
- **테마** — 플러그인이 미리 보기 중 테마 변형 전환을 허용할 수 있습니다.

이 기능은 목적지에서 dotLottie를 지원하는 런타임이 필요합니다. 런타임 고려 사항은 [렌더링 → 형식 선택](/ko/integrations/after-effects/05_render#choosing-format)을 참고하세요.

## 모션/제품 디자이너를 위한 팁

- **디자인 시스템에는 여러 애니메이션 `.lottie`가 유용합니다.** 관련 아이콘이나 상태를 하나의 파일로 묶으면 팀원은 한 번 가져와 전체 세트를 받을 수 있습니다.
- **출시 전에 목적지 런타임이 여러 애니메이션을 지원하는지 확인하세요.** 일반 `lottie-web`은 `.lottie`의 첫 번째 애니메이션만 읽습니다. 전체 multi-animation 지원에는 `dotlottie-web` 또는 이에 준하는 런타임이 필요합니다.

{
  // TEMP_IMAGE_HIDDEN: 임시 릴리스에서는 숨김. 시각 QA 때 이 소스 위치에 이미지를 복원하세요.
  false ? (

  <Image
        src="/images/screenshots/ae-import-single-vs-multi.webp"
        alt="Side-by-side comparison of standard dotLottie import and multi-animation dotLottie import"
        caption="단일 애니메이션과 여러 애니메이션 가져오기 레이아웃"
        zoom
        variant="default"
      />
  ) : null
}

- **`.lottie` 안의 애니메이션 이름을 명확히 지으세요.** carousel은 내부 이름으로 애니메이션에 라벨을 붙입니다. "Animation 1" 같은 일반 이름은 팀원이 고르기 어렵게 만듭니다.

## 문제 해결

- **여러 애니메이션이라고 예상한 `.lottie`에 carousel이 나타나지 않음** — [LottieFiles Creator](/ko/creator) 또는 다른 inspector에서 `.lottie`가 실제로 여러 애니메이션을 포함하는지 확인하세요. 일부 번들은 여러 개라고 말하지만 실제로는 하나만 들어 있습니다.
- **선택한 애니메이션이 미리 본 것과 다르게 삽입됨** — 삽입하기 전에 썸네일을 다시 선택해 미리 보기를 새로 고치세요. {/* [needs review] 확인 필요 */}

## 관련 문서

- [파일에서 가져오기](/ko/integrations/after-effects/03_import/importing-from-file) — 단일 파일 가져오기 기본.
- [렌더링 → 형식 선택](/ko/integrations/after-effects/05_render#choosing-format) — `.lottie`와 `.json` 중 무엇을 전달할지.
- [기능 검수](/ko/integrations/after-effects/08_feature-checker) — 여러 애니메이션 파일이 어떤 기능을 사용하는지 정확히 확인합니다.
