Animated flashcard interaction that has everything: cool custom animation, bright colors, and fun icons. Everything is aligned to Storyline's color and font themes, so you can customize the interact...
Published 8 years ago
Version 1.0
Blog Post
The animation is caused by multiple things. The top coloured title bar has a hover state, which has an "in" and "out" animation, which gives the effect when hovering the mouse. The image (cupcake) also has an "in" and "out" animation, giving the effect that it is changing colour with a wipe. Three items are then grouped together, causing the animations on both of those items to trigger when the state of the grouped items are hovered over. I use a similar effect for buttons when they are hovered over, with icons having a wipe on animation. I find this adds a little to the user experience
- When I open the file in Storyline 360, I see no animations assigned to the objects nor their states. Are you certain that's what is happening here? I see that the title bar has a hover state with a lighter shade, and the icons have a darker shade, but no animation is assigned to any of them.
It's driving me mad!- To see that you need to ungroup any of the menu elements. Then select the coloured title and view it's states. There, the state of the hover has customized input-output animations. The author has set up everything, and then grouped and got a consistent animation when hovering the whole element :)
multi-level animated thing )
