I'm working on a school project which includes three artboards that I'm auto-animating between.
The first board has two images hidden under text, the second board has one of the images moving to the top of the text box it was behind, and the third board has the second image moved to the top of the text box it was behind.
The naming of all the items and groups is identical and the hierarchy of naming is also identical.
I've got them wired using time as the trigger with a delay of 1 second.
When I start the preview from the first artboard of the 3, everything is working perfectly.
When I preview the whole project (all 18 of the artboards) the animation doesn't work at all and it is only showing the first artboard of these three.
Everything else is working fine. I've checked and re-checked everything I can think of and have read through all other suggested fixes I've found online, but nothing seems to be working. I've got the latest version of XD. Any help is appreciated!
Hi @Mary24827049qusp ,
Thank you for reaching out. Various factors could affect this, so would you mind sharing a few screenshots of how the design looks in Prototype mode? If possible, please share the link so that we can test it on our end. You can also share these details through DM by clicking on my name.
Thanks for checking in. I've just sent you a DM with the link for the prototype.
Here's a shot of the three artboards that I'm having the issue with - they are the "penalty" boards:
Basically, the image on the left is supposed to rise up, then the one on the right.
I was attempting to do a similar thing with another page, but if I can't get this working, then I'll have to change the design. I originally set the whole thing up using component states, but then when I went to wire it I could only choose tap or hover as triggers, and I want this to trigger when the page launches.
Thanks very much for your help.
Hi Mary, did you manage to get this resolved? If you did, feel free to share what the issue was, so others who face the same problem in the future will know how to fix it.
No, sadly I did not resolve this problem. I couldn't figure it out, my teacher couldn't figure it out, and no one else managed to figure it out.
In the end, I wound up rebuilding the artboards and redesigning them so that they didn't have a timed auto-animation feature. It's OK, but I like the original design better.
There are a lot of great options in XD, but it would be nice if they added an option for a timed trigger with component states rather than just hover or tap. Actually, it would be nice if using component states took over from auto animation so that you didn't have to make so many artboards.
If you'd still like to get this resolved, I can have a look as well if you send me the file. I managed to recreate something similar in my own file and things worked fine. Seems like there's something wrong with the transition leading to the first of the 3 screens, that breaks the timed transition when you're previewing the whole thing.
It's possible to use a time transition with component states using an empty lottie file "hack". You can switch to different states (even loop through them) or artboards. If you'd like to know how to do it, check out my reply in this thread (it has an empty lottie file so you don't have to make one yourself), and also this thread which has another sample file with a different action.
Thank you so much!
I've bookmarked your post about the Lottie hack so that I can check it out when I start my next term. For now, I don't have the time to fiddle around with rebuilding and figuring out the transition issue with these pages - my assignment is due soon and I've just got to get it finished - but I will definitely check this out for future projects.