GSAP for HTML5 Banners

October, 2015

Carl Schooff  |  greensock.com  |  @greensock

GreenSock

  • Jack Doyle: Founder and Author of GSP
  • Carl Schooff: Geek Ambassador
  • Support volunteers and community advocates
  • Innovating the GSAP API since 2006

Presentation Topics

  • Brief overview of what GSAP is and can do.
  • Why GSAP is such a great choice for scripted animation in HTML5 banners.

  • Show how to build an animated ad with GSAP.

  • Update on industry-wide support for GSAP.

  • Address what still needs to be done in the industry and what you can do to help.

View Banners: portal.bannerwave.com

 

user: GreenSockWebinar

password: gsapftw

This presentation is not...

  • A detailed beginners tutorial on all the features of GSAP.

  • A comprehensive overview of all the best practices for HTML5 banner production.

Resources for Learning GSAP

Official GreenSock Training

2-Day GSAP Class Dec 3-4

With Carl at Noble Desktop in NYC

Free Club GreenSock 

Onsite GSAP Training with Carl Available

Contact Noble Desktop for more details educator-in-chief@nobledesktop.com

GSAP in Action

GreenSock: MorphSVG

Chris Gannon: SVG Missile

What is GSAP?

  • Suite of high-performance JS animation tools
  • Used on over 670,000 sites (BuiltWith Usage Stats)
  • Used by major brands:

Tools of GSAP

 

Learn more greensock.com/gsap

Core Strengths of GSAP

  • Built for professionals, yet beginner friendly
  • Solves real-world problems (workflow, prefixing, SVG)

  • Excels at complex, story-telling animations
  • Runtime controls

Core Strengths of GSAP

 

  • No dependencies (other libs or rendering layer)
  • Plugin architecture

  • Support and documentation

  • Funded – not a side project or hobby

Why GSAP for HTML5 Banners?

  • The swf format is dead in the browser (mobile and desktop).
  • The web needs a strong animation runtime.

 

 

Click here to see video montage of HTML5 Banners

Hands On

Building an HTML5 Banner with GSAP

Latest Victories

  • IAB is educating the industry on how HTML5 ads need many external resources.

  • IAB recommends that standard display ads (non rich media) allow for 200kb zipped.

  • DoubleClick is hosting GSAP and will soon auto-detect it.

  • Adwords encourages GSAP use.

Latest Victories

Text

Text

Text

Text

DoubleClick Resources

Work to be done

  • IAB sending mixed messages about CDN hosting.

  • Pointing to publishers to "figure it out".

  • Still encouraging common shared libraries to be packaged with ads and count towards file size.

  • AdWords recommends that GSAP is packaged with the ad.

  • Get involved: The kilobyte conundrum.

All GreenSock premium tools

are free to use on CodePen.

Thanks!

GSAP for HTML5 Banner Ads

By GreenSock

GSAP for HTML5 Banner Ads

  • 5,118