Storyline experiment - Smooth dynamic animations. Thoughts? How would you use it? (Now with .Story files)

Jan 30, 2017

Hey everyone - I started to experiment with some animations in Storyline that are a bit more dynamic and have a smoother motion.

You can see it in action here!

Thoughts? How would you use this?

I wanted the animations to have a nice ease from one state to another. I used a simple javascript tween/ease class to do this.

I also rigged this up to an animation I created using states so I could animated to different points in the animation. I will post this when it is ready to show another use.

Thanks to Nejc Žorga Dulmin for giving me the sliding menu background idea.

61 Replies

Richard Hill

7 years ago01/30/17 at 1:26 pm (UTC)

Greensock? Whatever it is looks fantastic. I know how I would use it. More fluid gamified movement. But this example is Sweeeeeet! They need to PIN this one.

David Charney
Author

7 years ago01/30/17 at 3:07 pm (UTC)

Hey Richard - it is Greensock (the JavaScript platform). It is rather simple to implement in Storyline and use to set numbers to a variable.

Thanks!

Ashley Terwilliger-Pollard
Staff

7 years ago01/30/17 at 3:32 pm (UTC)

Very cool David - thank you for sharing!

James Bennett

7 years ago01/30/17 at 4:18 pm (UTC)

Hey,

This is definitely something I'd like to start implementing but I really wouldn't know where to start, any chance of submitting the source file?

David Charney
Author

7 years ago01/30/17 at 5:01 pm (UTC)

Hey James - You bet. I will pick one of these examples and clean it up in the Storyline file so it is very straightforward and post it. Would work the same in Storyline 2 or 360.

David Charney
Author

7 years ago01/30/17 at 8:04 pm (UTC)

Just realized that I didn't mention the configuration button in the lower right. You can dynamically change the ease type and how many seconds it takes for the animations to occur.

Richard Hill

7 years ago01/30/17 at 8:13 pm (UTC)

Actually your expertise in making the panel is what really impressed me earlier. I was digging bounce at .5s :)

7 years ago01/30/17 at 10:37 pm (UTC)

Awesome. Yeah I wanted to add in the control to try things out and it can be used to show how this works too by slowing it way down.

Bounce at .5 is killer!

7 years ago01/31/17 at 9:14 am (UTC)

This post was removed by the author

Adena Wilson

7 years ago01/31/17 at 3:15 pm (UTC)

I love this. I often need to display graphs for my clients and would love to learn how you did the bar chart. Thank you for sharing!!

David Charney
Author

7 years ago02/02/17 at 5:39 pm (UTC)

Hi Adena,

You bet. I am going to try and create a graph engine to make it easier to create graphs and comparisons. Hope these ideas can help with your project!

Adena Wilson

7 years ago02/02/17 at 5:42 pm (UTC)

Sounds awesome. Thank you.

D Copenhaver

7 years ago02/03/17 at 1:03 pm (UTC)

Nice job - if you don't mind sharing the source files that would be great.

7 years ago02/06/17 at 1:39 pm (UTC)

Thanks! And I will be sharing it soon. I am cleaning it up a bit so it is easier to use.

CSATF CSATF

7 years ago02/13/17 at 6:06 pm (UTC)

This is awesome! I can't wait to see how it was implemented. I've used some Greensock in Animate, but it'll be great to be able to modify the native animations, as well.

David Charney
Author

7 years ago02/16/17 at 3:39 pm (UTC)

Here are two of the examples which you can download. They are free downloads right now:

http://elearninglocker.com/portfolio-items/motion-effect-progress-indicator/

http://elearninglocker.com/portfolio-items/motion-effect-progress-or-score-indicator/

I tried to clean up the JavaScript and comment it. I separated the examples because I believe it will be easier to pull apart and use as you need.

Leslie McKerchie
Staff

7 years ago02/16/17 at 4:15 pm (UTC)

Thanks for popping back in to share David :)

David Charney
Author

7 years ago02/17/17 at 2:42 pm (UTC)

You bet, Leslie. I will get the third example on soon... doing a little more with it. Let me know if there are any JavaScript questions.

almost 7 years ago06/05/17 at 7:55 pm (UTC)

Hey David. Is this still offered for free? I'm a little late to the game, but I'm hoping it is. =)

Ashley Terwilliger-Pollard
Staff

almost 7 years ago06/05/17 at 8:48 pm (UTC)

Hi Mike,

I'm not sure if David is still subscribed here, as the post is a bit older - but you could always use the "contact me" button on a ELH users' profile to reach out to them directly!

Best of luck with your project!