Tried pivot animation with SVG in Hype

Hey guys,
Wanted to share something i tried yesterday.

http://www.luckyde.com/ipad/turn/turn.html

Wanted to do an animation rig in hype, i had a lot of problems with pngs rescaling and becoming low res so i decided to use SVG.

I did a basic turn with about 60 svg shapes as body parts.

Things I learned

Good

Hype can do animation rigs just as well as flash, centrepoint adjustment is fully possible in hype just like in flash. e.g.

After finding out how to control symbols i found just like in flash or after effects i can keep my timeline clean.

You can save a lot of filesize with SVG, it scales nicely

It performs great considering the amount of items on stage.

Bad

The biggest issue i had and why i couldn’t do the inbetweens was i could stretch SVG’s width only or height only. it could only stretch both at once, and it took me double clicking on the svg so that it shows the effect.

The ease-in-out default tween interfered a lot,i had to fight with it the whole time. I wish i could set the default as linear Cheers @DBear
Or can you have the tweens disabled until i ask for a tween so you can key it out and then tween between?

Items jitter a lot, i notice this a lot with Hype for small objects, they’ll try to snap to positions the more subtle the animation, thats why i use GSAP over top of Hype for precise animation, it doesn’t have this problem, i just with i could do it without it and just with timeline.

The inability to rescale symbols stopped me from using them a lot, which is why i tried the svg route but again sadly that wasn’t perfect.

Having no ability to set shortcut keys slowed me down by a lot, It’s a feature I really wish you guys add at some point.

Minor:
The blue guidelines constantly popped up which was quite distracting and i wish i could turn them off like i can snapping.

Anyway wanted to share it with you guys
Source File:
turn_.zip (115.2 KB)

Started in photoshop

Live traced in illustrator

And pasted the code into hype squares