Jump to content

Dipscom last won the day on July 19 2019

Dipscom had the most liked content!


  • Posts

  • Joined

  • Last visited

  • Days Won


Everything posted by Dipscom

  1. I am having feedback from different sources telling me that autoAlpha is not doing its job when working with the YouTube player. I am very skeptical of it but cannot replicate it as the claim is for IE11 on Windows7 and Windows8 - I am on Windows10 and was foolish enough to convert my older laptop into a Linux only box... The codepen is as bare bones as I can possibly make, due to the extra components needed to test this very particular scenario. At the moment I am really just looking to get a confirmation whether this is really happening or not. Anybody out there has a machine with Windows 7 and can verifty this for me? Many thanks.
  2. For self hosted font there is one big non-legal downsize: Your server is not going to handle it. Unless you have a professional dedicated server, of course. It will be hit thousands of times when the ad is served. Legally speaking, if you're not talking about webfonts that are already out on the wild and are royalties free - e.g. Google fonts, you're putting yourself in line for a potential breach of copyright if you don't license it. If you do, it is quite costly. Now, as for converting the font from Illustrator into an SVG, the step you are missing now, somnablst, is to actually convert the text into a curve before doing the copy/paste. Some software will talk to each other and know which font to reach out for on your system (Edge, for example) but, when you go into IE, it's a different can of worms. It does not understands the link that references the font in your system and so, it defaults to whatever it can. So, you can continue using Illustrator for the SVG if you take the extra step to convert the text to outline (or whatever it is called in the program itself), which may, or may not be more conveninent than transparent PNGs.
  3. Funnily enough, it was something we were discussing not long ago. http://greensock.com/forums/topic/12494-question-about-when-css-props-are-set/#entry51978 The official is not known just yet but you have reached the current workaround.
  4. I personally, given the chance, will avoid getting the QA certification at all costs. The last thing I want is to be the one officially responsible to answering to it when the thing (doubleclick) breaks.
  5. Ah Joe, I did forget to mention one crutial detail: This is a YouTube masthead placement. And the YouTube masthead placements, in my experience gets all of the overzealous QA engieneer. Like yourself, up until today, I have had zero issues with the CloudFlare CDN. But today, that happened. So, I thought I would report. Hopefully, Carl's contact will send the memo down to that particular QA department. I mean, just so you have an idea of the level of pickyness - There's a YouTube logo at the bottom left of the creative, that was also a point of rejection in the QA report. The irony of it. That logo was provided by no other than: YouTube.
  6. I know there is a DoubleClick CDN topic but because Google has too many little rules for their different ad platforms, I thought I would make this topic especifically for their Rich Media account as the other CDN topic seem to focus more on their Campaign Manager details. So, carl help us here, please: Like you said, I am getting in touch to let you know DCRM has rejected one of our ads because we linked to GSAP via the CDN you guys provide. For now, the client is getting very twitchy so I am going to drop the library in and reference it locally but if you have a contact at Google and would like to poke them with that, it would be great. And, if they have finally sorted out their own CDN for GASP, could you let me know? Attaching a pic of the rejection report in case it helps you. I had to redact some bits due to client confidentiality.
  7. What is happening you have explained quite well. The .set() is being triggered right at the start of the master timeline. As to why I can only speculate. What I see the reason being is because .set() is a 0 time event, there is nothing to use as a reference point when calculating its position. So, it happens instantly. However, if you tweak your code to have something happen before it or have set happen a second into the timeline, then, there is something to reference and you get the behaviour you were expecting. I didn't fork anything because I am lazy but just add, 0.1 at the end of your .set() and you'll see pretty kitty's eyes. You will have to ask the ALMIGHTIES for a more real reason why it happens. I can only offer what I think is happening. If you multiply anything by zero, you get zero.
  8. I wouldn't call my stuff inspiring but I will pluck some of the work I have done up and place a couple of things here soon(ish). (Time measured in days - not minutes).
  9. Internet Explorer being the wonderful joy that it is, does not play ball like all the other browsers that I test with. So, I was wondering what tricks people had and what behaviour they have noticed when creating the large invisible button for banners in general. Not the acual clicktag itself, just how to make sure it behaves like a button. I use one of two techniques depending on my mood and whether theres need for roll over states. Technique 1: A transparent 1x1 gif, set to 100% width and height. Then, good old javascript to handle the click. HMTL <img src="transparent.gif" id="clicktag" /> CSS #clicktag { width: 100%; height: 100%; cursor: pointer; position: absolute; left: 0; top: 0; } JavaScript document.getElementById("clicktag", onClick); function onClick() { // Relevant code } Technique 2: I write a loop that add the click functionality to all assets (div, images, paragraphs, etc) and the cursor CSS rule. Then, I have the onClick function filter who's been clicked and decide what needs to be done. The reason for that is because I have seen IE not working correctly with a third technique I used - an empty <div> tag, similar to the transparent pixel one. I am still not 100% sure the transparent pixel works because I have not tested enough. But it seems to me that the cursor: pointer CSS does not always work in IE. Does anybody else see this or am I just with a broken copy of this crazy browser?
  10. Can confirm the issue in Safari and also that Diaco's answer fixes the issue.
  11. Hello, welcome! Just to add a semi-pro tip, on top of what Ohem has already answered. If you are Tweening using the id of the object and you know you won't be using the variable anywhere else, you don't even need to refer it as '#idName', you can pass the id name as an object and TweenMax will find it without the need of any other external selector engine (it has its own). So, you can just write idName, without the quotes and without the #. Like this: http://codepen.io/dipscom/pen/zvrWqz
  12. It is the general concensus that GSAP in many of Google's ad platforms are allowed. Google itself even recommend using GSAP as pointed out somewhere in this forums. I have ads served via AdWords that make use of GSAP via CDN, there should be no reason why you should not. Let me go back on that, just went and checked the files I was thinking of and it is not linking to GreenSock via CDN. So, Carl's right and I was horribly wrong by saying thinkgs without checking their veracity first. The crux of the question is the difference between external files and files hosted in CDN. Meaning, there seems to be a disticntion between them and certain libraries in certain CDNs are whitelisted. /* Carl, trigger happy on the keyboard as always - I shall learn to touch type because of you */
  13. WebGL is 3D in the browser. It is <canvas> on steroids. I have dabbed a bit with it on the past. Very keen to work more with it but the opportunity never arrives. ThreeJS and PlayCanvas make very good poster boys for it.
  14. I have no idea, somnamblst, I never know which is which - Other than the help guides for AdWords is on blue background and the ones for DCM on green. How many ad platforms Google owns is beyond me.
  15. I am very happy to hear that the GSAP team is happy to have us ( banner people XD ) here. To me, it is pretty baffling that there isn't a place where you can exchange knowledge about banner workflow but I don't think it is because there are secrets to be kept... Actually, there are secrets to be be kept - one secret - the fact that one makes his living of banner ads. The amount of times my friends and co-workers have giggled and made fun of me for improving my workflow or bothered to read the help files from the ad platforms is quite shocking. In the end, it is cool to be a backend developer. It is cool to be a frontend developer, a digital animator, a digital designer. But say you make banners for a living and you managed to squeeze a transparent png dragon with animated fog and a paralax effect in a 300x600 with a 40kb limit and they'll laugh at you. At least here, I'll be able to go nerdy full throtle and have people actually care. There you go, vent over.
  16. Can we use it to discuss other techniques and problems related to the industry as a whole? I have a question that has ZERO relevance to GSAP but I am yet to find another forum that is focused in the displa ad industry.
  17. Nice one, challenge now is to find the time to go over those things. XD
  18. I feel your pain. Just recently I had an issue myself where the project manager wouldn't do much to help me troubleshoot. She would send me the specs over and over again, ask me to refer to them and review the code because they were unable to upload. The only feedback was a screenshot cropped all the way down to the warning window saying the ad could not be uploaded because it was missing the <meta> tag with the ad size. Believe me I reviewed the code several times and that one tag was definitely in. They wouldn't give me access to the account to troubleshoot so, I created myself one in AdWords, tried to upload, saw a completely different error, fixed it and that was the end of the struggle. In the end the cause was because inside the svgs I was using there were <style> definitions and for some reason, that is not allowed. Might be worth you trying to have an account yourself for troubleshooting.
  19. I have served many a banner with a background way larger than the parent div. Like, twice the size. The problem with yours might be on the file setup. Have you got the meta tag with the correct ad dimensions, for example?
  20. Is this number of files limit a US only thing? I have looked around several times and never seem to find it. For all my digging around in AdWords (Google's standard ad platform as far as I know) I can only find this, and there is no mention of maximum number of files. If anybody has a link to the correct documentation, please share. It's always best to have a link to the official specifications.
  21. How punitive are we talking here? If you're in the realms of the 40kb, get ready for a world of pain... You will probably have to make do with much, much, much simpler animation, use CSS transitions or consider a more limited/lighter library. OR You could (should) push back and explain the pros of using CDN for Greensock, then you can use the whole suite of tools without breaking a sweat and deliver amazing results even with those punitive file restrictions. Have a read here. Specially the bit that it explains about CDNs and why use them.
  22. Hi Schoopie Doo, there's another thread already talking about it. It is aptly named: Banner layout workflow have a check there. I know I wrote some words relevant to your question and there are other suggestions there as well
  23. Hi guys! Sorry, mad few days, not much time to be around. So, QA. Well, as some have been saying, it is the Wild West at the moment. It's every man/woman/parrot for himself. That holds true to QA as well. Each ad serving platform will have their own QA process and they will let you know what that is. But the majority of stuff is the same as it was in flash. I am not aware of any automated tool to check QA/Clicktags. To be honest, I simply make too many of those that I end up knowing the stuff by heart. Mostly is just common sense and "don't be annoying" stuff. Other than that, I don't have much to add from what earlqa has said.
  24. My personal workflow is like this: Get the psd from the designer, clean it up (let's not talk about the sea of unnamed and repeated layers, or old assets left behind from previous versions). As I clean the psd up, I create a bunch of Smart objects for the assets and one artboard for each banner format. Then is just a matter of creating one set of "source" assets to use Photshop's Generate Image feature (Seriously, if you don't know about it, read into it). Having the smart objects means you can get the CSS position and size of all assets very easily. Having all different banner sizes in one file makes it easy to work in several sizes in one go. Anything that can be an SVG will be an SVG in my banners. Only photos will not be converted to vector. Then, it is just a matter of how you set your folders up, either you copy the assets generated by Photshop or not. Coding-wise, it will be down to how you work. Personally, I hand code it all. Like leedium here, I am building my own tools to automate a bunch of repetive tasks. Mine is using Gulp. Feel free to have a look, use, fork, comment. Just don't expect I will be fixing stuff to suit your needs. Do bear in mind it is a work in progess, not ready for production pipeline yet. I split the images, CSS and JS that is shared by all banners in a shared folder, together with the index.html (you really should only need one html if the banners are meant to be the same), all personalised image, CSS or JS goes into the individual banner folder. I'm keeping it ad-platform agnostic for now because I end up working with different ones all the time. It is not practical for me to have it baked in just yet.
  25. If you have all your tweens in one timeline: mainTimeline.play(0); *Magic*