ANIMACIONES SVG para WordPress y ELEMENTOR con After Effects - Tutorial Efectos Visuales #4

[@cronicasdelsur]

Hay cosas que no se explican en muchos tutoriales que vi hasta llegar a éste que es por mucho el más claro. Gracias

[@crisarrucha5248]

Muy bien allí gracias por el tuto. Si de casualidad a alguien le falla la exportación deben ir a Editar/preferencias/scripts y extensiones/activar la opción de "Permitir que las secuencias de comandos puedan escribir archivos y acceder a a la red"

[@aaronfeijoo]

ACABO DE CONOCER A DIOS! GRACIAS GRACIAS JAJAJAJA tengo años diseñando páginas en elementor y no tenía idea de que se podían hacer cosas así, y casualmente también soy animador con after effects xD a partir de ahora voy a hacer cada desastre en mis webs JAJAJAJA Gracias bro, nuevo sub

[@jacobosanchezmarketingdigi1326]

sabes porque me crea un fondo gris cuando hago el cambio a trazos en affter effects y no lo puedo eliminar

[@steven.lizcano]

Hola Aron, has hecho algún efecto?

[@aaronfeijoo]

Tengo pendiente hacer algo de esto para mí web, no he tenido tiempo de jugar con estos efectos por el trabajo. Hay muchas cosas que quiero probar y practicar, esto te abre un abanico de posibilidades :)

[@javiercifuentes8242]

Saludos Yannick cada vídeo tuyo vale oro

[@365DiasMx]

Excelente la informción, la explicación y, vaya, que no queda más que ir a aplicarlo. Gracias, desde México

[@felipeselfene7836]

Dios mio que gran tuto, muchas felicitaciones y saludos que estés bien.

[@rendher]

Este hombre es bueno, hay que decirlo se ve que sabe de lo que habla.

[@tipoidarraga]

Maldito genio, con tan poco haces cosas gigantes

Asombrosamente práctico , sencillo pero con mucha potencia el efecto final. Muchas gracias y felicitaciones.

[@theredmaster_superbee]

Por fin Elementor integró un plugin para Lottie con opciones increíbles como activar las animaciones con el scroll... esa opción era lo que me mantenía aferrado a Adobe Animate y Muse... pero con esta gran integración de Elementor con ese nuevo complemento nativo ya no puedo pedir más... soy muuuy feliz jajajaja sólo falta que Adobe Animate genere ya .json y la vida sería pura felicidad...

[@oscar_alopez]

Eres grande hermano excelente tuto, me has ayudado como no tienes idea. Muchas graciasssss!!!! Bendiciones

[@Cesarcs1cl]

me has cagado.. conectaste 2 cosas q se utilizar, pero q no había visualizado ni siquiera pensado en usarlas combinadas.. sos un capo!!!!

[@siscusix]

Eres un genio tio!! muchisimas gracias por este tuto!!!! Un abrazo!!

[@SoySaulTV]

Gracias por toda la información que aportas en tu canal he aprendido mucho contigo! Espero que está información pueda aplicarla dentro de poco en mis proyectos, muy agradecido!

[@miguell.4424]

Información digna para desarrollar una pagina ganadora de un awwwards, ví que hay forma de hacer scroll y que se vaya haciendo la animación, igual que se puede hacer interactiva, ojalá hicieras un tuto sobre el tema

[@omardref]

Excelente amigo! gracias por compartir tus conocimientos con la comunidad. Un saludo!!.

[@tribulibre]

Uyyy que pasada, más vídeos así, mola, muy visualll. Elementos+diseño

[@videotransmisiones2]

Creo que te amo. Me suscribo geniooo!!!

[@situacion1]

Jeje, que bueno. Difícil de aplicar, pero la imaginación está para eso. Gracias

[@luismarquez2757]

Saludos desde Venezuela. Muchas gracias por el video tutorial, te ha quedado genial. Voy a crear algunas animaciones y lo probaré, cualquier cosa pasaré por acá y preguntaré.

[@EliasGomezSainz]

Muy bueno maestro, a ver si puedo usarlo en alguno de mis desarrollos. Bendiciones!

[@srta.melitona6258]

Muy máquina!!

Te sigues superando. Buenísimo. Muchas gracias.

[@danielvillarealtriana9534]

Era lo que buscaba hace mucho!!!

[@eruzurita]

Muchas gracias

[@estefaniafobos6404]

que cosa máaaaaaaas chula!

