Jump to content
GreenSock

Carl

Inspiring HTML5 Banner Examples with GSAP

By Carl, in Banner Animation. Views: 121,545

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Posted

Hey just wanted to say these examples are great. The Verizon one is especially crisp!

Link to comment
Share on other sites
Posted

Hi Mr Admin .
I want Animation Icon mojs :|  :| :

 

https://tympanus.net/Development/Animocons/

 

and cool power  :shock:  :shock:  :shock:  :shock:  :

 

http://mojs.io/tutorials/easing/path-easing/

 

See the Pen c7b99f1a216498818cbb9f0c881fc542 by sol0mka (@sol0mka) on CodePen

 

------------------

 

See the Pen 95e3300c59686dc1d534d2b38c208ecc by sol0mka (@sol0mka) on CodePen

 

-------------------------

 

See the Pen OyzBXR by sol0mka (@sol0mka) on CodePen

Link to comment
Share on other sites
Posted

@kkarimi91@yahoo.com, Curious what your goal is for posting that stuff here. Pretty much all that stuff is possible with GSAP already. Have you seen these recent launches?: 

 

http://greensock.com/customease/

http://greensock.com/wiggle-bounce/

 

?

woooooo Bravo 

wonderful

I like it .

But You can create these 'Animation Icon ' examples 'Like' ?

https://tympanus.net/Development/Animocons/

Please....

Link to comment
Share on other sites
Posted

Oh, sure, that's entirely possible to do but I don't personally have time to do it all for you. Sorry. Way too much on my plate right now :) Maybe someone else wants to tackle that. Typically we try to keep these forums focused on GSAP-specific questions (not so much "would you build this for me?" type of things). 

 

Happy tweening!

  • Like 2
Link to comment
Share on other sites
Posted

Oh, sure, that's entirely possible to do but I don't personally have time to do it all for you. Sorry. Way too much on my plate right now :) Maybe someone else wants to tackle that. Typically we try to keep these forums focused on GSAP-specific questions (not so much "would you build this for me?" type of things). 

 

Happy tweening!

Ok , very thank you .

:) 

I'm try my code make from gsap animation icon 'LIKE'.

Link to comment
Share on other sites
Posted

Chris Gannon makes a lot of icon animations like that with GSAP. 

 

Check out his CodePen account for inspiration:

 

http://codepen.io/chrisgannon/

 

Happy tweening.

:)

  • Like 4
Link to comment
Share on other sites
  • 4 weeks later...
  • 2 weeks later...
Posted
Hello colleagues! We are very proud to present our first 3D banner and we decided to share a little bit more info about it.

 

Everything started with RnD. We were looking for the technologies that meet the requirements of our ad networks. We found out that WebGL could be used in the banner. The hardest thing was to pack everything (model & textures, animations, banner graphics) into 150 kb. It took us really long time (approx 1 month of experiments and fails). This was a perfect collaboration of  our inhouse teams. 

 


 

Pic-Template.jpg

  • Like 11
Link to comment
Share on other sites
Posted

Hello once again!

 

I'm glad to present new banner "Defender". Enjoy!

 

Defender.jpg

  • Like 8
Link to comment
Share on other sites
Posted

Do tell me you have a team working with you...

Link to comment
Share on other sites
Posted

Great, it seems unbelievable that is pack everything into 143 kb. It is like a movie.

Link to comment
Share on other sites
Posted

Thank you guys!

Last two banners were animated by one team member only, but he is the best.

  • Like 1
Link to comment
Share on other sites
Posted

Woah, you can run those on ADWORDS?!?

Link to comment
Share on other sites
Posted

Woah, you can run those on ADWORDS?!?

 

Yeap!

All the creatives I posted were made for Google Adwords.

Link to comment
Share on other sites
Posted

Nice one Predator. And you have mighty big area to play with.

  • Like 1
Link to comment
Share on other sites
Posted

Ya it's very cool to work on this type of banner =)

Link to comment
Share on other sites
Posted

PicTemplate.jpg

 

A brand new banner to catch your attention!
 
This banner uses a "classic" shooting mechanics but still has a fresh look because of the train as an obstacle. In terms of design we tried to use the industrial style and I hope you like it.
 
  • Like 6
Link to comment
Share on other sites
  • 2 weeks later...
  • 3 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
Login Create Account