프롬프트만으로 완성도 높은 모션 제작
Figma의 AI 에이전트를 활용해 전문가 수준의 애니메이션을 제작하세요. 반복적인 동작이나 복잡한 스토리텔링이 필요한 모션 작업에 특히 유용합니다.
Figma Motion
캔버스에서 바로 정교하고 프로덕션 수준의 애니메이션을 제작하세요.
디자인하던 바로 그 공간에서 모션까지 디자인하세요.
모션 디자인이 처음이든, 이징 전문가이든 상관없이 디자인에 늘어남, 튕김, 압축 같은 움직임을 손쉽게 적용할 수 있습니다.
모든 키프레임을 세밀하게 제어하세요
타임라인을 완전히 제어할 수 있습니다. 모든 프레임과 속성을 원하는 대로 세밀하게 설정한 뒤, 팀원들을 초대해 최종 애니메이션을 함께 완성하세요.
무한한 창의성. 정교한 제어.
작업에 명확성과 표현력을 더하세요. 로딩 상태, 호버 인터랙션, 로고 애니메이션 등 다양한 요소에 생동감을 부여할 수 있습니다. 한계는 오직 타임라인뿐입니다.
미리 준비된 스타일로 빠르게 제작하세요
기본 애니메이션 스타일이 내장되어 있습니다. 페이드, 회전, 스케일, 크기 조정 등을 활용할 수 있으며, 여러 스타일을 조합해 원하는 표현을 구현할 수 있습니다. 맞춤형 스타일도 곧 제공될 예정입니다.
타이밍을 자동으로 조정하세요
오토키를 사용해 모션 움직임을 자동으로 추적하고 기록한 뒤, 베지어 곡선과 스프링 설정으로 각 키프레임을 세밀하게 조정하세요.
새로운 차원의 디자인을 경험하세요
3D 변형으로 디자인과 이미지에 깊이감을 더하세요. 모션과 결합하면 실제 세계의 물체처럼 자연스럽게 움직이는 표현을 만들 수 있습니다.곧 출시 예정.
모든 전환을 더욱 부드럽게 만드세요
이제 모든 화면 전환에 완전한 타임라인이 제공되며, 각 요소의 타이밍을 개별적으로 조정할 수 있습니다.곧 출시 예정.
애니메이션을 바로 코드로 배포하세요.
모든 애니메이션은 실제 프로덕션 환경에서 사용할 수 있는 코드로 구현되며, Figma에서 바로 내보낼 수 있습니다.
번거로움 없는 개발 핸드오프
개발자는 Dev 모드에서 전체 모션 타임라인을 검사한 다음, 애니메이션 코드를 CSS, JSON 또는 React에 직접 복사할 수 있습니다.
AI 에이전트에 완전한 모션 컨텍스트를 제공하세요
Figma MCP 서버를 통해 애니메이션 코드를 에이전틱 코딩 도구로 전달하세요. 이징, 타이밍 등 모든 모션 설정 값이 그대로 유지됩니다.
Figma에서 직접 내보내기
모션을 더 널리 공유하세요. 어떤 애니메이션 프레임이든 MP4, GIF, SVG, WebM 파일로 변환할 수 있습니다.