Let’s go back a few months, after Flash was disabled in Google Chrome with other browsers following suit ad developers needed to look for new methods for creating banner ads. Let’s face it, it was a bit of a nightmare with banner development now taking twice as long and amends not simply a question of amending text and republishing. Now you had to amend the Photoshop file swap out images and text and upload.
After using Edge Animate for a few months my go to method for creating banners changed when Adobe dropped its support for the product and subsequently replaced it with Animate CC which is effectively a renamed version of Flash exporting to WebGL and HTML5 Canvas.
Here are some examples of pure HTML/CSS banner examples:
At this time circa March 2016, Adobe was now pushing Animate CC big time and even set up a blog to support their new application.It’s around this time too that I’m looking at it to provide a better solution to my banner development workflows. So, how does it fare?
Well, scoping in Animate CC is a bit of a bother and forget about importing videos right now like you could with Flash because you can’t. There is however, a work around which you can adopt until Adobe provides us with better tools to do the job. Looking at the file size of the resulting project files the pure HTML/CSS approach is 30kb lighter when the project files are compressed. This might not sound like much but can be quite depressing when you have to account for every last kb. In terms of speed in putting the banners together, the Greensock code, is virtually identical you just have to be mindful in adding ‘this’ to prefix your variable, function and object names – ‘this’ being the timeline where your objects are displaying. The publish settings area is where most of the time saving tricks can be found which you cannot really do with the pure HTML/CSS approach. Here you can create templates which are ready to go for the Sizmek or Double Click platforms or create profiles based upon templates and a variety of other settings. If you have a really complex animation using masks you might like to use Animate CC it will speed up your workflow but for anything less complicated I feel you are better off using the create from scratch approach where you have much more control over the resulting file size and code output. Animate CC will also speed up text amends that you might be faced with because it will outline static text for you upon publish – something which you can’t do currently with the pure HTML/CSS approach – any text amends which do not use web safe fonts mean updating the Photoshop file reexporting the text and uploading to the server.
Animate CC publishes to WebGL and Canvas so in terms of browser support it is limited to the most modern browsers. With pure HTML/CSS you have the most widespread browser support available.
To conclude, I am eagerly looking to see where Animate CC will take banner development in the future. I am sure that in the next 6 months it will be the ‘go to program’ for banner builds but in the meantime I’m sticking to developing banners from scratch.