Figma

Figma용 LottieFiles 플러그인을 사용하면 Figma를 떠나지 않고 LottieFiles 라이브러리를 둘러보고, 저장된 워크스페이스 에셋으로 작업하고, Figma 장면이나 프로토타입 플로우를 Lottie 출력물로 변환할 수 있습니다.

이 문서는 두 가지 자주 쓰는 흐름을 기준으로 볼 수 있습니다.

• Lottie에서 시작하기 - Explore 또는 Workspace에서 기존 애니메이션을 찾은 뒤 Figma 장면에 삽입합니다.

• Figma에서 만들기 - 프레임, 프로토타입 플로우, 인터랙티브 프로토타입 상태를 Figma to Lottie로 Lottie 또는 dotLottie 출력물로 변환합니다.

이 문서에서 Figma 장면은 Lottie 애니메이션의 원본으로 준비하는 프레임, 여러 프레임, 또는 프로토타입 플로우를 뜻합니다.

할 수 있는 일

• Explore 공개 LottieFiles 라이브러리를 둘러보고 무료 또는 Premium 애니메이션을 Figma에 삽입합니다.

• Workspace 팀의 비공개 애니메이션 라이브러리, 프로젝트, 폴더에 접근합니다.

• Export 탭에서 선택한 프레임, 여러 프레임 시퀀스, 프로토타입 플로우, 인터랙티브 상태 머신을 내보냅니다.

• 내보내기와 핸드오프 Workspace에 저장하고, 파일을 다운로드하고, GIF를 삽입하거나 개발자용 링크를 공유합니다.

• Prompt to Vector와 Vectorizer 플러그인의 Tools 탭에서 애니메이션 전 원본 아트워크를 준비합니다.

• 런타임 호환성 더 작은 파일과 고급 기능에는 dotLottie(.lottie)를 우선하고, 레거시 lottie-web 플레이어가 필요할 때는 Lottie JSON을 사용합니다.

여기서 시작하세요

1. 빠른 시작 - 플러그인을 설치하고, 인터페이스를 익히고, 첫 애니메이션을 만듭니다.

2. 애니메이션 방식 선택 - Figma 장면에 프리셋, 여러 프레임, 프로토타입 플로우, 인터랙티브 상태 머신 중 무엇을 써야 하는지 결정합니다.

3. 기능 검수 - 다시 내보내기 전에 주황색 렌더링/내보내기 경고를 이해합니다.