Jump to content

Good Looking Software

  • Posts

  • Joined

  • Last visited

Profile Information

  • Gender
  • Location
    Somerville, MA
  • Interests
    opera, running, iOS

Good Looking Software's Achievements


Newbie (1/14)



  1. I tried force3D false and true and neither seemed to have an effect. If this is a known work-around to the webkit bug, I must be doing it wrong.
  2. PointC, Just saw your post. I'll try that out tomorrow and let you know if it worked. Thanks! Aaron
  3. I have an animation with lots of SVGs. They are rendered beautifully, scaled up and everything, on initial load. Once you move forward or backwards in the animation (by clicking one of the big blue arrows or a light brown mangrove root), the roots become blurry, especially the ones closest to you, even after the animation has completed. The animation is mostly one timeline which loops. It begins paused. The motion is created by advancing in time in the timeline by passing a value to pause. I looked around online and saw some suggestions like setting transform3d to auto, but that didn't work for me. I'm hoping this is a familiar problem to you veteran animators. I've attached a before (left) and after (right) picture but looking at the animation is probably the easiest way to see the behavior: http://catalyst.goodlookingsoftware.com/a/ Thanks again! Aaron
  4. I did not end up using another library for canvas. I found a network bottleneck that I cleared up and the client was happy enough. I can give more detail on that if anyone who helped me is curious. Thanks again.
  5. Since my #1 concern is performace/speed, sounds like Pixi is the way to go. Thanks for the collision demo.
  6. Thanks, OSUBlake. I'm going to give fabric a shot this week and report back with my findings. There's a fabric setting--something like perPixelSelect--that tells fabric to only use the opaque part of an image for mouse events. That's what I was getting at with the transparency stuff. I've got 30 images stacked that are mostly transparent except for the image or a tree root that passes through it. So, the root visible to the user might be 10 images down the stack.
  7. I'm not seeing a critical piece: a way to send mouse events through the transparent portions of stacked elements down to the first visible opaque element. Do you know if fabricjs or another library can handle that? Would this be instead of GreenSock? I'm trying to figure out if my best chance at success is to shrink and simplify what I have or port it to something like fabric. Thanks again, Aaron
  8. Thanks for all of your input. I'll check out FabricJS and stacking. I also have to research whether I can register mouse events in canvas. I need those.
  9. Thanks for all of this! For #4, any tips? I use the z-index a lot. For example, should I do extra math to ensure the z-indices are only incremented at intervals? Should I try to limit the frequency any z-index is changed or how many z-indices change when any z-index is changed? For #6, do you mean that I should wrap the animation elements in a canvas tag or is there more to it than that? For #7, do you do this in the css? pointer-events: none; I do that for elements that intercept pointer events, but should I be doing that on any element I possibly can? Thanks again. Very helpful! Aaron
  10. My animation is slow but my various browser debugging tools don't show where the delay is happening. I will post again with specifics and a Codepen if this fails, but could someone take a look at my animation and tell me how they would approach understanding its performance? What tools do you use to see how long things are taking, how memory is being used, and where the bottlenecks are? http://catalyst.goodlookingsoftware.com/a/ Many thanks, Aaron