Forum Discussion
FREE: Coconut Shy tab interaction using new emphasis animations
Hey everyone!
For this year's E-Learning Heroes Tab Interaction Challenge, I have built this 'coconut shy' themed demo.
TRY IT HERE
I've used the new emphasis animations to add some kineticism and energy when each 'tab' is selected.
The ball appears to fall into the coconut shy as it is, in fact, two different balls. The falling ball only becomes visible when the thrown ball completes its journey and reverts to a hidden state. This creates the illusion of depth.
Although the content is about coconuts, this demo could easily be repurposed for other topics. And while not suitable for every project, I like the idea of making tab interactions a bit more fun where appropriate, to encourage learners to 'click next'.
If you have questions, drop me a line!
Jon
Not only is this a fantastic project, but it's also a masterclass on motion paths, variables, and conditional interactivity. Thanks, Jon.
- SarahHodgeFormer Staff
Ok, this is amazing Jon! 🤩 I love how thoughtful you were about the animated effects. They made the content come to life. And you nailed the audio...it was so satisfying to click each coconut to learn the facts. Nicely done! 👏