[@josearizaca_audiovisual]

Genial yo quiero hacer una rueda animada en after y luego los hospots

[@fitnessol271]

Justo lo que estaba buscando muchasss gracias

[@TheStraycatsCartoon]

Super tutorial muy útil, muchas gracias🌟🌟🌟🌟🌟

[@catalizastudio]

Increíble!! Gracias!

[@yeimykarinavalenciapasaje4837]

QUIERO APRENDER REALMENTE HA REALIZARLE DISEÑOS MUY BONITOS Y DINÁMICOS A LAS APLICACIONES

[@caroloko9]

Gracias por el tuto! ¿Podrías hacer un tutorial sobre como hacer un checkout sin salir de la pagina con elementor? Es decir añadir al carrito/carrito/shipping address/ credit card. Haciendo aparecer secciones sin redirigir al cliente a otras paginas. Un saludo

[@fernandocorreamorales1695]

Nuevo suscriptor

[@CreativeDesignPE]

yaaaay! wonderful

[@yerkosalinas7078]

MAESTRO!!!.. una pregunta, ¿como se llama la extension de chrome que usas al final del video? ya que estuvo muy didactivo y claro el video no tengo dudas de hacer el cohete (=.

[@hectorb.calles5943]

wAAAWWw buenisimooo!!!

[@joseleondanielsgrafico]

eres el mejor bro me ayudaste un montón te ganaste este suscriptor con me gusta y campanita activa lastima que soy pobre no te puedo ayudar con el contenido premium haajajajaajaja

[@juanperezweb]

chevere! una duda, puede ser responsive?

[@PatricioAsencio]

Gracias, siempre un agrado. Un abrazo.

[@EternalWorddotorg]

Excelentes tutoriales, muy buenos, bendiciones

[@pedromayanga9279]

Grande Yannick!!! siempre interesante tus videos

[@hblsnider]

🔥🔥🔥🔥

[@gonzaloala27]

Sencillamente Impresionante Yannick, gracias por compartir. Como puedo mejorar la velocidad de cargue de un banner principal de un video de 15 segundos , utilice youtube pero se demora. Gracias de antemano por el dato.

[@elliot1277]

Se pueden usar curvas para suavizar las animaciones en after fx? Osea, es compatible después en el css?

[@gocent4544]

me suscribo master

[@yan_lmb]

¡Gracias!

[@leonardohoyos1997]

Eres la ostia tio

[@AdianRodriguez]

Excelente aporte !!

[@thejoeroganexperiencepodcast]

Awesome tutorial, dude !

[@Antu__tattoo]

genial amigo muchas gracias la oshtia !

[@franciscocastagnola3197]

Buenas!! Muy claro el paso a paso y muy buena propuesta, pero... no he podido renderizar. Y me estoy volviendo loco probando todas las opciones revisando el archivo .aep mil veces. Sera que este bodymovin ya ha quedado obsoleto? Si tienes ide de esto se agradeceria un monton!! Gracias

[@MrSastoman]

amigo cuando ejecuto el paso que mencionas en el minuto 07:45 la figura se convierte en un rectangulo gris... sabes como arreglarlo? gracias!

[@zakuragui2011]

Excelente tutorial, felicitaciones, y una consulta, la animación puede ir encima de texto? Ejemplo, una nube yendo de izq a derecha sobre texto atrás?

[@pitrubio]

Hola.. Un par de cosas. 1. También se puede importar el archivo json con el widget de Lottie o con enlace directo cargado desde lottiefiles.com. 2. Del efecto de texto, si se puede. Colocas en una sección con dos widgets: texto y lottie dentro de su columna. En el widget lottie, darle propiedad de position absolute y al texto propiedades de efectos de movimiento, activando efecto de scroll o de ratón, según lo que desees. :)

[@lizethordonez5044]

Si animo un texto, al cambiarle el idioma a mi sitio web cambiaria tambien el texto de la animación?

[@pruebas1537]

Una consulta yo vi en una página web que pudieron música ni bien le di click a la página web se escuchó una canción de fondo y estoy buscando un tutorial que me enseñe. Por cierto excelente canal

[@mariof7384]

¿qué tal va con lottie este tipo de animaciones o es algo diferente?

[@MrSINCLAIRE80]

Amigo tengo una consulta. donde te puedo contactar ?

[@mariomendoza5998]

hola muy buen video. tengo un problema a mi se me exporta con fondo blanco y no tengo nada.

[@douglasmatos3227]

Genial!

[@hasenmatt]

este plugin wp bodymovin no existe más. Algun otro que recomiendes??

[@selmanfit]

Hola, sabes por qué razón no funcionan las animaciones con gradientes? Le he dado mil vueltas y me sale un color sólido siempre.

[@theredmaster_superbee]

¿se puede hacer con animaciones de adobe animate? pero quisiera controlar la reproducción con el scroll del navegador... ¿se puede incrustar una animación html 5 y controlar con la misma barra del navegador?

[@ainhoazapata1217]

La extensión bodymovin me aparece en after effects pero no me reconoce las composiciones,,,,, alguien sabe que puede suceder??

[@nicolaspc5020]

Hola amigo muchas gracias por la info, cuando le doy renderizar, se me exporta pero sin el movimiento, tienes idea como puedo solucionarlo?

[@ares1629]

Felicitaciones por el tutorial, Pero tengo un problema a la hora de convertir en html me exporta con un cuadro Negro no se ve la animación., que puedo hacer ?

[@nicolaspc5020]

me pasa lo mismo, pudiste solucionarlo?

[@ainhoazapata1217]

El tutorial es muy bueno, pero lo he instalado en after effects con. el ZXPinstaller , me aparece en Ventana de after effects, pero No me reconoce las composiciones que hago en la línea de tiempo....¿ALGUNA AYUDA? gracias por todo un saludo.....

[@crisarrucha5248]

Ya sé que ya pasaron dos años, pero se arregla solo guardando el archivo antes de abrir el plugin

[@samuelrojas7198]

hola ,como puedo ponerle una animación de pág. , ósea q la pág. baje por si sola al dejar el cursor quieto en determinado tiempo atudaaa plis...

[@enggment2764]

No me funciona el Jet Tricks, sabrás por qué sucede que al implementar el codigo Json no lo toma tal cual lo configuré?

[@diegocastrillon2738]

no me sale la composition en la ventana de body, que puedo hacer?

[@diegoortegon-nogetro-127]

para que desactivas la opcion de los plugs? seguridad, uso?

[@germanixtla6056]

Excelente video... una pregunta, que tanto afecta la carga de mi sitio con estos efectos, baja mucho el rendimiento del servidor...... ¿?

[@yan_lmb]

He hecho pruebas y si haces animaciones 2D las aguanta perfectamente. Ahora bien, si empiezas a meter muchos efectos como desenfoques, partículas, multicapas, etc empieza a ser difícil de cargar en dispositivos antiguos. Pero va a depender más del dispositivo o smartphone que del servidor (¡a no ser que llenes toda tu web de cohetes!)

[@estephanilazosanchez8038]

Hola la animación se exporta menos de un segundo, hay alguna forma de configurarla para que dure ¿unos segundos más?

[@proibarra1795]

Hola tengo un problema al exportar la demo, que es que se crea una carpeta de imagen. Lo cual ase que el código HTML no puedo usarlo porque busca los materiales de esa carpeta. Alguna solución o ayuda .

[@creepybunny2076]

No me aparece en mi photoshop la ventana "extensiones"

[@riquelmer]

Todo bien pero a la hora de hacer eñ render del bodymovie no me hace los archivos

[@NeroGS]

Hola amigo, buen día, al momento de exportar se modifican las proporciones y me mueve los elementos, sabrás porque ?

[@emmanuelflores7118]

como se hace las animaciones de las cartas de tarot para la web?

[@jacobosanchezmarketingdigi1326]

como insertar un logo animado en el header en elementor seria bueno he estado buscando y no encuentro nada

[@Adrian-xk7cm]

es necesario Elementor PRO para insertar este tipo de animaciones?

[@yan_lmb]

Lo importante es el codigo resultante. Puedes insertarlo en cualquier editor HTML

[@Adrian-xk7cm]

@@yan_lmb tus vídeos merecen más visitas, gracias amigo!

[@acokanmedia]

Hola!! gracias por el video! sabes que no puedo hacerlo con ninguna de las dos opciones. En la primer opcion cuando cargo el codigo me queda el codigo cargado pero nunca aparece mi animacion, solo aparecen los codigos. Y con la segunda opcion aparece como si el archivo esta roto, osea aparece una animacion pero sin la imagen. Muchas gracias. Luna.

[@joaquincastaneira]

yo igual

[@MartinS-zk9fr]

Se puede hacer lo mismo con Divi?

[@yan_lmb]

Si, solo tienes que utilizar un bloque de Lottie para Divi o WordPress. Este que te dejo es uno, pero hay más, incluso alguno gratuito para WP. divisupreme.com/features/divi-lottie-module/

[@MartinS-zk9fr]

@@yan_lmb gracias por responder! Creé un Lottie con After, en la preview del DEMO html se ve perfecto, pero cuando lo cargo en DIVI con el LOTTIE Supreme o NextLottie se ve todo mal, como una gran mancha. Por qué puede ser?

[@artecomparte1055]

Lo he hecho con el metodo HTML de Elementor, el primero que comentas, sin descargar ese plugin y en el editor se ve la animación pero luego previsualizo y me sale el código escrito en texto, cierro el Elementor, lo vuelvo a abrir para editar y solo se ve código como en la previsualización.... Ayudaa xD

[@dein4919]

yo seleccione algunas imagenes paraq la animación , y no me salen uando lo coloco en elenmetor uwu

[@yeimykarinavalenciapasaje4837]

PORFAVOR QUIERE VER EL VIDEO PASO A PASO DE COMO HIZO EL COHETE EN ILLUSTRATOR Y EXPLICASTES SUPER RAPITO DE COMO HACER LA ANIMACION

[@rodrigoalvarezjarrin5327]

Amigo me encantó este tutorial, pero tengo un problema. Al momento de exportar el archivo me voy a bodymovin, pero la opción de renderizar aparece desactivada, al igual que la opción de elegir el destino .... alguna posible causa o solución? muchas gracias de antemano.

[@yan_lmb]

Hola amigo Rodrigo, no sabría decirte. Lo mejor es que vayas a la pestaña comments o incluso a los foros de la web de aescripts > quizás ahí te puedan dar solución aescripts.com/bodymovin/ siento de veras no saber la respuesta a tu problema.

[@elisamadina]

Hola Yannick, tengo un problema porque intento exportar con bodymovin, y me sale Render Failed. Yo tengo Aftereffects CC2018. Sabes cual es el problema?, porque he seguido todos tus pasos pero ahi ya no me deja seguir. Saludos

[@yan_lmb]

Hola Elisa, pues no tengo ni idea. No hay mucha documentación sobre esto. Yo si fuera tú, intentaria mirar (y preguntar) en el git de bodymovin github.com/airbnb/lottie-web/issues/1663 Ya siento no poder decirte más 🙏

[@elisamadina]

@@yan_lmb Muchas gracias por la informacion. Lo que se me esta ocurriendo es que sea porque es una foto, y no es un elemento vectorial. Podria ser por eso?

[@nicolaspc5020]

@@elisamadina Hola, me pasa exactamente lo mismo. Lo has podido solucionar? Muchas gracias

[@elisamadina]

@@nicolaspc5020 Hola, que va no lo logre. Espero que tu tengas mas suerte

[@webserviceargentina7025]

jaja Yannick que pena que no puedas ver las caras de envidia que ponemos al saber que puedes hacer ésto en una mañana! jajaja es como un hotel ALL INCLUSIVE jajaj

[@OlivaresVelluttini]

Soy el único que le sale que el render ha fallado(seguí todos los pasos), quisiera saber porqué, me sería de mucha ayuda.

[@hablemosenseo]

"AE editar> preferencias> general> secuencias de comandos y expresiones y luego permitir que las secuencias de comandos escriban archivos y accedan a la red".

[@Georgikiller]

Amigo me da este error al darle render: Could not export files Is Preferences > Scripting & Expressions > Allow Scripts to Write Files and Access Network enabled? Sabra que podra ser???

[@johanmartinez9589]

Llego tarde pero lo que tienes que hacer es irte a Editar

[@freddyblanco4449]

tengo problemas con bodymovin... me sale Render failed :c Que hago?

[@ronaldpoblete6845]

Ingresa a preferencias de AE; Luego haz clic en "Scripts y expresiones" y luego activa la casilla "Permitir que las secuencias de comandos puedan escribir archivos y acceder a la red" y listo. Espero te pueda servir.

[@Jatoline_]

me sale error cuando hago el render u,u

[@saidjauregui7329]

el bodymovin no funciona

[@nicolaspc5020]

a Hola, me pasa exactamente lo mismo. Lo has podido solucionar? Muchas gracias

[@frankpilco4763]

NO ES COMPATIBLE CORRECTAMENTE CON CC 2015 OJO