Loop Animation For XD

[WafaeChan]

Hello Everyone,

I want to know if there is a way to create a loop animation (autoplay not triggered by anything), especially that we can't use animated GIF or SVG, I tried Time trigger but if works only with artboard not with components in 1 single artboard (or maybe it's possible and I still don't know how)...

I don't want to use plugins,  I want to know if this is possible using only Adobe XD...

I watched adobe videos, but they show only how to do them in seperated artboards... I want to do all the animations I need in 1 single artboard, or if possible use CSS and Javascript myself, is there a way?

Thank you all

Peace

[creative explorer]

@WafaeChan you can't use CSS and JavaScript in Xd. Adobe XD is primarily a design tool, not a coding environment.

It's designed for creating visual prototypes and user interfaces, not for writing and executing code. 

I was going to suggest 'Lottie' plugins. But, you don't want to use. 
You can't use SVG in XD? Yes, you can. My students and I do all the time. 

What exactly are you you trying to animate?

[WafaeChan]

Thank you so much for you reply!

I know SVG can be used in XD, but what about animated SVG? because when I add them to my work and click Preview it doesn't work... Is there a way? I mean like loading animation or even animating a PNG photo without any interaction like click or scroll...

It's a very basic animation like going up and down in a 1s loop, really simple...

Thank you again.

[creative explorer]

@WafaeChan yes XD supports importing and working with animated SVG files. Or if you use Lottie Files, you can place .json files in as well...see the animated.mov balls that go up and down. 

You can even import a YouTube video and have it looping as well. 

Also, you can create transitions with auto-animate with a bounce versus easing in or out.

[WafaeChan]

Please do you have a tutorial for adding animated SVGs in Adobe XD?

Because when I add them, they're not animated...

Thank you again!