Forum Discussion
Rotation of an object around a fixed point
Hi everybody.
I'm a totally new user of Storyline.
On my storyline project, I need to create an effect of rotation on one object, which is a manual lever.
On the attached picture, we can see the lever, that at final the trainee should move from the position A to the position B, around a rotation point, with an approximative rotation of 90°.
The constraints:
- The trainee must use the mouse to slide the lever from position A to position B.
- The movement should be around the blue rotation point in the photo.
- I must be able to mark the beginning and end of the action that conditions the actions that will follow.
A very funny effect for a game, but I don't know how I can do that!
Do somebody can help me? please 😥
Best regards
Florent
6 Replies
Rotating images can be tricky when grouping objects. Here's an alternative to set a fixed or specific rotation point:
- Insert your image within a shape (Insert a shape > select it > Format > Shape Fill > Picture, then choose your desired image)
- Add a secondary shape that will serve as a rotation guide, make it transparent, and position it appropriately (the center of this shape will act as your rotation point)
- Group the two shapes
- Rotate the grouped objects as needed
---------------------------
Rotation point:
Rotating Group:Shape transparency:
Image within shape:
Inserting image within shape selected:
Thank you for sharing that tip on rotating images when grouping objects, SaloCarrillo-e5. I'm sure it will be valuable to our community members.
Wishing you a great rest of your day!
- Insert your image within a shape (Insert a shape > select it > Format > Shape Fill > Picture, then choose your desired image)
How about something like this (see attached)?
I added some instructions and changed the end value on the Design tab of the dial to 8 (change this to however many positions you would like the lever to have). Next, I displayed the current lever position on the slide. Then I added a button that shows a layer when clicked. The layer's properties are set so that the user cannot access the lever once they click Submit.
Note that the lever position is tracked in Storyline automatically by the dial variable created when the dial is created. I renamed this variable to Lever_Position to make it more obvious.
Good morning Steve, thank you so much for your help. This community is a treasure of very good advices😃
Hi Florent,
I recommend using a dial (see attached).
I (very roughly) cut out the lever in Photoshop, duplicated it and rotated the duplicated piece 180 degrees. I made the duplicated piece 95% transparent, just so you could see it (for your actual application, you'll want to make the duplicated piece 100% transparent). I merged the visible and nearly invisible lever into one object and saved that as a PNG. I imported the PNG into Storyline and converted the lever into a dial. I adjusted the dial start and end points to span 80 degrees. Lastly, I cut a small piece of the base of the device to overlay the rotation point (otherwise, even though it was visible, the full base graphic blocked the ability for the user to drag the lever).
It's very rough but I think you'll get the idea when you try it out.
Hi Steve, thanks for your help.
I'm able now to rotate the lever around its own axis perfectly, when I slide it with the mouse cursor. Now I have to find, how Storyline can detect the final position of the lever, when I slide it with the mouse cursor (means: click and slide the object until a specific point) Which should be a condition to engage after, another action. Thank you again, best regards.
