This website uses cookies to ensure you get the best possible experience. See our Cookies Policy.

PMG Digital Made for Humans

The Switch: Flash to HTML5

5 MINUTE READ | July 22, 2015

The Switch: Flash to HTML5

In the digital ad world a shift is occurring.  All new ad creatives are now being produced in HTML5 vs the standard flash banners. Here at PMG we have already officially begun the transition updating banners and learning the new tools but preparations for this transition actually started years ago. In 2010 Apples late CEO Steve Jobs said that Adobe’s Flash was a dying technology. He claimed Flash was buggy, a CPU hog, and was riddled with security flaws. Zoom forward over 5 years and now we see Mozilla blocking the plugin in their Firefox browsers amid security concerns. Firefox makes click-to-activate Flash the default. Googles browser Chrome is scheduled to “intelligently” block auto-playing Flash ads and is rumored to have a total block of Flash in the pipeline for a new version of Chrome. On an unsurprising note it appears that Microsoft has yet to smell the smoke and realize Flash is on fire by not yet providing a patch in its Internet Explorer 11 (IE11) or the new Edge browser in Windows 10. Microsoft is expected to address the situation with upcoming media endeavors but as of now, nothing has been mentioned on the Microsoft Security Center TechNet Blogs.

So the growing pains for the switch begins. At the Google DoubleClick hosted webinar “Making the transition to HTML5” it was noted that the 30% rule is now a thing in the ad world. This means that the time it took to prepare a typical ad campaign from the creative teams, building out the banners and assets required for HTML5 banners would increase by nearly 30%. Here at PMG we have seen an increase in the time, perhaps not as significant as 30% but our schedules and budges are being prepared to accommodate this extra production time.

As a designer I have been using Flash technology since the late 90’s. The first build I touched was actually called FutureSplash Animator. I worked with the Macromedia Flash 1.0 to build some of my very first interactive web apps. Over the years I have used Flash keeping up with the latest Actionscript updates and workflow changes. The new tools that Adobe and Google have developed to build HTML5 style animations are comparable to Flash. Somewhat.

Google has provided a beta version of Web Designer for a few years. Web Designer is a graphical tool for creating HTML5/CSS3/Javascript banners for ad production. It can produce animations and even basic 3D transforms. It is not built to develop complex rich media applications or entire websites but has been built to produce banner ads, popup ads, sidebars or animated buttons ready to be integrated with DoubleClick and AdWords campaigns.

As of now, Googles Web Designer Beta is still very much a work in progress. Though it does demonstrate potential,  it is just not ready for large scale ad production jobs like agency PMG provides. That said, a few of the tools already outdoes the alternative, Adobe’s Edge Animate CC. For example the align tool in Web Designer has been built with easy to use Align to Stage capabilities. Seems like a minor enhancement to a design app but it’s the small critical features that contribute to an efficient workflow for designers and animators. Unfortunately, in an overall test, Googles Web Designer is just not up to speed when compared to Adobes Edge Animate.

In August of 2011, the first application in the Adobe Edge suite was released to succeed the “dying” Flash platform. The 2015 release of the multimedia authoring tool Edge Animate is part of Adobe’s Creative Cloud (CC) application offerings. Edge Animate’s features include a relatively intuitive interface with a somewhat expected toolset to produce HTML elements for animation, multimedia and playback controls for responsive and mobile-friendly content for websites and smartphone/tablet applications. Most importantly for the agency, Edge can be used to produce HTML5 banner ads and Lightbox rich media spots that can be loaded into the DoubleClick or Atlas ad serving platforms. As we have been using and learning the different programs to build HTML5 animations we have become very aware of the somewhat limited features when compared to the rich and dynamic modules that Flash can produce. Though it is getting better fast. An example of this is color blending modes. This actually has more to do with the limitations of HTML5 than the authoring tools. Currently the Adobe Web platform team is working on pushing forward what is possible on the web including visual effects such as blending. While Flash has included blending since Flash 8 released in 2000, Edge will not and cannot include this feature. Yet. Overall it still feels like Edge is not fully baked. It’s not a complete and mature product like other Adobe offerings such as Photoshop, After Effects or Illustrator but it’s still a relatively young application and is still our agencies recommendation when authoring complex HTML5 banner ads with animations.

Today the team will be attending the “How to build ads in HTML5: A step-by-step workshop” hosted by DoubleClick, so I’m sure we will dive into Googles Web Builder offering a little further and maybe learn a few new tricks. During this transition mode to HTML5 we will all have a blast learning these new authoring tools! Rock on! \m/

Updates:

Here is a really good article written in 2013 that exemplifies the teams initial feelings for Edge which we still consider the leader for graphical tools writing HTML5. Adobe Edge Animate proves HTML5 is no substitute for Flash.

Resources:

Insights meet inbox

Sign up for weekly articles & resources.


Posted by Stephen Hill

Related Content

thumbnail image

Get Inspired

Stop Wireframing and Start Sketching Your Mockups.

2 MINUTES READ | February 28, 2017

Get Inspired

How We Built and Tested a New Website in Five Days

7 MINUTES READ | May 6, 2016

Get Informed

The Redesigned PMG Website (Part 1) : My 5 Favorite Things

4 MINUTES READ | August 15, 2014

ALL POSTS