ESTUDIO DE IMÁGENES · CONTROL EDITORIAL

Image 2 Animation: del original al movimiento

Presenta fotografías con movimiento moderado, leyendas accesibles y revisiones guardadas. Un generador de recursos para superadministradores, con una demostración pública y una guía integral.

Versión de reproducción de imágenes. Exportación de vídeo, fondos generados por IA, colas automáticas e inserción en el editor de páginas pendientes; no se presentan como funciones instaladas.

Prueba la presentación

Aurora sobre un paisaje nocturno
8.0 s · primer recorrido

1. Demostración con el cartel de aurora existente del sitio; no es una imagen generada para este recurso.

Guía de Image 2 Animation

Qué hace Image 2 Animation

Image 2 Animation, o I2A, convierte una secuencia de fotografías en una presentación para el navegador con movimiento moderado, transiciones, leyendas y un enlace de destino opcional. Está pensado para el equipo de superadministración del sitio, no para cargas públicas sin restricciones. Esta página ofrece una demostración interactiva y una guía práctica; el Generador de Recursos de Contenido autenticado permite a los editores autorizados crear sus propios recursos. La demostración reutiliza imágenes existentes del sitio y no representa fotografía generada recientemente.

El flujo de imágenes instalado admite tres tipos de contenido: una secuencia fotográfica, un banner estático con enlace de acción y una comparación de dos imágenes. La secuencia utiliza una línea de tiempo determinista; la comparación ofrece un control deslizante etiquetado. Son presentaciones distintas de material aprobado, no herramientas para inventar pruebas de resultados. Elige el formato que comunique el mensaje con el menor movimiento innecesario. Una fotografía clara y una leyenda precisa pueden ser más útiles que un efecto elaborado.

Del lote de imágenes a una revisión guardada

Abre el Generador de Recursos de Contenido desde la navegación administrativa, escribe un título descriptivo y crea un recurso. Carga las fotografías en el orden deseado. Cada imagen aceptada aparece como una escena con texto alternativo, una leyenda visible opcional y una duración. Sustituye el texto derivado del nombre del archivo por una descripción útil antes de publicar. Utiliza Subir y Bajar para modificar el orden sin arrastrar y quita las escenas que no necesites. Quitar una escena no borra el original conservado ni modifica una revisión publicada anteriormente.

Después, selecciona la relación de aspecto, el fondo, el solapamiento y el zoom máximo. Revisa el reproductor, pausa los fotogramas importantes y lee las leyendas independientemente del movimiento. Guardar crea una revisión inmutable; publicar es una acción separada. Los cambios sin guardar impiden publicar desde el editor. Un borrador guardado puede coexistir con una versión pública anterior. Esta separación permite corregir una presentación futura sin reemplazar inmediatamente el contenido que ya ven los visitantes.

Comprender los selectores -KB y -top

El campo de comandos acepta /I2A, /i2a o el alias descriptivo Image 2 Animation. Añade -KB para seleccionar el movimiento fotográfico y -top para solicitar una presentación independiente ajustada al espacio disponible debajo de la navegación. El comando combinado es /I2A -KB -top. Los indicadores desconocidos o repetidos se rechazan en lugar de interpretarse mediante suposiciones. El comando se analiza como datos: no ejecuta instrucciones del sistema, no evalúa programas ni contacta con un modelo de lenguaje.

La especificación describe -KB como un fondo fotográfico con efecto Ken Burns, mezcla de transparencia de entrada y salida y vídeo completamente comprimido. Ese nombre identifica la familia de funciones solicitada, pero no demuestra que se haya exportado un vídeo. En esta versión, la salida habilitada es la reproducción mediante capas de imágenes. La generación de vídeo y sus controles de calidad permanecen inactivos. El editor guarda los valores concretos de duración y zoom junto al comando para que una revisión no dependa de futuros cambios de valores predeterminados.

Planificar el tiempo y las transiciones

