Skip to main content
W
WafaeChan
Participant
August 20, 2024
Question

Loop Animation For XD

  • August 20, 2024
  • 1 reply
  • 1404 views

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

This topic has been closed for replies.

1 reply

creative explorer
Community Expert
creative explorerCommunity Expert
Community Expert
August 20, 2024

@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?
m
W
WafaeChanAuthor
Participant
August 21, 2024

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
Community Expert
creative explorerCommunity Expert
Community Expert
August 22, 2024

@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.

m
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices