Resumen

  • El primer borrador público del W3C, de octubre de 2022, definió líneas de tiempo basadas en el progreso del desplazamiento y en la visibilidad de un elemento, capaces de mover una animación según la posición.
  • Los textos de 2023, llamados Scroll-driven Animations, desarrollaron ScrollTimeline, ViewTimeline y animation-timeline para conectar el recorrido del lector con la secuencia visual.

Un reportaje explica cómo crece una red y acompaña la explicación con un gráfico que se construye en pantalla. La primera vez, la animación dura lo justo para parecer brillante. El lector vuelve unas líneas para comprobar una cifra y encuentra el gráfico en su escena final. El reloj cumplió su cometido; el lector aún no. Una página que se lee hacia abajo y hacia arriba había dado el mando a un instrumento que solo sabe avanzar.

El primer borrador público del W3C, fechado el 25 de octubre de 2022, se titulaba Scroll-linked Animations. Separó dos formas de medir el viaje. Una línea de tiempo de progreso del desplazamiento va desde el extremo inicial hasta el final de un contenedor desplazable, entre cero y cien por ciento. Una línea de tiempo de progreso de vista sigue el paso de un elemento por la zona visible: entra, ocupa espacio y sale. La primera mira todo el pasillo; la segunda mira cuándo cruza la puerta un actor concreto.

Para un artículo largo, la diferencia es práctica. Una barra que señala cuánto queda por leer necesita conocer el recorrido general. Un dibujo situado a mitad de texto debe responder a su propia aparición. Si ambos dependen de segundos, el dibujo puede terminar mientras todavía está fuera de escena. Si dependen de la distancia pertinente, el lector puede detenerse, avanzar o regresar, y la imagen conserva el contexto. La página deja de perseguir un cronómetro que corre solo.

El borrador de trabajo del 8 de diciembre de 2022 desarrolló vías como scroll(), líneas de tiempo con nombre y propiedades ligadas a la vista. El navegador calcula el progreso a partir del desplazamiento o de la visibilidad. El sitio escoge qué cambia, en qué tramo y con qué intensidad. Si el contenedor no tiene recorrido desplazable, su línea de tiempo puede quedar inactiva. Un director necesita un escenario por el que se pueda caminar; no basta con dibujar flechas en el suelo.

El texto del 28 de abril de 2023 ya llevó el nombre Scroll-driven Animations. La palabra «guiadas» explica mejor la apuesta: el movimiento del lector conduce la animación, en lugar de servir solo como señal de salida. CSS puede enlazar el efecto con su línea de tiempo y las interfaces de Web Animations también pueden hacerlo. El navegador ofrece una medida común. El autor conserva las decisiones de escena.

El borrador del 6 de junio de 2023 describió ScrollTimeline, ViewTimeline y el enlace mediante animation-timeline. El progreso ocupa una extensión finita del desplazamiento. Una animación temporal pregunta cuánto durará; una animación de este tipo pregunta en qué parte del trayecto sucederá. Eso cambia la manera de escribirla. Una leyenda puede aparecer mientras su figura entra en la ventana; un mapa puede completarse al recorrer una sección. Si el lector retrocede, la secuencia puede acompañarlo de vuelta.

El historial de publicaciones del W3C sitúa el primer texto público en octubre de 2022 y las revisiones hasta junio de 2023. La posibilidad editorial es atractiva y peligrosa. Un gráfico cuya transformación acompaña una explicación ayuda a ver una relación. Una docena de titulares que hacen piruetas con cada giro de rueda convierten la lectura en un parque de atracciones. El navegador conoce la posición del lector. El editor debe saber por qué merece la pena mover algo.

El mejor efecto obedece sin presumir. El lector se detiene y el gráfico espera. Vuelve y la escena vuelve. Avanza y el argumento continúa. La barra de desplazamiento dirige la función; el reloj, por una vez, puede sentarse entre el público.