La duración predeterminada de una escena es de ocho segundos, con un solapamiento de 1,2 segundos y una escala máxima de 1,12. El primer recorrido lineal equivale a la suma de las duraciones menos los solapamientos internos. El ciclo repetido también incluye la transición de la última escena a la primera. Son duraciones distintas, por lo que la interfaz identifica expresamente el primer recorrido. Cambiar la duración de una escena recalcula la línea temporal; no añade fotogramas artificiales ni depende de que la pantalla alcance una frecuencia determinada.

Una sola fotografía utiliza movimiento reversible en lugar de desvanecerse hacia una escena vacía. Con varias imágenes, mantén el solapamiento por debajo de la mitad de la duración de cada escena. Las leyendas extensas no deben imponer un límite de lectura: permanecen como texto normal debajo del reproductor. Anterior, Siguiente y Pausar permiten controlar la experiencia. Las preferencias de movimiento reducido y ahorro de datos mantienen una presentación estática. La reproducción empieza únicamente cuando el visitante elige Reproducir, evitando movimiento no solicitado.

Elegir fotografías y fondos adaptables

Utiliza imágenes propias o con autorización para publicarlas, incluyendo los permisos necesarios para personas reconocibles, marcas y trabajos de clientes. El cargador acepta imágenes compatibles de un solo fotograma en JPEG, PNG, WebP y AVIF después de validarlas mediante decodificación en el servidor. Rechaza SVG activo y archivos incompatibles o animados. Los límites configurados son cincuenta archivos por recurso, cincuenta MiB por archivo, quinientos MiB por lote y cien megapíxeles por original decodificado. La interfaz informa de los errores individuales; un archivo inválido no debe eliminar las imágenes ya aceptadas.

Las imágenes preparadas conservan sus proporciones, normalizan la orientación, omiten metadatos innecesarios y utilizan WebP sin pérdida después del redimensionamiento. El límite de entrega es de 3840 píxeles por lado, sin ampliar el original. Esto no recupera detalles inexistentes. Hay seis relaciones de composición, incluidas vertical y ultrapanorámica; el primer plano se contiene en lugar de estirarse. Un original desenfocado, un degradado de marca o un fondo sólido cubren el espacio restante. Estas composiciones no significan que se hayan aprobado recortes independientes para todos los dispositivos.

Originales privados y publicación controlada

Crear y editar recursos requiere la cuenta existente de superadministración. El servidor comprueba el rol actual de la cuenta, no un rol enviado por el navegador. El acceso de administrador ordinario no basta. Los originales y las imágenes preparadas se almacenan como objetos cifrados en la nube; las solicitudes de medios privados requieren autorización. El acceso público sirve únicamente imágenes preparadas que pertenecen a la revisión actualmente publicada. No expone el archivo original ni una dirección permanente del almacenamiento privado.

Publicar hace accesibles las imágenes preparadas y las leyendas seleccionadas mediante la página del recurso. Cualquier persona que vea contenido público puede guardar una copia. Retirar la publicación impide accesos posteriores a través de la aplicación, pero no recupera capturas, descargas o copias ya realizadas. Archivar también retira la publicación activa. Los originales se conservan para el historial en lugar de borrarse automáticamente. La limpieza automática y una interfaz completa de retención no están activas; no cargues material con plazos contractuales de eliminación que esta versión no pueda cumplir.

Tres aplicaciones prácticas del generador

Para una secuencia de portafolio, elige un pequeño conjunto de imágenes aprobadas, ordénalas de forma lógica y explica qué muestra cada una. Una leyenda útil identifica el trabajo sin inventar aprobación del cliente, mejoras de conversión o resultados de ventas. Añade un enlace a un caso de estudio existente solo cuando el destino corresponda realmente a las fotografías. Revisa toda la secuencia antes de publicarla, incluida la transición de la última imagen a la primera.

Para un banner estático, selecciona una fotografía y una acción concisa, como Explorar nuestras aplicaciones. La imagen permanece quieta y el enlace sigue siendo HTML accesible normal. Para una comparación antes/después, utiliza dos fotografías tomadas en condiciones comparables y explica diferencias relevantes de iluminación, ángulo, fecha o escala. El control revela las imágenes; no demuestra causalidad ni valida de manera independiente una mejora afirmada. Conserva una descripción equivalente fuera de la comparación para que el significado esté disponible incluso cuando no se pueden utilizar las imágenes.

