Should I use States, Layers or am I missing the obvious?
May 02, 2016
Here is my end game:
I would like to simulate how a user would start a task by using a key pad (please see attached). An example is if the end user was trying to change screens, they would have to select the following keys in correct order: focus key, 1,3,4, enter. Ideally, each button would change to red when scrolled over and the buttons to turn yellow when selected. To get the clearest picture, I have taken the pdf drawing of the control panel and converted it to .svg in Inkscape, then saved it as a PNG and inserted it into Storyline 2 as the base layer. The plan was to change the color and export each button as a PNG from Inkscape and use it in Storyline. This has not worked because I am unable to replicate the size and position of each button (I am unable to nudge it exactly where I need it so it does not change position when the colors change). So I am at a crossroads here. I planned on placing each button a layer but as I am thinking about this, I am wondering if it would be easier if each button be assigned a state (normal, hover, selected) OR am I completely missing an easier solution without hurting the picture quality. So you know what it looks like, attached is an example of hovering over the Production Key and selecting it.
Thank you for your help,
Steve
14 Replies
Hi Steve,
"Easier" I think is always a tricky word to use with Storyline - as there are a number of different ways to accomplish the same thing and it's often dependent on your needs and how you as an individual think through the set up. For me, using states and letting the built in definitions of those states control the behavior of the objects would be the easiest set up. Less triggers and then less work or items to keep track of.
I can't speak to the export issue from Inkscape ( I would use a layered PhotoShop file to set up the various button states and export them). For building the control panel in Storyline, I would use states, not layers.
Point well taken. I'm going with states. Thank you very much for your help.
It a unanimous vote! 2 out of 2 believe states is the way it should go, so that is what it shall be! Thank you very much for your help.
If it's just color, you could just make your icon as pngs with transparent background. Make a square of different state colors, and just paste your png on top of each state.
As far the nudging, you can move it one pixel by holding ctrl and an arrow of your choice.
I was just pulling my hair about that. It seems almost too easy but makes all the sense in the world. My only worry is that if the user tries to select the button and hovers directly over the icon the button may not acknowledge the hover and or selection.
As for the nudging, I was hoping to keep the original PNG of the control panel, but could not get the size of the new button to exactly match the original. I have decided to just rebuild the Panel.
In the attached file the png icon is inside the "button" square and will work.
It isn't for me. Please see attachment.
Hi Steve,
Glad to hear States will work for you - it looks like you attached a copy of your CD published output here - and if you'd like folks to take a look at the file it's typically best to share the .story file here so that we can see what was set up and then if needing to publish do so locally.
Got it. Thank you.
Sorry Richard, I have updated the file.
fixed it. This is the method I was referring too. Still there are potentially many different ways to tackle your problem within SL. Just keep at it, it can be frustrating at times.
There it is! Thank you very much for your help.
This discussion is closed. You can start a new discussion or contact Articulate Support.