Good afternoon everyone, I'm currently working on a course where I'm trying to make a circular diagram spin on a central axis. It needs to rotate 90° after click on a trigger, four times until it's back into it's original position. Anyone have any idea how I could do this? I guess the answer will be motion path, however I can't seem to figure out how to make the rotate rather than move in a circle.

Ant, You can't add an animation to an object already in a state. However, you can copy and paste an item (that already has an animation added) to a state and the animation will run. So the basic gist in the example above.... 1. Add the object to the slide and then add the quarter turn spin animation. 2. Copy object. 3. Create a new state "Stop 1" and then paste the object to that state (deleting original object). 4. Duplicate Stop 1 to Create Stop 2 and rotate the object 90 degrees. 5. Repeat step 4 as necessary 6. Remove the animation on the original object on the base layer. I hope this helps! Mike PS. I used the basic spin animation (quarter turn) and not a motion path.

The windmill has states, each state has a quarter spin animation.

Hi Ant. Sounds like you're trying to build something pretty cool! I've been noodling this one with Mike Enders and we're not sure you can get the effect you're looking for with motion paths since they aren't 3D. Mike shared with me the attached example he created for a DevLearn session showing how you can get a 2D continuous rotation effect—although I'm not sure that's what you're looking for. I also found a previous discussion highlighting some ideas for achieving a 3D rotation effect. Some of the ideas involved using PPT to animate the effect, while other folks suggested using Javascript.Keep us posted on what solution(s) you ultimately employ to bring your design to life.

Here is a quick variation of Mike's file that allows for continued rotation and starting/stopping. The 'starting/stopping' part is still rough but the mechanism works.

Hello.. After some experiments based on the methods shown by Mike, Trina & Michael, I came up with this method to simply it further. Hope this helps. Basic is same - A shape with 3 sec spin. It has 2 more states - S1 & S2 with 3 sec spin each. Now instead of the box & motion path, I have used JavaScript to change the variables at 3 sec intervals and added trigger to change states when the variables change.

Making an item spin on a central axis | Articulate

47 Replies

LeslieMcKerchie
Staff
8 years ago
Glad this was helpful for you as well Heinz :) Thanks for chiming in to share.
MichaelHinze
Community Member
7 years ago
I know this is an old thread but I picked up a useful tip at an Articular webinar this week, and thought I add this as one more option. You can also spin an object by adding a circular motion path, set its dimensions to 1 px for height and width, turn off any easy options and select the Orient Shape to path option. This option requires no states or offstage animations. See attached a quick example and here is the published version.
spinningwindmill_MH_SL360.story123 KB
AshleyT-Pollard
Staff
7 years ago
Thanks, Michael. Old or not we always love to see the helpful tips!
NomadColiving
Community Member
5 years ago
Hi,

Here is an example using easy trigger for infinite smooth 4 point rotation.

You just need variable, states and animation. No coding needed.

For infinite rotation, It's important to not use the states as they don't reset but the layers and have them to reset.

demo:

https://360.articulate.com/review/content/5ec14383-e3d0-4d0c-8a1a-17c2e1587a95/review

source file:

https://www.dropbox.com/s/3qew47xlezbspte/rotation%202.story?dl=0

cheers!

Maria

Forum Discussion

Making an item spin on a central axis

47 Replies

Related Content

Review 360: Share Items with Team Folders

Make Objects Appear & Disappear with Animations in Storyline

Match multiple items Drag & Drop

Making an educational board game in Articulate

How to make this image transition?

Learn

Connect

Discover

Community

Company

Trust Center