Animated Advertisement Inspiration

Updated: The second one might just be easy to accomplish looking at its just image sprites from a video with the guy and the girl. Looking at the resources

2 Likes

High-impact visual choreography combined with Greensock GSAP power easing!

Jan-Feb 2019 Update! New Ads have been added from Sony, Honda, Canon, Amex… Enojoy!

5 Likes

That banner is no longer available online. I’d love to see it. Pete, did you happen to capture it, and still have it, by any chance?

I just found this post, this is great! I’ve done this sort of banner isolation for myself, but have never seen a public resource like this. Thanks, guys! I’ll contribute as I come across good ones. I’ve noticed more and more when I try to open banners in a new tab, they come up blank. From what I can tell, it’s due to taking out the publishing page’s connection.

A couple of examples:
https://tpc.googlesyndication.com/safeframe/1-0-32/html/container.html
https://secure-ds.serving-sys.com/BurstingRes/Site-74530/WSFolders/12134322_5//index.html

Always a bummer when that’s the case. Let me know if there’s any kind of workaround when that happens.

Hey there, thanks for the kind words, mind telling us what ad you clicked on? Generally, we stay away from googlesyndication served ads as they tend to die out quickly. Google Ads served on s0.2mdn.net is what works the best, sometimes its tricky to get them to work but we’ve figured out a way to display them. The key is to remove everything after HTML as those are analytics/tracking details. We’ll be adding new ads shortly and one of them is a hype/gsap ad designed by our talented forum member and contributor.

Do you know what ad from within this forum you clicked on?

Sorry Pete, I wasn’t terribly clear. The links I’m giving are from the wild, not provided in this forum. However, the G-Star Raw Interactive Carousel link here is broken.

Some bannerboy ads were deleted by the company so I went ahead removed them from the thread. Let me know if there are other ones that cant be displayed. Sometimes it takes a good few 5-10 seconds to load.

1 Like

New ads added, Enjoy! A few more have been added.

Adidas Star Wars Sneakers :new:

Cathay Pacific Airlines :new:

New York’s 529 College Savings Program - The Chauffeur :new:
New York’s 529 College Savings Program - The Chef :new: :cyclone: variation
New York’s 529 College Savings Program - The Doctor :new: :cyclone: variation
New York’s 529 College Savings Program - On Job Less :new: :cyclone: variation

Yahoo Finance Premium :new:

Google Home Hub :new:

Verizon - Samsung Galaxy S10 Promo :new:

Advil Liquid Gels :new:

2 Likes

Nice text animations with the Samsung ad!

These looks really great:

https://bannerblog-775b5.appspot.com.storage.googleapis.com/posts/-L7-5jAza8BgPB34GZ-Z/banner/1520420124542/f-secure_brand-awarness_300x600/index.html

https://bannerblog-775b5.appspot.com.storage.googleapis.com/posts/-LXZOknJNxplcbzZk-gd/banner/1548946221175/cubica_newbalance-1080_300x250_W/index.html

https://s0.2mdn.net/3975371/1537456354192/index.html

https://i.cdn.turner.com/ads/adspaces/CNN/2018/04/18/990412135/970x250/ABPU_Series_S11_Premiere_Sustaining_970x250_HTML5TC.html?clickMacro=https://adclick.g.doubleclick.net/pcs/click%3Fxai%3DAKAOjsu6y5ufrJJgx5MF0Izy1dHALnzUVx1d2AY7mTPURIkAUthiVAVwpXmElK2UUosy7xWlkOr_XgcLlXvEvq12P_E-e-r6AK70tIiu0Xoud-Wohz4b0b8GnV6CECss78hGfMxpS1ecKGo4mT5J5ckjI-JOY3yVllB2XG03K-hkfbWqBQDaAiuXKx2nDOtwQch_85E857Rfz0E_tqcqt4EZefJoeiigMHficweKjyMdjVdxljVDZtfV_RXKT6K9kCEV8OtfTrFmcA8jaQ%26sig%3DCg0ArKJSzPFxvImeBBgoEAE%26urlfix%3D1%26adurl%3D&clickTag=https://cnncreativemarketing.com/project/abpu

https://bannerblog-775b5.appspot.com.storage.googleapis.com/posts/-L6q0idATFxWh4_vVMNZ/banner/1520251005187/captain-morgan_cannon-blast_300x250/index.html

and quite curious what is the technology of the video embedded?

https://s0.2mdn.net/4864311/1533951169155/index.html

1 Like

This is a regular HTML5 video. Those events are normal DOM events: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/loadstart_event

<video x-webkit-airplay="allow" webkit-playsinline="true" playsinline="" muted="" src="https://d193mxkscv6mty.cloudfront.net/M22/progressive/INP_300x250/STX_Entertainment_M22_300x250_Prog_resolve_video.mp4" style="width: 100%; height: 100%;"></video>

Thanks Daniel for your great support:grinning:

1 Like

True, Embedding videos and adding Interactive elements are where its at now when it comes to ads. Take this one for instance, its got a swipe interaction. Im noticing the key to getting it right is to know where to apply easing and what effect works with what asset.

Nike Soccer Sneakers - Built for Brilliance :new:

1 Like

though, there’s no video used in this ad … html5-animation and canvas

true above ad is not video enabled, I was just generalizing that video enabled and or interactive ads are on the rise and gave an example of an interactive ad.

1 Like

Just received a great collection of fresh ads from http://www.electricart.co.nz/, a New Zealand creative advertising agency – they’ve been all in with Hype for the past 18 months and just hit 500 million impressions.

You might also notice a sweet looking Hype animation on their home page:

Their style of sharp text over highly optimized video loads surprisingly fast:

3 Likes

Verizon Fios Mix & Match 300x250 | 728x90
Tommy Hilfiger Lewis Hamilton Edition 728x90 | 300x600 | 300x250

I think above Tommy Hilfiger ads were created by the talented @MaxZieb? Created with Hype and GSAP

Lovely.