Sticky Text Fade

Las palabras de un párrafo pasan de atenuadas a opacidad total a medida que el usuario hace scroll.

Añade un efecto "Text Reveal" (también llamado scroll text reveal o word-by-word reveal) en [dónde].
El párrafo debe empezar atenuado y, a medida que el usuario hace scroll, cada palabra debe iluminarse del todo una tras otra, vinculada a la posición del scroll.
Al volver a subir, las palabras deben atenuarse de nuevo, y el párrafo completo debe seguir disponible para los lectores de pantalla sea cual sea su atenuación.

Un elemento se queda fijo en su sitio durante un tramo del scroll mientras el resto del contenido o la animación avanza.

Añade un efecto de scroll "Pinning" (también llamado pinned section o sticky section) en [dónde].
Un panel debe quedarse fijo en su sitio mientras el contenido de al lado pasa con el scroll, cambiando según el paso que se está leyendo, y debe soltarse cuando termine la sección.
Prefiere el posicionamiento sticky nativo en lugar de secuestrar el scroll, y asegúrate de que cada paso se lea bien sin el panel fijo en pantallas pequeñas.

El progreso de la animación está ligado directamente a la posición del scroll, así que al avanzar o retroceder se reproduce o se rebobina.

Añade una "Scroll-Linked Animation" (también llamada scroll-driven animation o scroll scrub) en [dónde].
La animación debe moverse exactamente con la posición del scroll: al bajar avanza y al subir se rebobina al instante, sin un suavizado temporal propio.
Asigna toda la animación a un tramo de scroll claro y muestra un estado estático razonable si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Los contornos de las letras se dibujan como un trazo antes de que aparezca el relleno.

Añade un efecto "Stroke Text Draw" (también llamado draw in text o animated stroke text) en [dónde].
Los contornos de las letras deben dibujarse solos con suavidad y, una vez completos, el relleno debe aparecer con un fundido.
Reprodúcelo una sola vez al cargar, mantén la palabra accesible como texto real y muestra el texto ya relleno si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Las letras o palabras giran en 3D sobre un eje para mostrar el siguiente texto en su cara trasera.

Añade un efecto hover "Text 3D Flip" (también llamado 3D flip text reveal) en [dónde].
Cuando el puntero esté sobre el texto, cada letra debe girar en 3D sobre su eje horizontal para mostrar una letra nueva en su otra cara, una tras otra en un barrido rápido y suave, y volver cuando el puntero salga.
Mantén el mismo tamaño de la caja de texto durante el giro y muestra el mismo efecto con el foco del teclado.

El texto se deforma y ondula de forma orgánica, impulsado por el scroll o el movimiento del puntero.

Añade un efecto "Text Distortion" (también llamado organic text distortion) en [dónde].
Una fila de texto debe fluir de lado sin fin y deformarse y ondular de forma orgánica mientras se mueve, como vista a través de agua en movimiento, con el flujo impulsado por el scroll del usuario.
Mantén la distorsión lo bastante ligera para que el texto siga siendo legible, que vaya fluida en dispositivos más lentos y desactívala si el usuario prefiere movimiento reducido (prefers-reduced-motion).