향상된 크로스 플랫폼 지원
다양한 플랫폼 간 일관성 없는 애니메이션의 시대는 끝! dotLottie 런타임은 웹, 안드로이드, IOS에서 일관성 있는 기능을 보장합니다.
다양한 플랫폼 간 일관성 없는 애니메이션의 시대는 끝! dotLottie 런타임은 웹, 안드로이드, IOS에서 일관성 있는 기능을 보장합니다.
![성능 향상](https://framerusercontent.com/images/z7wbLyw0LtBth9QPN2dbGNKIfU.png)
![성능 향상](https://framerusercontent.com/images/z7wbLyw0LtBth9QPN2dbGNKIfU.png)
![성능 향상](https://framerusercontent.com/images/z7wbLyw0LtBth9QPN2dbGNKIfU.png)
향상된 성능
최적화된 고성능 런타임으로 빠르고 부드러운 애니메이션을 경험해보세요. 어느 기기에서나 높은 효율성을 제공합니다.
최적화된 고성능 런타임으로 빠르고 부드러운 애니메이션을 경험해보세요. 어느 기기에서나 높은 효율성을 제공합니다.
![플랫폼 일관성](https://framerusercontent.com/images/mLz62p5jqGFiO4pMqHBiU1YH50.png)
![플랫폼 일관성](https://framerusercontent.com/images/mLz62p5jqGFiO4pMqHBiU1YH50.png)
![플랫폼 일관성](https://framerusercontent.com/images/mLz62p5jqGFiO4pMqHBiU1YH50.png)
![AE 표현](https://framerusercontent.com/images/L87MjEQM6GEMekCjvZBWtBhTFs.png)
![AE 표현](https://framerusercontent.com/images/L87MjEQM6GEMekCjvZBWtBhTFs.png)
![AE 표현](https://framerusercontent.com/images/L87MjEQM6GEMekCjvZBWtBhTFs.png)
After Effect Expressions 지원
새로운
이제 dotLottie 플레이어에서 웹, IOS, 및 안드로이드에서 AE Expressions를 완벽하게 지원합니다.
이제 dotLottie 플레이어에서 웹, IOS, 및 안드로이드에서 AE Expressions를 완벽하게 지원합니다.
강력한 프레임워크 통합 기능
강력한 프레임워크 통합 기능
dotLottie 런타임을 이용하면 여러 프레임워크와의 통합을 쉽고 빠르게 할 수 있습니다.
dotLottie 런타임을 이용하면 여러 프레임워크와의 통합을 쉽고 빠르게 할 수 있습니다.
Web
React
VueJS
Svelte
iOS
Android
import { DotLottie } from '@lottiefiles/dotlottie-web';
const dotLottie = new DotLottie({
autoplay: true,
loop: true,
canvas: document.querySelector('#dotlottie-canvas'),
src: "https://lottie.host/4db68bbd-31f6-4cd8-84eb-189de081159a/IGmMCqhzpt.lottie", // or .json file
});
Web
React
VueJS
Svelte
iOS
Android
import { DotLottie } from '@lottiefiles/dotlottie-web';
const dotLottie = new DotLottie({
autoplay: true,
loop: true,
canvas: document.querySelector('#dotlottie-canvas'),
src: "https://lottie.host/4db68bbd-31f6-4cd8-84eb-189de081159a/IGmMCqhzpt.lottie", // or .json file
});
Web
React
VueJS
Svelte
iOS
Android
import { DotLottie } from '@lottiefiles/dotlottie-web';
const dotLottie = new DotLottie({
autoplay: true,
loop: true,
canvas: document.querySelector('#dotlottie-canvas'),
src: "https://lottie.host/4db68bbd-31f6-4cd8-84eb-189de081159a/IGmMCqhzpt.lottie", // or .json file
});
dotLottie의 장점
dotLottie의 장점
혁신적인 dotLottie 파일 포맷을 통해 아래의 다양한 장점을 활용해 보세요:
dotLottie, 우리의 혁신적인 파일 형식으로 다양한 혜택을 제공합니다: 파일 크기 축소, 상호 작용, 표현과 테마 및 번들 패키지와 함께합니다.
dotLottie, 우리의 혁신적인 파일 형식으로 다양한 혜택을 제공합니다: 파일 크기 축소, 상호 작용, 표현과 테마 및 번들 패키지와 함께합니다.
![파일 크기 감소](https://framerusercontent.com/images/mNWcdvuLWLvFmLaRKeY9pYdwjOY.png)
파일 크기 축소
최대 80%까지 애니메이션 압축하고 품질 저하 없이 확대 또는 축소가 가능합니다.
![파일 크기 감소](https://framerusercontent.com/images/mNWcdvuLWLvFmLaRKeY9pYdwjOY.png)
파일 크기 축소
최대 80%까지 애니메이션 압축하고 품질 저하 없이 확대 또는 축소가 가능합니다.
![파일 크기 감소](https://framerusercontent.com/images/mNWcdvuLWLvFmLaRKeY9pYdwjOY.png)
파일 크기 축소
최대 80%까지 애니메이션 압축하고 품질 저하 없이 확대 또는 축소가 가능합니다.
![파일 크기 감소](https://framerusercontent.com/images/mNWcdvuLWLvFmLaRKeY9pYdwjOY.png)
파일 크기 축소
최대 80%까지 애니메이션 압축하고 품질 저하 없이 확대 또는 축소가 가능합니다.
![테마 설정](https://framerusercontent.com/images/UkENV8lvD9bz7V9vGB9RuHBYug.png)
테마 지원
Dark, Light 또는 사용자 지정 모드를 추가하고 애니메이션에 이를 쉽게 적용할 수 있습니다.
![테마 설정](https://framerusercontent.com/images/UkENV8lvD9bz7V9vGB9RuHBYug.png)
테마 지원
Dark, Light 또는 사용자 지정 모드를 추가하고 애니메이션에 이를 쉽게 적용할 수 있습니다.
![테마 설정](https://framerusercontent.com/images/UkENV8lvD9bz7V9vGB9RuHBYug.png)
테마 지원
Dark, Light 또는 사용자 지정 모드를 추가하고 애니메이션에 이를 쉽게 적용할 수 있습니다.
![테마 설정](https://framerusercontent.com/images/UkENV8lvD9bz7V9vGB9RuHBYug.png)
테마 지원
Dark, Light 또는 사용자 지정 모드를 추가하고 애니메이션에 이를 쉽게 적용할 수 있습니다.
![상호 작용성](https://framerusercontent.com/images/YS8DZGr15XqynE2Dbm7xm1aP3iw.png)
사용자 상호 작용
새롭게 도입한 상호 작용 기능을 활용하여 플랫폼 전반에 걸쳐 매력적이고 흥미로운 애니메이션을 만들수 있습니다.
![상호 작용성](https://framerusercontent.com/images/YS8DZGr15XqynE2Dbm7xm1aP3iw.png)
사용자 상호 작용
새롭게 도입한 상호 작용 기능을 활용하여 플랫폼 전반에 걸쳐 매력적이고 흥미로운 애니메이션을 만들수 있습니다.
![상호 작용성](https://framerusercontent.com/images/YS8DZGr15XqynE2Dbm7xm1aP3iw.png)
사용자 상호 작용
새롭게 도입한 상호 작용 기능을 활용하여 플랫폼 전반에 걸쳐 매력적이고 흥미로운 애니메이션을 만들수 있습니다.
![상호 작용성](https://framerusercontent.com/images/YS8DZGr15XqynE2Dbm7xm1aP3iw.png)
사용자 상호 작용
새롭게 도입한 상호 작용 기능을 활용하여 플랫폼 전반에 걸쳐 매력적이고 흥미로운 애니메이션을 만들수 있습니다.
![번들 패키지](https://framerusercontent.com/images/Ur1gqnpiGW7EHJXVRXMarxWyzI4.png)
통합 패키지
단일 dotLottie 파일에 여러 애니메이션 및 에셋을 포함하여 관리 및 배포를 간소화합니다.
![번들 패키지](https://framerusercontent.com/images/Ur1gqnpiGW7EHJXVRXMarxWyzI4.png)
통합 패키지
단일 dotLottie 파일에 여러 애니메이션 및 에셋을 포함하여 관리 및 배포를 간소화합니다.
![번들 패키지](https://framerusercontent.com/images/Ur1gqnpiGW7EHJXVRXMarxWyzI4.png)
통합 패키지
단일 dotLottie 파일에 여러 애니메이션 및 에셋을 포함하여 관리 및 배포를 간소화합니다.
![번들 패키지](https://framerusercontent.com/images/Ur1gqnpiGW7EHJXVRXMarxWyzI4.png)
통합 패키지
단일 dotLottie 파일에 여러 애니메이션 및 에셋을 포함하여 관리 및 배포를 간소화합니다.
![비할 데 없는 성능](https://framerusercontent.com/images/iO1D7h9aCHk0CIzEHDvXh4GvPHk.png)
강력한 퍼포먼스
새로운 dotLottie 런타임은 고성능 그래픽 엔진 ThorVG에 의해 구동됩니다. 일반 JSON보다 크기가 80% 작은 dotLottie 형식을 지원합니다.
![비할 데 없는 성능](https://framerusercontent.com/images/iO1D7h9aCHk0CIzEHDvXh4GvPHk.png)
강력한 퍼포먼스
새로운 dotLottie 런타임은 고성능 그래픽 엔진 ThorVG에 의해 구동됩니다. 일반 JSON보다 크기가 80% 작은 dotLottie 형식을 지원합니다.
![비할 데 없는 성능](https://framerusercontent.com/images/iO1D7h9aCHk0CIzEHDvXh4GvPHk.png)
강력한 퍼포먼스
새로운 dotLottie 런타임은 고성능 그래픽 엔진 ThorVG에 의해 구동됩니다. 일반 JSON보다 크기가 80% 작은 dotLottie 형식을 지원합니다.
![비할 데 없는 성능](https://framerusercontent.com/images/iO1D7h9aCHk0CIzEHDvXh4GvPHk.png)
강력한 퍼포먼스
새로운 dotLottie 런타임은 고성능 그래픽 엔진 ThorVG에 의해 구동됩니다. 일반 JSON보다 크기가 80% 작은 dotLottie 형식을 지원합니다.
![성능 지수](https://framerusercontent.com/images/C4vBAbMvNOCU0aUUPF9ps25q1a8.png)
성능 지수
dotLottie 런타임은 기존 웹 플레이어 대비 월등히 우수한 성능 지수를 보여줍니다. 성능 지수를 바로 확인해 보세요.
![성능 지수](https://framerusercontent.com/images/C4vBAbMvNOCU0aUUPF9ps25q1a8.png)
성능 지수
dotLottie 런타임은 기존 웹 플레이어 대비 월등히 우수한 성능 지수를 보여줍니다. 성능 지수를 바로 확인해 보세요.
![성능 지수](https://framerusercontent.com/images/C4vBAbMvNOCU0aUUPF9ps25q1a8.png)
성능 지수
dotLottie 런타임은 기존 웹 플레이어 대비 월등히 우수한 성능 지수를 보여줍니다. 성능 지수를 바로 확인해 보세요.
![성능 지수](https://framerusercontent.com/images/C4vBAbMvNOCU0aUUPF9ps25q1a8.png)
성능 지수
dotLottie 런타임은 기존 웹 플레이어 대비 월등히 우수한 성능 지수를 보여줍니다. 성능 지수를 바로 확인해 보세요.
![자바스크립트 라이브러리](https://framerusercontent.com/images/4J1S1QUDOAg5IKiM8t9Yw3DZD0.png)
JavaScript 라이브러리
강력한 JavaScript 라이브러리로 dotLottie 애니메이션을 쉽게 생성하고 제어할 수 있습니다.
![자바스크립트 라이브러리](https://framerusercontent.com/images/4J1S1QUDOAg5IKiM8t9Yw3DZD0.png)
JavaScript 라이브러리
강력한 JavaScript 라이브러리로 dotLottie 애니메이션을 쉽게 생성하고 제어할 수 있습니다.
![자바스크립트 라이브러리](https://framerusercontent.com/images/4J1S1QUDOAg5IKiM8t9Yw3DZD0.png)
JavaScript 라이브러리
강력한 JavaScript 라이브러리로 dotLottie 애니메이션을 쉽게 생성하고 제어할 수 있습니다.
![자바스크립트 라이브러리](https://framerusercontent.com/images/4J1S1QUDOAg5IKiM8t9Yw3DZD0.png)
JavaScript 라이브러리
강력한 JavaScript 라이브러리로 dotLottie 애니메이션을 쉽게 생성하고 제어할 수 있습니다.
dotLottie를 적용한 결과, 8초 이상의 시간을 절약하여 약 80%의 성능 향상을 이루었습니다. 또한, 메모리 사용량에서도 약 164MB를 절약하여 70% 이상의 효율성을 달성할 수 있었습니다.
dotLottie를 적용한 결과, 8초 이상의 시간을 절약하여 약 80%의 성능 향상을 이루었습니다. 또한, 메모리 사용량에서도 약 164MB를 절약하여 70% 이상의 효율성을 달성할 수 있었습니다.
FAQs
어떤 플랫폼과 프레임워크에서 지원되나요?
dotLottie 런타임은 웹, 안드로이드, IOS, 그리고 React, Node.js, Vue.js 등 인기있는 프레임워크를 지원합니다.
어떤 플랫폼과 프레임워크에서 지원되나요?
dotLottie 런타임은 웹, 안드로이드, IOS, 그리고 React, Node.js, Vue.js 등 인기있는 프레임워크를 지원합니다.
어떤 플랫폼과 프레임워크에서 지원되나요?
dotLottie 런타임은 웹, 안드로이드, IOS, 그리고 React, Node.js, Vue.js 등 인기있는 프레임워크를 지원합니다.
어떤 플랫폼과 프레임워크에서 지원되나요?
dotLottie 런타임은 웹, 안드로이드, IOS, 그리고 React, Node.js, Vue.js 등 인기있는 프레임워크를 지원합니다.