100% Jetpack Compose — Código real, no videos

Production-ready
Compose Animations

Cada animación incluye el código Kotlin completo, la filosofía de motion y las decisiones de física. Copiá, pegá, y tené animaciones de nivel profesional en minutos.

AirbnbPhotoPopSlide.kt

@Composable
fun AirbnbPhotoPopSlide(
    modifier: Modifier = Modifier,
) {
    val scale = remember { Animatable(0.8f) }
    val alpha = remember { Animatable(0f) }

    LaunchedEffect(Unit) {
        // Spring physics — inspired by Airbnb's photo pop
        scale.animateTo(
            targetValue = 1f,
            animationSpec = spring(
                dampingRatio = 0.55f,
                stiffness = StiffnessLow
            )
        )
    }
}

Catálogo de Movimiento

Explora más de 20 animaciones curadas, listas para copiar, pegar y personalizar en tus proyectos de Android.

PRO

Airbnb Add Guests Counter

👆

Modal de selección de huéspedes con un único contador central. Número grande (56sp) con pulse al cambiar, botones +/- circulares con press feedback, y personas ilustradas que aparecen con stagger pop conforme el contador sube. Máximo 14. Tamaños de emoji adaptativos según la cantidad visible. Inspirado en el selector de capacidad de Airbnb.

Kotlin / ComposeVer Código
PRO

Airbnb Photo Drag to Reorder

Variante drag del collage de fotos: arrastrá cualquier foto libremente con el dedo. Al soltar, hace snap-back con spring bouncy a su posición original. Durante el drag la foto se agranda (1.12x) y la sombra sube a 20dp, creando el efecto de 'levantar' la polaroid.

Kotlin / ComposeVer Código
PRO

Airbnb Photo Pop & Slide

Collage de fotos tipo polaroid scatter con stagger pop desde abajo. 3 fotos con rotaciones únicas (-8°, +5°, -3°) aparecen en secuencia con 150ms de delay, creando un efecto orgánico de 'dejar caer sobre la mesa'. Inspirado en la pantalla de reserva de experiencias de Airbnb.

Kotlin / ComposeVer Código
PRO

Airbnb Photo Tap to Front

Variante interactiva del collage de fotos: al tocar una foto, sube al frente con un pulse de scale (1→1.08) y sombra elevada, mientras las demás se reducen a 0.95. Combina la entrada stagger pop con reordenamiento por tap.

Kotlin / ComposeVer Código
PRO

Airbnb Review Button Morph

Un solo botón flotante que MORFA según el contexto del scroll. Mientras revisás los detalles de la reserva, es una pill rosa compacta '▼ Review'. Al llegar al bottom, morfa a 'Continue to ⚡Razorpay' — full width, color oscuro, corners más rectos. La transformación ocurre en fases: primero color + corners (Fase 1), luego el width se expande simétricamente desde el centro (Fase 2), y finalmente el contenido cambia cuando el ancho ya llegó. Inspirado en el checkout de experiencias de Airbnb India.

Kotlin / ComposeVer Código
PRO

Airbnb Property Detail

El SharedElement mas espacioso del ecosistema mobile. Imagen hero + precio viajan como SharedElement, contenido emerge con stagger de 80ms (mas lento que fintech porque Airbnb no apura). Parallax sutil del hero al scrollear, CTA siempre visible sin stagger.

Kotlin / ComposeVer Código

Filosofía de Código

Optimización de Bajo Nivel

Nuestras animaciones no solo se ven bien; están optimizadas para evitar la invalidación innecesaria del layout. Utilizamos GraphicsLayers y Modifier.drawBehind para garantizar 60 FPS constantes en cualquier dispositivo.

Recomposition-freeLayer-optimizedZero-overhead

Ready-to-Copy

Cada componente viene con un código limpio, modular y documentado. Solo tienes que copiar y adaptar los parámetros de color y tamaño.

Gestos Intuitivos

Integración profunda con PointerInput para una respuesta táctil que se siente natural y fluida bajo el dedo.

Actualizaciones Semanales

Añadimos nuevas animaciones inspiradas en Airbnb, Wise, Revolut, Tinder, Linear y las apps referentes en motion del mercado, todas las semanas.

Ver Historial

Elige tu nivel de Motion

Desbloquea el código fuente completo, guías de arquitectura de animación y componentes listos para producción.

BÁSICO
Free
$0
  • Acceso a ejemplos básicos
  • Documentación pública
  • Código Kotlin avanzado
Empezar Gratis
RECOMENDADO
MEMBRESÍA PRO
Suscripción
$9/ mes
O elige $49 / año (Ahorra 50%)
  • Todo lo de Free
  • Código Kotlin completo de cada animación
  • Motion Philosophy explicada
  • Physics Decisions detalladas
  • Nuevas animaciones cada semana
ACCESO TOTAL
LIFETIME
$99pago único
 
  • Todo lo de PRO, para siempre
  • Acceso a todas las animaciones futuras
  • Acceso anticipado a nuevos capítulos
  • Soporte prioritario

Código Jetpack Compose Limpio

Implementaciones modulares listas para copiar y pegar en tus proyectos reales sin dependencias externas pesadas.

60 FPS Garantizados

Optimizadas para rendimiento móvil extremo.

Inspirado en las Mejores Apps

Animaciones recreadas de Airbnb, Wise, Revolut, Tinder, Linear y más. Principios de Disney, Material 3 y las apps referentes en motion design del mercado.

Explora el Catálogo

Más de 50 animaciones exclusivas para suscriptores PRO.

Ver catálogo completo
@Composable
fun Anim() {
  animate...
}

CON LA CONFIANZA DE DESARROLLADORES EN

GOOGLEANDROIDKOTLINJETBRAINS