LottieFiles
ecommerce stepper
0:000:00

Animación gratuita ecommerce stepper

The designer built a step-by-step visual tracker (a "stepper") that shows users where their order is in the delivery process (e.g., Order Placed, Shipped, Out for Delivery, Delivered). The initial design and creation of the visuals were done in Figma (a collaborative interface design tool). The output was saved as an SVG (Scalable Vector Graphics) file, which is a web-friendly, resolution-independent format perfect for animations. The SVG was then transformed into a Lottie animation. Lottie is a JSON-based animation file format that allows designers to ship animations to any platform (web, iOS, Android, React Native, etc.) without having to recreate them in code. This ensures the animation is small, fast, and high-quality. The final duration of the animation was set to 4 seconds. This is the total time it takes for the animation to complete its full cycle, likely transitioning between the different delivery steps.

The designer built a step-by-step visual tracker (a "stepper") that shows users where their order is in the delivery process (e.g., Order Placed, Shipped, Out for Delivery, Delivered). The initial design and creation of the visuals were done in Figma (a collaborative interface design tool). The output was saved as an SVG (Scalable Vector Graphics) file, which is a web-friendly, resolution-independent format perfect for animations. The SVG was then transformed into a Lottie animation. Lottie is a JSON-based animation file format that allows designers to ship animations to any platform (web, iOS, Android, React Native, etc.) without having to recreate them in code. This ensures the animation is small, fast, and high-quality. The final duration of the animation was set to 4 seconds. This is the total time it takes for the animation to complete its full cycle, likely transitioning between the different delivery steps.

  • dotLottie optimizadoRecomendado
    30.4 KB

    El tamaño de archivo más pequeño con compatibilidad con temas, máquinas de estados e interactividad.

    87% más pequeño que Lottie JSON
  • dotLottie
    48.3 KB

    Animación Lottie comprimida que admite temas y máquinas de estados.

  • Lottie JSON optimizado
    147.2 KB

    Formato JSON optimizado para una carga más rápida con compatibilidad estándar con Lottie.

    39% más pequeño que Lottie JSON
  • Lottie JSON
    242.5 KB

    Formato de animación Lottie estándar con amplia compatibilidad entre herramientas y plataformas.

Other export formats

Interacciones y complementos

Ver todo
figma
after-effects
framer
canva
webflow
wix

Gratis para usar bajo la Licencia Simple de Lottie

Etiquetas de animación