• Content Count

  • Joined

  • Last visited

Community Reputation

37 Newbie

About flysi3000

  • Rank
    Advanced Member

Contact Methods

Profile Information

  • Gender
  • Location
    Brooklyn, NY
  • Interests
    computers, video games, photography, travel, food, hip-hop

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. flysi3000

    GWD, DV360, GMP and you

    I haven't experienced this yet, but not looking forward to it. I much rather use hand-rolled, or Animate if/when it makes sense.
  2. flysi3000

    Timeline.restart(), with child timelines

    You guys are the best. I'll do the easy fix for now (deadlines and such), but it's good that I experienced this, so I will definitely keep it in mind for the future!
  3. flysi3000

    Timeline.restart(), with child timelines

    Ok, here's a codepen demo. Let the animation play all the way through until the strokes disappear; then click the rewind button - the lines redraw, and nothing happens during the makeWaves() part of the animation. Then suddenly, the wavesOut() part of the timeline kicks in and they transition out. Weird, right?
  4. flysi3000

    Timeline.restart(), with child timelines

    @PointC the timeline restarts, but nested animation doesn't seem to play. I will try and cook up a demo and see if I can replicate what's going on on my end. Thanks for the suggestion about .onOverwrite, @GreenSock, I will give that a shot as well.
  5. flysi3000

    Timeline.restart(), with child timelines

    Hey! Longtime user, sometime-poster. I'm working on some ads that have a replay button. I have a secondary animation that plays at the beginning of my main timeline. That secondary animation is generated by a function that returns a timeline, and is called using add(). Secondary animation looks something like this: function makeWaves() { var tl = new TimelineLite(); tl .add('start', 0) .fromTo('#wave1 .teal', 10, {drawSVG:"0 35%"}, {drawSVG: "0% 95%"}, 'start') .fromTo('#wave1 .navy', 10, {drawSVG:"35% 100%"}, {drawSVG: "95% 100%"}, 'start') .fromTo('#wave2 .blue', 10, {drawSVG:"0 30%"}, {drawSVG: "0 90%"}, 'start') .fromTo('#wave2 .navy', 10, {drawSVG:"30% 100%"}, {drawSVG: "90% 100%"}, 'start') .to('#wave3 .blue', 10, {drawSVG: "80%"}, "start") .to('#wave3 .navy', 10, {drawSVG: "70%"}, "start+=2"); return tl; } Main timeline looks like this: this.timeline .addLabel("start", 0) .to(this.miranda, 0.6, {autoAlpha: 0}, 3.5) .add("f1", 3.7) .add(makeWaves(), "f1") //... more awesome animation When I hit the replay button, which calls timeline.restart(), my secondary animation doesn't fire. I tried setting timeline.restart(false, false) to avoid suppressing callbacks, but no dice. I also tried using exportRoot(), but I've never really been 100% sure how that works. Maybe I'm misunderstanding the use-case for this feature? Anything jump out at you guys that I might be missing? This seems implausible, but any reason using drawSVG would be part of the problem? I might try to put up a CodePen, but this is agency work, which is NDA'd by default, so I don't think I can share it publicly. Thanks guys!
  6. Holy smokes - that's fantastic. I knew there had to be a way to tween movie clip frames... Thanks @Carl!
  7. @davi yep, that's exactly my problem. Main Animate CC timeline has only one frame; I have a couple of nested clips with manual animation. Might follow your suggestion of making child clips into graphics. Thanks!
  8. flysi3000

    Looping Animation

    Throw up a codepen link so we can see what you're seeing and help troubleshoot, if you're able.
  9. Okay, so I have myself a hairy little situation here. I have a banner, built in Animate CC. All the animation is mostly contained in a TimelineMax, except for a couple of bits that were just easier to do as nested movieclips. I'm controlling those sub animations with "gotoAndPlay", from functions in the main animation tl. All that works great - except we have a pause/play/replay function in the banner that controls the main timeline, but not the sub clips. What's the cleanest way to get the sub animations to pause/play along with the main tl? Thanks!
  10. flysi3000

    Bannertime tutorial/questions

    This is great, @Gedas. Definitely tons of useful stuff in there, particularly calling out the helper functions, which I'm sure a lot of people miss. I might just have to fork my own version of the repo and make some custom templates.
  11. Hey @joe_midi, I've been doing some research into git hooks, and of course your medium post about it comes up as one of the prominent results. I was wondering about your setup - we generally create a new git repo for each campaign as well; are you pushing from each campaign to a single bare repo on the server? If I understand bare repos correctly, there's no working tree, so there's no issue with pushing from multiple repos > a single repo, correct? Thanks for the clarification!
  12. flysi3000

    Bannertime tutorial/questions

    Totally understandable - Bannertime is a great tool, but the docs are pretty sparse. SmartObjects are just normal JavaScript objects that you can use to create HTML elements. By default they will create <div> elements, but you can add a 'type' option and set it to 'img', for example, then give it a 'src' option, and it will generate an <img> tag for you. My workflow is usually like this: - extract assets from Ps, Illustrator (or whatever format your assets are in), preferably @2x resolution. - create SmartObjects in Bannertime - one object for each element that is going to make up the banner - initialize object states in the setup() method - for example, hide elements that should be hidden when the banner loads, eg. - start animating in the animate() method. You don't have to worry too much about Gulp, unless you're doing some custom stuff (eg. adding your own tasks, etc.). When you're ready to deploy/deliver, just type 'gulp prod' at the command line and you'll get a folder full of zipped up banners, ready to deliver. The one thing I wish were different, is the way backups are generated. You can generate backup images for your ads by typing 'gulp backup-gen' at the command line, but it automatically saves them into the /images folder for each ad, thereby adding to the final k-weight. ProTips: Image paths that you pass in to the "preload" section will be preloaded. If you want to limit the preloaded assets, just load the asset on-demand You can group elements in a container div by creating an empty SmartObject and setting the child objects' parent to the container element the properties of each SmartObject are basically css props, so you can pretty much add anything you would add to an element in css. Z-index, color, background-position, etc. Just make sure you use JavaScript format (eg. backgroundPosition, backgroundSize, etc.) That's all I can think of off the top of my head at the moment - if you think of any specific questions, please, don't hesitate to ask! EDIT: Thought of one more thing! Spend some time staring at the banner.js file - that's where the SmartObject is defined, and that will give you some hints as to all the features that they have. For instance, you can type something like myElement.set({autoAlpha: 0}), or myElement.centerHorizontal(), etc.
  13. flysi3000

    GSAP & Double Click Studio

    There's a bit of a learning curve, but if you use Bannertime, you can choose DoubleClick as the platform you're using, and it will scaffold out the files you need, including the appropriate include of DoubleClick's Enabler.js. It also sets up polite loading, clicktags, etc. I love no having to think about any of that stuff.
  14. Hey! Welcome to the glamorous world of banner dev! Re. Bannertime, I love it. It removes the issue of preloading/polite loading, and the various clickTag implementations from the equation, and lets you focus on animation. The presentation of the banner centered in the browser is just so it looks nice when being reviewed by clients or art directors; this has nothing to do with how it will look when it's iframed in its placement on a publisher's website. Bannertime's smartObjects are great too, in that they have some built-in functionality, like centering either horizontally, vertically or both; a toggle for setting retina quality, using svgs or embedded bitmaps, etc. Tons of convenience built right in. Oh - if you ever build ads with Bannertime for one format (eg. DCM) and need to change them later, you can just generate a BT ad for the new format, and copy/paste the contents of banner.loader.js into the existing version, and you're done. It would be nice if ad platforms provided up to date templates, but I find that I mostly like using my own, or, especially since the new version came out, Bannertime.
  15. flysi3000

    Flickering border on centered div

    Thanks for all the helpful suggestions, guys. I ended up using @jonathan's suggestion of putting the border on its own layer outside of the banner div, and everything's fine.