Guardar, publicar, restaurar y archivar

Una revisión conserva el orden de las escenas, las descripciones, los tiempos, el tipo de presentación y el enlace de destino. Guardar otra revisión no reescribe la anterior. Publicar selecciona una versión guardada; restaurar selecciona una revisión previa como salida pública activa. Revisa el título y las leyendas después de cambiar de versión y abre la página pública para comprobar qué recibe el visitante. La interfaz actual proporciona una página independiente del recurso, no inserción automática en secciones arbitrarias de páginas existentes.

El servidor rechaza guardados obsoletos cuando otra operación ha cambiado la revisión esperada. Si aparece un conflicto, vuelve a cargar el recurso guardado antes de continuar, en lugar de enviar repetidamente un formulario antiguo. Cargar otro recurso descarta los cambios sin guardar, como indica la etiqueta del selector. Archivar es una acción reversible que también retira la publicación; no equivale a eliminar permanentemente. La aplicación conserva un registro de creación, cargas, revisiones y operaciones de publicación. No debe presentarse como una auditoría de cumplimiento certificada de forma independiente.

Revisar accesibilidad y comodidad de lectura

La animación debe apoyar el contenido, no sustituirlo. Mantén las explicaciones esenciales, las leyendas y los enlaces fuera de la capa de imagen en movimiento. Escribe texto alternativo que describa información visual útil, sin llenarlo de palabras clave repetidas. Evita insertar párrafos dentro de una imagen esperando que el zoom los vuelva legibles. La leyenda puede explicar el contexto mientras el texto alternativo describe la fotografía; no necesitan repetir exactamente las mismas palabras.

Prueba la presentación con teclado, con anchura de teléfono y con movimiento reducido. Comprueba que la navegación no tape el primer título, que los controles sigan siendo accesibles y que los retratos sean reconocibles en una composición horizontal. La pantalla completa es una función del navegador activada por el usuario y puede no estar disponible dentro de una vista incrustada; el reproductor normal sigue funcionando. La existencia de estos controles no constituye una afirmación de conformidad completa de accesibilidad. Las decisiones de contenido, el navegador y la página que rodea al recurso necesitan revisión.

Límites de la versión, calidad y solución de problemas

Esta versión no crea fotografía nueva ni envía cargas silenciosamente a un proveedor de IA. Todavía no activa exportaciones de vídeo comprimido, mediciones independientes de SSIM o VMAF, ampliación generativa de fondos, procesos duraderos de preparación ni un sistema general de inserción en espacios de páginas. Los objetivos de calidad de la especificación son criterios de aceptación para futuras exportaciones, no puntuaciones obtenidas por el reproductor. Codificar sin pérdida una imagen preparada no equivale a conservar todos los píxeles de un original redimensionado.

Si una carga falla, comprueba el formato, el tamaño y las dimensiones decodificadas antes de repetirla. Si la reproducción permanece estática, revisa Pausar, movimiento reducido y ahorro de datos. Si no puedes publicar, guarda los cambios, proporciona una imagen y completa las comparaciones con exactamente dos escenas. Comprueba que todo enlace configurado tenga una etiqueta legible. Los errores de red y del servidor se notifican, sin sustituirlos por confirmaciones falsas. El catálogo de sesenta tipos del documento suministrado sigue siendo una hoja de ruta, no una lista de herramientas instaladas.

Referencias y fundamento editorial

Las funciones descritas se basan en esta implementación y en la especificación suministrada por Michael Aaron Loftus. Las referencias de navegador explican las APIs, no certifican el rendimiento ni la calidad visual de este recurso.

  1. MDN: requestAnimationFrame
  2. MDN: prefers-reduced-motion
  3. W3C: Pausar, detener, ocultar

Continúa explorando

Diseña una paleta con Prismatica · Desarrollo de aplicaciones a medida · Habla de tu proyecto