¿Cómo crear una animación que se mueva suavemente similar al GIF a continuación?
La animación en sí probablemente se creó en After Effects o alguna otra herramienta de animación. La clave de la suavidad es el tiempo de retraso del cuadro GIF.
La mayoría de las pantallas de computadora funcionan a 60 fps (fotogramas por segundo), por lo que las mejores velocidades de cuadro para una animación fluida son 60 fps y 30 fps, o incluso 15 fps si el movimiento es lento y está tratando de crear el archivo más pequeño posible.
El tiempo de la animación GIF se mide en centésimas de segundo, y los valores exactos correspondientes a las velocidades de cuadro que buscamos no son posibles. Sin embargo, la mayoría de los navegadores web felizmente animan los GIF en sincronización con la pantalla, utilizando retrasos de fotogramas redondeados hacia abajo. Los valores que buscamos son 2/100 para 60 fps (0,02 s en Photoshop), 3/100 para 30 fps (0,03 s en Photoshop) y 6/100 para 15 fps (0,06 s en Photoshop).
La mayoría de los GIF fluidos que has visto usan un retardo de cuadro de 0,02 s o 0,03 s, y esos son los valores que suelo usar también para el mío.
No puedo comentar sobre el comentario de spacer GIF, pero como dice Marc Edwards, el formato GIF especifica el retraso en 1/100 de segundo como un valor integral. Usar 0,02 s, 0,03 s o 0,06 s para el retraso es lo más cercano posible a las velocidades de cuadro estándar de 60, 30 o 15 fps.
Ultradragón
R. Arnone
lucas taylor