¿Bodymoving es una buena idea para animaciones web?

En nuestra nueva página de "cómo funciona" queremos utilizar gráficos animados para explicar mejor algunos conceptos de nuestro servicio. No tenemos experiencia con animaciones más complejas y decidimos probar Bodymovin, ya que crear las animaciones en After Effects ahorra valiosos recursos de desarrollo. Sin embargo, algunos de los elementos visuales deberán cambiar su tamaño y diseño, según la ventana gráfica.

Ahora nos preguntamos, si Bodymovin es la opción correcta: ¿Es posible acceder de alguna manera al SVG y cambiar esas propiedades manteniendo la animación intacta? ¿O necesitamos un SVG (ligeramente) diferente para cada ventana gráfica, cada una con su propio archivo de animación Bodymovin json? Porque en este caso esta página va a ser enorme...

En general: si tiene alguna sugerencia, mejores prácticas, ejemplos de la vida de Bodymovin, estaría muy agradecido de revisarlos.

¿No es esta una pregunta para el soporte de BodyMov?
Idk, ¿hay algo como el soporte de Bodymovin? Después de todo, es solo una extensión AE... pero lo comprobaré. Mi esperanza era que alguien más ya tuviera este problema y lo resolviera. O al menos puede responder a mi pregunta.
Esto definitivamente es más una pregunta de soporte que una pregunta de diseño. Será mejor que pregunte a los desarrolladores de complementos en lugar de a nosotros: aescripts.com/bodymovin
Esta es una pregunta de "producto real": estoy buscando personas que hayan probado Bodymovin y tengan experiencia con él. Eso es "diseño de producto".
"Consejos generales sobre bodymovin" es una solicitud demasiado amplia para un sitio seguro de preguntas y respuestas como GD. Sí, Bodymovin puede responder si lo haces bien. Puede que no sea la mejor opción. Vea el comentario anterior para ayudarlo a pensar en sus opciones
Piensas que pedir experiencia de la vida real con Bodymovin con respecto a mis 2, 3 preguntas específicas es demasiado amplio, pero enlazas a una pregunta que es literalmente "¿¿Cuál es la mejor manera de animar una ilustración para la web?" :D Pero gracias por el enlace, parece un gran resumen. Por cierto... fuimos con GSAP.
@fgrau la pregunta vinculada al menos tenía un ejemplo de algo que estaban tratando de ilustrar, pero estoy más o menos de acuerdo contigo en que es un poco amplio

Respuestas (2)

Bodymovin es lo mejor que puedes encontrar si buscas animar animaciones simples o incluso complejas. No necesita mucho trabajo de desarrollo, el complemento en sí tiene una opción de renderizado que le permite escupir el código, incluso el código .json para usarlo en aplicaciones IOS o también aplicaciones Android.

Pero asegúrese de que sus svg no tengan degradados. Lottie no puede exportar degradados y bordes suaves

Aquí está la hoja de exportaciones.

ingrese la descripción de la imagen aquí

Así que sí, pruébalo.

Personalmente, lo usé para incorporarme a la aplicación Fox Sports NRL.

https://dribbble.com/shots/4162353-Onboarding-Animación

Lo siento, pero esto no responde a mi pregunta. Mi pregunta es, si necesito varias imágenes clave (y animaciones) para diferentes ventanas gráficas, si el tamaño más pequeño de las ventanas gráficas exige un cambio de diseño dentro de esas imágenes clave.
Lo siento, no entiendo a qué te refieres con elementos visuales y puntos de vista clave. ¿Puedes vincularme un ejemplo de lo que quieres crear?
La "ventana gráfica" es el área visible de un sitio web dentro de una ventana del navegador; con "elementos visuales clave" me refiero a algún tipo de elemento gráfico que se coloca en el sitio web. Tome cualquier página de producto en Dribbble con el diseño alternativo habitual de "texto a la izquierda - imagen a la derecha": cuando se trata de un sitio receptivo y la ventana gráfica se vuelve más estrecha, las imágenes ya no tienen tanto espacio y deben cambiar.
¡Ah, claro, te tengo! Google Web Designer es lo que estás buscando, lo detecta automáticamente. Wheres Bodymovin tiene el tamaño que usted crea y el punto de vista no cambia.

Hay otra gran herramienta que podría cubrir todas sus necesidades. Me refiero a Google Web Designer .

Con esta herramienta puedes construir

  • diseños receptivos
  • usar componentes
  • eventos de llamada
  • usa varias paginas
  • animar en 2D y 3D

y mucho más Definitivamente deberías probar esta herramienta.

Y lo olvidé: puede usar reglas de medios que se adapten a su pregunta sobre las ventanas gráficas.
Parece ser más un anuncio que una solución para la pregunta dada ...
¿Bodymoving es una buena idea para animaciones web?
RespuestasAquíPolítica de privacidad1y, 0v