Best Practice: Interactive Animation in Dreamweaver

Forum|Forum|7 years ago
June 14, 2018
4 replies
890 views

Hi Dreamweaver Community,

I have just started experimenting with the Dreamweaver software and trying to include an Adobe Animate Interactive in the basic page.

Are there any best practices, or things to avoid when using a HTML5 interactive import into dreamweaver? Things to avoid, or even best workflow from Animate CC to Dreamweaver CC.

I can get simple animations running (2 shapes - 2 interactions) however when larger animations are built (Single frame - 10 shapes - 10 interactions) it freezes Dreamweaver every time.

Thank you in advance.

This topic has been closed for replies.

Correct answer pziecina

The main point to remember when creating interactive animations using Animate, is to keep it simple and obvious.

Why obvious? Simple, your interactive animation will be viewed and hopefully used on mobile devices. Such devices do not have a mouse so there is no feedback to the end user regarding the functionality of any item,as all they have is touch gestures. If your interactive animation relies on hover actions then without extra javascript programming which Animate does not include the end user has no idea what any of your graphics actually does. Even with the extra javascript the end user still requires descriptive feedback as to the functionality of each item.

Then we come to bandwidth on mobile devices. Animate files are extremely large for what they do, this means increased file size(s) that the end user must download. So for anyone on a limited downoad plan, Animate created animations should only be used when absolutely necessary, (4+Mb downloads are excessive, though many Animate, Muse and some framework users think otherwise).

C

CarlG78Author

Participant

Thankyou all

pziecinaCorrect answer

Legend

The main point to remember when creating interactive animations using Animate, is to keep it simple and obvious.

Why obvious? Simple, your interactive animation will be viewed and hopefully used on mobile devices. Such devices do not have a mouse so there is no feedback to the end user regarding the functionality of any item,as all they have is touch gestures. If your interactive animation relies on hover actions then without extra javascript programming which Animate does not include the end user has no idea what any of your graphics actually does. Even with the extra javascript the end user still requires descriptive feedback as to the functionality of each item.

Then we come to bandwidth on mobile devices. Animate files are extremely large for what they do, this means increased file size(s) that the end user must download. So for anyone on a limited downoad plan, Animate created animations should only be used when absolutely necessary, (4+Mb downloads are excessive, though many Animate, Muse and some framework users think otherwise).

Nancy OShea

Community Expert

Animations exported from Animate CC tend to be rather large files. I wouldn't inflict too much gratuitous animation on users if I could avoid it. A lot of interactive stuff can actually be done directly in DW with CSS and JavaScript code resulting in a much smaller footprint.

As an example, Wow.js library animates elements on scroll with only 3KB of bandwidth.

https://mynameismatthieu.com/WOW/

Nancy O'Shea— Product User & Community Expert

BenPleysier

Community Expert

Use an iframe to run the animation as per Display an Animation on a Webpage using iframe - YouTube or Google th subject.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded