What I did is hide a blue rectangle shape, the same size and color as the straight part of the arrow, and placed it behind the arrow shape. I then added a motion path to the arrow that moves the arrow shape forward in a straight line when you click the button, then revealing the blue rectangle hidden behind it, and making it appear like the arrow is growing but the end point is staying in the same place. I've attached the .story file so you can take a closer look. Hope this is what you were trying to achieve and is helpful for you :)
This does not use any states at all. It just uses two shapes: an arrow shape, and a rectangle shape. And it also uses a motion path on the arrow shape. Which is activated by a "Trigger" on the button. You can open up the .story slide to take a closer look. There's no states in this interaction at all. However, to learn more about states, here's a helpful tutorial:
I guess my confusion is how you “hid” the rectangle before the arrow’s motion started and how you synced that up with the arrow to give the appearance of it growing.
I’ll search for some more resources (hate for you to keep going back and forth).
5 Replies
Hi Kyle!
Thanks for posting your question! So, here's one way to achieve the effect (I believe) you're looking for:
http://articulate-heroes-authoring.s3.amazonaws.com/Nicole/Demos/growing-arrow-output/story.html
What I did is hide a blue rectangle shape, the same size and color as the straight part of the arrow, and placed it behind the arrow shape. I then added a motion path to the arrow that moves the arrow shape forward in a straight line when you click the button, then revealing the blue rectangle hidden behind it, and making it appear like the arrow is growing but the end point is staying in the same place. I've attached the .story file so you can take a closer look. Hope this is what you were trying to achieve and is helpful for you :)
Hi Nicole!
Thank you so much for your response.
Correct - That is the effect I am looking for.
However, I am still learning how to do "states", which I assume this is.
Where could I go to learn more about editing/hiding states, so you do not have to type out all of the instructions?
Hi Kyle
This does not use any states at all. It just uses two shapes: an arrow shape, and a rectangle shape. And it also uses a motion path on the arrow shape. Which is activated by a "Trigger" on the button. You can open up the .story slide to take a closer look. There's no states in this interaction at all. However, to learn more about states, here's a helpful tutorial:
Adding and Editing States in Articulate Storyline 2
To help you further, here's a little Peek recording I did that demonstrates how I created the arrow with the growing animation:
https://360.articulate.com/review/content/55550e9b-348d-4127-8919-e753fc728a51/review
Hope the video helps :)
Hi Nicole!
I guess my confusion is how you “hid” the rectangle before the arrow’s motion started and how you synced that up with the arrow to give the appearance of it growing.
I’ll search for some more resources (hate for you to keep going back and forth).
Thank you for all of your help!
Hi Kyle - the video shows how I did it :)
This discussion is closed. You can start a new discussion or contact Articulate Support.