Q: ¿Cómo uso la animación Lottie en apps iOS?

Usar Lottie en iOS es sencillo con la biblioteca Lottie-iOS: **1. Instalar Lottie-iOS:** **Swift Package Manager:** ```swift dependencies: [ .package(url: "https://github.com/airbnb/lottie-ios.git", from: "4.0.0") ] ``` **CocoaPods:** ```ruby pod 'lottie-ios' ``` **2. Añade tu archivo animation.json a tu proyecto** **3. Usar en SwiftUI:** ```swift import Lottie struct ContentView: View { var body: some View { LottieView(animation: .named("animation")) .playing(loopMode: .loop) .resizable() .frame(width: 200, height: 200) } } ``` **4. Usar en UIKit:** ```swift import Lottie let animationView = LottieAnimationView(name: "animation") animationView.frame = CGRect(x: 0, y: 0, width: 200, height: 200) animationView.contentMode = .scaleAspectFit animationView.loopMode = .loop animationView.play() view.addSubview(animationView) ``` Las animaciones Lottie en iOS son aceleradas por hardware y eficientes en batería.

Question 1

¿Qué es la animación Lottie JSON?

Accepted Answer

Lottie es un formato de animación para móvil primero creado por Airbnb. Exporta animaciones como archivos JSON que pueden renderizarse nativamente en plataformas iOS, Android y web usando la biblioteca Lottie.

**Especificaciones técnicas:**
- **Formato:** JSON con imágenes WebP incrustadas
- **Transparencia:** Canal alfa completo (vía WebP)
- **Animación:** Híbrido vector + raster
- **Tamaño de Archivo:** Muy pequeño (típicamente <100KB)
- **Reproducción:** Acelerada por hardware
- **Control:** Programático (reproducir, pausar, bucle, velocidad, etc.)

**Cómo funciona:**
Nuestra exportación Lottie usa un enfoque híbrido: el JSON describe el timing y transformaciones de la animación, mientras que los fotogramas de video reales se incrustan como imágenes WebP comprimidas. Esto proporciona el mejor balance de calidad y tamaño de archivo.

**Ventaja clave:** A diferencia de archivos de video (MP4, MOV), Lottie te da control completo sobre la velocidad de reproducción, bucle, dirección, e incluso puede ir a fotogramas específicos.

Question 2

¿Cómo uso la animación Lottie en apps iOS?

Accepted Answer

Usar Lottie en iOS es sencillo con la biblioteca Lottie-iOS:

**1. Instalar Lottie-iOS:**

**Swift Package Manager:**
```swift
dependencies: [
  .package(url: "https://github.com/airbnb/lottie-ios.git", from: "4.0.0")
]
```

**CocoaPods:**
```ruby
pod 'lottie-ios'
```

**2. Añade tu archivo animation.json a tu proyecto**

**3. Usar en SwiftUI:**
```swift
import Lottie

struct ContentView: View {
  var body: some View {
    LottieView(animation: .named("animation"))
      .playing(loopMode: .loop)
      .resizable()
      .frame(width: 200, height: 200)
  }
}
```

**4. Usar en UIKit:**
```swift
import Lottie

let animationView = LottieAnimationView(name: "animation")
animationView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)
animationView.contentMode = .scaleAspectFit
animationView.loopMode = .loop
animationView.play()
view.addSubview(animationView)
```

Las animaciones Lottie en iOS son aceleradas por hardware y eficientes en batería.

Elimina el Fondo y Exporta Animación Lottie JSON

Subir y Exportar Lottie

Influencer Content

Surf demo with Surf Buddy

Animation Bear

Animation Monster

Social Media Portrait

AI Generated Spaceships

¿Por Qué Exportar Animaciones Transparentes Lottie JSON?

Archivos Diminutos

Soporte Móvil Nativo

Control de Reproducción Completo

Cómo Crear Lottie JSON desde Video

1. Sube Tu Video

2. La IA Elimina el Fondo

3. Descargar Lottie JSON

Procesamiento de Pago por Uso

Preguntas Frecuentes sobre Animación Lottie JSON