Responsive Scaling for the entire scene


(Carlos Eduardo) #1

I’ve recently asked for my Company to buy Hype because Adobe Edge has ( unfortunately) been discontinued.

And while I’m very happy with the product, I’ve been having a couple of problems while trying to make some of the things I did with Edge. Responsive scaling for an entire banner is one of those things.

There’s this format that I’m used to animate called “Custom Header” ( [This is it][1] [1]:$0x0$false$$false$none$None$247070$20066$ia$false$$$&$300x250$false$$false$none$None$$$ia$false$$$true&$728x90$false$$false$none$None$$$ia$false$$$true&dpir=1 ).

So what I used to was:

I would create the animation on Adobe Edge, turn on responsive scaling, and insert an iFrame of the HTML of the animation for each column.

With hype, it doesn’t work. because the HTML doesn’t scale when the browser window is resized.

Can I work around this?

If I wasn’t clear, ask me anything.


Welcome! I made the transition about 4 months ago and I couldn’t be happier… however, there are two things that will drive you nuts coming from Edge Animate about Hype, and this is one of them. Here is the method which can be problematic as it uses CSS to scale and complex iFrames don’t understand it…

Here is my current process to create a flexible layout in my animations:

  1. In “Scene” I click the check boxes for Scaling Width & Height
  2. The contents of the entire animation are grouped (the whole animation will be in one group folder, I usually do it last)
  3. Select the group and in “Metrics" click both center arrows in “Flexible Layout”
  4. In “Scale Behavior” choose “Shrink to Fit” and check “Zoom contents”

How to scale whole canvas without reformatting
(Carlos Eduardo) #3

That worked perfectly!

You fixed my problem! Thank you =)