Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
coco

Google Web Designer app -- Anyone use it?

Recommended Posts

Hi all

I'm fairly new here but really loving my initial forays into GSAP.  Gotta say I love it :)  I am new to HTML5 banner creation as well, though I've been coding for a while now. 

Anyway, anyone here using GWD to start off their ads for Double Click campaigns and then using GSAP?  I'm a hand coder so I tend to get more confused using tools like these but since watching a few of the DC hangouts where Google talks about HTML5 and GWD etc.., it seems to be a recommended workflow when having to add in the required code snippets for DC.  This 'could' save some time ..

BUT I've tried GWD and even a couple YT trainings on a basic banner ad with a tap area and I find the tool buggy and slow. 

Are there any banner creators here that use GSAP only and then add in the DC code OR are there hybrid users here too? If you are using GWD and come from a hand coding background,  what do you use it for, if at all?   I am asking because I don't want to waste more time learning a tool that I don't actually need.  I also do not yet completely understand the requirements for a DoubleClick ad .. hence my inquiring mind.

Thanks ahead of time.  Love this forum!
Coco

 

Link to comment
Share on other sites

There's a rather long topic going over the differences of going from full on hand code to full on application based and everything in between.

 

As to your specific question: There's all sorts of devs here. I would say, from reading the forums, that every single shade of skill/preference/experience is here.

 

I, personally, do write all the code myself. No libraries except GSAP and whatever the Ad Platform demands. The rest is vanilla JS.

  • Like 4
Link to comment
Share on other sites

Thanks Dipscom... The more I hang out on these forums and keep searching, the more I realize how many questions I have are already answered.  Really informative here.. and thanks for the link!  I've already gleaned some nice gems of information. 

:)

  • Like 1
Link to comment
Share on other sites

I've used GWD, but personally, feel limited within the IDE.  At least it's limiting when working with some of the designs that are passed on to me for development.

 

At the moment I'm working out a Gulp.js build system for banners that will allow tackling banner development using methods closer to a MVC approach.

 

To better answer your question though:  I avoid the hybrid approach.  Mostly out of concern that it is going to lead to bloated output, primarily on the GWD side.

 

As far as the application of GSAP animations to DOM elements is concerned, I keep all animation calls in its own self-contained layer.  Unfortunately, due to legal restrictions I don't have anything that I currently share.  I'll get something shareable pushed up to BitBucket sometime in the next week.

 

Here's the overall anatomy of an HTML5 ad built for upload in DoubleClick Studio:

 

index.html - ad markup, Enabler and Studio component init calls

ad.css - Ad styles.  Also, if you are using webfonts that are not CDN hosted, optimize them and embed as a data URI.

ad.js - Contains the meat of your Enabler logic (Reminder to make initial Enabler component calls in index.html to make sure Studio detects the components)

animLayer.js - Contains all GSAP calls.

dynLayer.js - Optional - Contains all special logic for handling data used in Dynamic Ads.

 

That's my current setup.  Once the Gulp build has been completed, all JS files will be aggregated and minified into a single script file.

  • Like 1
Link to comment
Share on other sites

I would say that GWD has advantages related to doing Rich Media quickly, and outputting files simply by publishing. I know every time I look at the DC template data base I see new GWD templates have been added.

 

I modified a Swipe Gallery GWD template just with my HTML editor of choice.

 

A big part of Rich Media is the metrics, and sometimes frequency caps.

Link to comment
Share on other sites

Pizzaman ..
Great points. I much prefer the pure hand coded way. Cleaner and appeals to my sense of order. I am trying out the sonamblst methodology too as it does have its merits.  The templates from the Rich Media Gallery seem to lay out a good foundation for some more complicated event tracking with the required JS baked into the html.   I am leaning toward starting off with Gulp too. I've seen some wonderful github links here regarding this.  

I'm exposing my excitement but ever since I discovered GSAP, a whole new world of incredible possibilities have me coming to this forum more than any other.  
....  Audible geek squeaks  .... 

 

  • Like 1
Link to comment
Share on other sites

After a few ad campaign made with GWD i have decided not to use it anymore. It has a weird and slow interface, generating huge, redundant code, producing random errors. Pain in the *** to make modifications on the timeline. And finally and most importatntly it ruins it's source code sometimes. Rendering whole finished files unmodifyable, or unplayable. It's a JOKE.

Link to comment
Share on other sites

I also used GWD for a few banner campaigns but this tool is still young...

too much time lost doing simple tasks, compared to hand coding. and time is money :)

 

I still miss a good GUI (like flash) to manipulate the elements, but found an alternative for my workflow thanks to a chrome extension :
https://chrome.google.com/webstore/detail/positionable/hcakmjkjjgaehnnflnelfngbhnppgnpp?hl=fr

 

+ a custom-made js timeline bar like GWD to control the animation...

 

And yes, gulp is really a time-saver too, you should learn it, it's quite easy (or nodejs)
 

  • Like 1
Link to comment
Share on other sites

  • 4 weeks later...

I use it for now until I get more comfortable with GSAP and can verify that the vendor my company uses won't count the cdn against our filesize limit. 

 

I really don't like GWD. It's simple, but it's also annoying. I've managed to create a few templates for changing copy that I can use and just modify the CSS as I need, but the design view likes to generate its own crazy css a lot of the time when I don't mean it to. It's kind of like design view in dreamweaver that way I guess. 

 

Necessary evil for the moment I guess, but I haven't had to do anything too fancy in it yet. 

Link to comment
Share on other sites

Candice if you were Flash fluent before trying GWD, you may want to try Flash CC Canvas export with CreateJS. it solves the font problem, you simply break apart your text twice and it stays sharp even when scaled up. You only have classic tweens, but motion presets still work.

 

The banner specific things you have to do are uncheck create spritesheet and overwrite HTMl if you use GSAP so you don't have to keep adding it back in every time you Test.

 

You uncheck spritesheet because it creates a JSON file DC does not permit.

 

Other than the overly long intro, this MAX presentaion is very informative, and it is banner specific.

 

https://images-tv.adobe.com/avp/vr/155ad5fb-a467-45ba-a599-6f0e3b4806ad/3e5d068a-7998-41d1-8607-d4f04a5579df/1aa439ad-0773-4ee7-b88b-28393984b4a0_20151007114929.854x480at800_h264.mp4

 

Let me know if you have questions, tthere are a couple other banner specific tips.

  • Like 3
Link to comment
Share on other sites

I have used GWD for a limited period of time. It is useful for small applications, bigger and complex applications will be much harder to build upon it,

  • Like 1
Link to comment
Share on other sites

  • 2 months later...

I use GWD all of the time and while the interface is slow, I'm able to create some very complex banner ads under 40-60k. I'm learning green sock because of the Sizmek ad network and I recommend NOT using their GWD/Sizmek workaround pdf. It's actually outdated. 

 

I wonder if I were to open a new file in GWD just as an HTML doc and code with Greensock. Haven't tried it yet but I hope that I can still use the preview tools.

  • Like 1
Link to comment
Share on other sites

Edge is much better than GWD.

Animate CC is much better than Edge.

Hand coding DOM with proper tools and workflow is the best, but You have to fight Your way throu the CSS. ( Or simply get around it.)

 

IMHO.

  • Like 1
Link to comment
Share on other sites

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
  • Recently Browsing   0 members

    • No registered users viewing this page.
×