Create interactive buttons and navigation in Adobe Animate

In this Adobe Animate tutorial, learn how to create HTML5 interactive buttons and set up timeline navigation using keyframes and code snippets.
Full tutorial with lesson notes and files:
➡️ bit.ly/3O3HRPM
0:00 - Intro
0:25 - Looking at layers in timeline
1:12 - Setting timeline duration
1:40 - Setting timeline animation
4:08 - Adding Stop action to first frame
5:15 - Converting buttons to Symbols
6:00 -Button appearance settings
8:52 - Applying Button Actions
15:58 - Viewing project in a web browser
#adobeanimate #animate #interactivedesign #interactive #interactiondesign #digitalpublishing #digitaldesign #html #html5 #design #learn #teaching
Montilla Design Subscription Plans
➡️ www.montilladesign.com/plans

[@AnnePakkanenDiscoarsDesign]

Thank you for the clear instruction

[@animapper]

I appreciate your video. As a long time developer from Director to Flash to Animate you might want to consider using labels on a frame. This way if anything changes in the timeline the code will follow the label. You can also program one index button and use instances without further coding them.

[@AngeloMontilla]

Thanks for sharing!

[@valnhere1475]

Thanks for the video, i appreciate it, its really helpful for me, because i have a task from my teacher to make a main menu or this kind of interactive buttons and stuff, really appreciate this, tysm. 🙏

[@AngeloMontilla]

You're welcome! Go crush that assignment! 😃

[@monikacau01234]

if the two index button have the same function, can i just make one button, and pull the timeline to the end of animation? just asking,

[@metink516]

nice video

[@efpdesign]

I love your content and in many cases I can even reproduce it, but I can never publish it after exporting. How can I put content made in Animate in HTML/CSS/Js on my website? Hosting on a server? Do you have free server knowledge for testing? How do I do?

[@teenola5783]

ever figure it out?

[@clevermissfox]

If the Index button is a symbol, couldnt you use another instance of it on the "third" page instead of having two elements that are identical ?

[@AngeloMontilla]

Yes great catch. You can certainly use the instance of the index button that was first created.

[@clevermissfox]

@@AngeloMontilla okay thanks just wanted to double check; I'm just learning more about Animate and symbols etc

[@metink516]

I have a question. Why do we need to add 2 second frames? was this unique to your project?

[@AngeloMontilla]

Great question! It doesn't really matter where you set the keyframes as long as you change the number in the () that corresponds with the keyframe in your timeline.

[@metink516]

@@AngeloMontilla thank you very much 🙌

[@makmalharith2980]

Is the slide is made in adobe animate?

[@AngeloMontilla]

Hey there! No, it's designed in Illustrator.

[@beiyongzui]

@@AngeloMontilla can it be made responsive if it is from Illustrator?

[@benjaminpastrana9662]

flash back to FLASH🤦🏻