Can't animate size after animating skew

Animation
1

Trying to do a simple sketch, in Hype 4.0.3.

I started with a pasted png, skewed and scaled down. It animates onto the frame and settles to a position - that works fine.

Then after a beat I want it to move to a new position, simultaneously scaling up and removing the skew.

I move the timeline head: add ‘skew’ to the properties; and click the plus icons to add points in the timeline for origin, Height, Width, and Skew (x).

I move the timeline head a few seconds further, and click the plus icons again for the same four properties. Then I grab the image and move it over - a blue bar connects the two points for the origin property. I change the skew in the inspector at right, a blue bar connects to the two points for the skew property. I change the size - no blue bar appears, instead the size is changed for the whole of the project.

I can’t seem to find a way to animate the size change, only at this point on the timeline.

I’ve tried creating a new project, with just a single png on it. Sometimes I’ve been able to animate a change in size, position and skew; but sometimes not. I think it may be due to the sequence in which I make the changes. I’ve also made a test project in which the size of the image does change as it changes position and skew; but when moving along the timeline, the numbers for size in the inspector don’t change, although those for skew and position do.

Is this a bug (I suspect so) or am I doing something wrong? If it’s a bug, is there a known workaround?

TIA,

2

And the answer is - I was doing something wrong.

The clue turned out to be in my last observation that the scale numbers weren’t changing, although the size of the image was.

I had failed to appreciate that “scale” and “size” are two different properties (or rather, four seperate properties, “size (width)”, “scale (width)” etc.)

Leaving my foolishness on display in case it helps someone else!

2 Likes
3

Glad you figured it out; this is one of those “HTML-isms” that corresponds to the difference between an element’s width/height and its transform:scaleX/scaleY properties.