Help with Timelines/Scenes/Symbols


#1

I’m not sure I completely understand the separate timelines. I keep trying and giving up. My current animation is 3 passengers with luggage. The user clicks on each bag to reveal what is inside the bag.

I do not know the order that the user will click on the bags, and ideally I would like the animation (of the object in the bag being revealed, created with opacity) to reverse and fade down when the next bag is clicked.

Is there a way to do this without getting into JavaScript? I currently have 4 timelines, Main, and one for each bag’s contents. Thanks for any help on this, the separate timelines have been very confusing, don’t seem to work as expected… maybe my expectations are wrong?


(Mark Hunte) #2

Can you post you project. It will be easier to to see what you are doing and show you if we can.


#3

Just got a good change of direction. All items stay up, so probably some easy JavaScript to fix this… how do I disable the button once it has been clicked? Here is the file…


(Mark Hunte) #4

Cool, you got it.

You do not need JS to disable the button.

Do similar to how you used the display property for ‘Question1-T2-B5-aerosol’ in the aerosol timeline to set it to hidden/ visible .

Set a keyframe for each of the button rects on their timeline for the property display. set them to hidden.

When an element his hidden it is disabled from user interaction


#5

Brilliant, totally should have though of that. Thanks for the help!

For the next time though, what is the difference between using Timelines, Symbols & Scenes? Or maybe you can point me to an already existing explanation. I’m coming from being a Flash Developer and am used to MovieClips and Symbols.


(Mark Hunte) #6

A Scene is what is displayed in the viewport (what you see on the page ).

A scene displays your elements ( what you see on the page).
You can have many scenes and each scene contains it’s own elements.

You normally transition into another scene to change what the person viewing sees in big gulps.
I.e click answer 1 you are taken to scene 2, click answer 2, your are take to scene 3.
Scene 2 & 3 will show the user two different things and allows you to transition without having to re animate all your elements if you only could have a single scene. Think of scenes like jumping from one page to another but within the same viewing area (viewport)


A Timeline is where you can control an elements properties that make it animate.
You can control most elements one way or another on a timeline.
A single timeline can control many elements.

Each scene has it’s own timelines. And can have many timelines controlling different elements.
All timelines start from 0 seconds. But you can place keyframes or actions at any point in a timelines running time.

An individual timelines can be started at anytime you want but will always tick away from 0 seconds onwards and fire keyframes and actions set at the time relative within itself.

But
I think you need to look at the documentation and also have a look at some of the tutorials videos. on Scenes and Timelines and then get a Handle on Symbols.


#7

Thanks so much for your help Mark. I’m jumping over from using Adobe Edge Animate to Hype while under constant deadlines, so the time to sit and learn hasn’t happened yet, doing triage learning!