Aligning character states

I find this almost impossible to do unless I manipulate the characters in a design package like Photoshop. 

Obviously, characters will be have different heights and widths depending on what they are doing (e..g pointing or clapping extends the width, tilting their head extends the height). So the most consistent (if not the quickest) way is to create a transparent background tall enough and wide enough to house the character at their most extreme points, and place them all on it. 

Thanks James. That's actually what i've been doing but i thought i'd check if i was doing something wrong. 

Hi Howie, 

I'm glad James was able to assist you here. 

Is there another way of aligning Ashley as this is an extremely fiddly and time consuming way?

This is from 5 years ago. But I have recently come to the same issue and discovered a way to perfectly align states without PS work.

1. Get your states ready: normal, hover, selected, etc. And edit states.

2. Set up a reference coordinates (I use normal) to be (0,0) (I think this maybe optional)

3. Now go to Hover state, and cut the character.

4. Paste it into Normal state, and then align the head until they are perfect.

5. Now cut the character and paste it back to Hover state. The newly pasted one comes with the right position.

6. Do the same for all other states.

I got perfect result: no jumping characters! Also, when you move the character, all states will move accordingly.

Hi Dong,

Neat tip - thanks for sharing!

You may also want to take a look at the new grid/guidelines added into Storyline 360. That would allow you to see where things would match up correctly as well! 

Something else I discovered when doing this:

I was trying to align normal, hover and selected states. And here emerges a new problem: the hover state would show on top of the selected state (in the official help it is NOT said that selected should override but I think this doesn't make sense: once selected, no hover should be allowed). 

Now, one blog article by Mathew Bibby mentioned this (google hover state) and said cut and paste would solve this problem. But this is not my experience. In fact, aligning states using the method I described above would induce the problem.

The tricky thing is that this is not always the case. Sometimes it works normal; sometimes it doesn't. I have to conclude there is a bug (which I am not going to report because the hover thing is such a mess already). 

Do I have a solution? Yes, after pulling a quarter of my hairs out I did find a workaround. If you encounter the same problem, here is what will save your day: simply copy what is working and change the character. Inexplicably, it will work!

Hi there, Dong.  I'm sorry you've had a frustrating turn!  The built-in Hover state will still show when an object is in a Selected state.  Here's a quick Peek of what this looks like with buttons.

It sounds like you encountered a buggy issue, though, when cutting and pasting in the states.  If you're able to take a screen recording of what you're seeing, it'll help me document the behavior!

Hi Crystal,

Thanks for your video, but I think you are not aware of the little secret I am talking about here.

I have attached a file to demonstrate that you can easily override the hover state.

Thanks, Dong for sharing that method, although as Crystal mentioned, hover would still show in connection with selected, since the learner could be hovering over the object or character too. 

Keep in mind the built-in states will behave as detailed here.