Highlighted

Auto-Animate between different components

New Here ,
Jun 24, 2019

Copy link to clipboard

Copied

Hi,

I tried looking for a way, but couldn't find any solution or any info in general on this subject, and I couldn't figure out any working solution on my own as well.

If I have 2 states of an element on my page and I create a separate master component for each of these states, because let's say the states are fairly different and I don't want to change the states every single time I use them if I create a single master component for the element.

Then I want to auto-animate them from one artboard to another.

But the problem seems that Adobe XD doesn't know how to animate properties between components even though they have the exact same structure/layers/objects/names and only the positions of the objects are different from one "state" component to another.


It does animate, but only does the fade over effect.

If I don't use separate components it works perfectly, the elements move nicely to their new position.

Is there a way to make this happen at all at the moment? Or is this a feature which is planned?

Does anyone have any more info on this?

Current animation between separate components with auto-animate:

Wanted animation, as possible with same component or using no component at all with auto-animate:

Hi Chris, thanks for sharing the details. This behavior looks as designed, please check the point 1 under " Before you begin" here: - Auto-animate in XD.​ You can say that it works on instances only, as in test with component A in your last video.

Feel free to submit your feedback here: - Adobe XD Feedback : Feature Requests & Bugs and share the thread so that we may keep track of it.

Thanks,

Atul_Saini

Views

229

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Auto-Animate between different components

New Here ,
Jun 24, 2019

Copy link to clipboard

Copied

Hi,

I tried looking for a way, but couldn't find any solution or any info in general on this subject, and I couldn't figure out any working solution on my own as well.

If I have 2 states of an element on my page and I create a separate master component for each of these states, because let's say the states are fairly different and I don't want to change the states every single time I use them if I create a single master component for the element.

Then I want to auto-animate them from one artboard to another.

But the problem seems that Adobe XD doesn't know how to animate properties between components even though they have the exact same structure/layers/objects/names and only the positions of the objects are different from one "state" component to another.


It does animate, but only does the fade over effect.

If I don't use separate components it works perfectly, the elements move nicely to their new position.

Is there a way to make this happen at all at the moment? Or is this a feature which is planned?

Does anyone have any more info on this?

Current animation between separate components with auto-animate:

Wanted animation, as possible with same component or using no component at all with auto-animate:

Hi Chris, thanks for sharing the details. This behavior looks as designed, please check the point 1 under " Before you begin" here: - Auto-animate in XD.​ You can say that it works on instances only, as in test with component A in your last video.

Feel free to submit your feedback here: - Adobe XD Feedback : Feature Requests & Bugs and share the thread so that we may keep track of it.

Thanks,

Atul_Saini

Views

230

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Adobe Employee ,
Jun 24, 2019

Copy link to clipboard

Copied

Hi Chriss,

Hope you are doing good. Thanks for sharing all the details and the video. If I understand this correctly, here is what you are trying to do.

autoanimate.gif

If yes, please try the following interaction settings and share the results.

For more details, please see this link: - Auto-animate in XD​.

Thanks,

Atul_Saini

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Jun 24, 2019

Copy link to clipboard

Copied

Hi,

thank you for the fast feedback, but this doesn't really help me sadly.

I can get the animation you described to work just fine, just not with 2 separate components.

I have 2 components, their structure/objects/names are exactly the same, the only difference between component A and B is the position of the Text Object:

Component_Structure.png

Here is a picture of the 2 example artboards with the components:

Component_Artboard.png

This is the way the animation is set up:

Component_Artboard_Animation.png

As you can see, the top animation with only one component is working just fine, but the animation which is supposed to switch between 2 different components (component A and B) is not working, but using the fade in/out transition instead:

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Employee ,
Jun 26, 2019

Copy link to clipboard

Copied

Hi Chris, thanks for sharing the details. This behavior looks as designed, please check the point 1 under " Before you begin" here: - Auto-animate in XD.​ You can say that it works on instances only, as in test with component A in your last video.

Feel free to submit your feedback here: - Adobe XD Feedback : Feature Requests & Bugs and share the thread so that we may keep track of it.

Thanks,

Atul_Saini

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...