LottieFiles
0:000:00

Animación gratuita Pliops data constraint diagram

19.1 KB

Client wanted a vector animation and I thought a .JSON file would be fine. But they insisted on an SVG for final output, so as to use online. They didn't seem to know what a .JSON file was or how to embed it for their website. Anyway I created the the art in Adobe Illustrator based on their sketch. Used Overlord to transfer the vector into After Effects. Used Bodymovin to export as .JSON file. Finally I used the KeyShape app to export to .SVG. Challenges: Bodymovin doesn't seem to a lot of gradients. It also didn't like me using a loop expression. Sometimes the whole project would fall apart on export The tiny orbs racing on the lines were the biggest culprit and I had to rebuild them so Bodymovin would export. Once the .JSON was imported into KeyShape it glitched a bit too. All eventually turned out fine with a lot of finessing, rebuilding, and reimporting some of the art from Illustrator. So if you find yourself with a broken export, keep trying.

Client wanted a vector animation and I thought a .JSON file would be fine. But they insisted on an SVG for final output, so as to use online. They didn't seem to know what a .JSON file was or how to embed it for their website. Anyway I created the the art in Adobe Illustrator based on their sketch. Used Overlord to transfer the vector into After Effects. Used Bodymovin to export as .JSON file. Finally I used the KeyShape app to export to .SVG. Challenges: Bodymovin doesn't seem to a lot of gradients. It also didn't like me using a loop expression. Sometimes the whole project would fall apart on export The tiny orbs racing on the lines were the biggest culprit and I had to rebuild them so Bodymovin would export. Once the .JSON was imported into KeyShape it glitched a bit too. All eventually turned out fine with a lot of finessing, rebuilding, and reimporting some of the art from Illustrator. So if you find yourself with a broken export, keep trying.

Interacciones y complementos

Ver todo
figma
after-effects
framer
canva
webflow
wix

Gratis para usar bajo la Licencia Simple de Lottie

cookie

Usamos cookies para funciones esenciales del sitio web y para entender mejor cómo usas nuestro sitio, así podemos crear la mejor experiencia posible para ti ❤️