From the course: UXPin for UX Design

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Animating state changes

Animating state changes - UXPin Tutorial

From the course: UXPin for UX Design

Start my 1-month free trial

Animating state changes

“

- [Tutor] Now that you have learned how to animate elements on the canvas, you might be wondering if you can animate states. The answer is, not quite. Let me show you. I have a multi-state element here on the canvas, is this heart. And if I open it up you can see I have a base state and I have a red state where the heart gets bigger. Now, you would think if you can change the properties of a state, you should be able to change the location property. So if I choose the red state and then just pull it down to the top of the hourglass here, just put it right there. If I come back to my base state, nope, didn't work. Now, here's why. Just going to put everything back. The reason is the location change affects the entire element not the state of the element. Now, that's the bad news. The good news is the transition between states is actually automatic. If I attach a hover trigger to the first state here, so I've…

Contents