6 Replies Latest reply on Aug 30, 2013 6:01 AM by AMULI

    Duplicated Symbol animations going out of synced

    ksn_wYn

      Hi all,

       

      I'm running into a problem with my symbols, they seem to be going out of sync in my animation. I'm using multiple instances of the same symbol.

      See below link for the .html file for example of what I mean. The wings go out of sync after awhile, even though they're the same symbol.

       

      Would appreciate if someone can help me understand what's going wrong.

       

      https://www.dropbox.com/sh/r5tkadrj8mxb92y/dZnWA9lkEN

       

      Thanks

      wYn

        • 1. Re: Duplicated Symbol animations going out of synced
          AMULI Level 4

          Hi wYn,

           

          Please update your dropbox with a ZIP containing all the files : they will be easier to download and I will look at them.

           

          Gil

          • 2. Re: Duplicated Symbol animations going out of synced
            ksn_wYn Level 1

            Hi Amuli,

             

            I've compressed the files into one, thanks!

             

            wYn

            • 3. Re: Duplicated Symbol animations going out of synced
              AMULI Level 4

              Hi wYn,

               

              By rotating a PNG32 file 100° then another 100° back in 1 s, you put a high pressure on the rendering engine , especially if you duplicate twelve times on your stage. The browser can't supply enough computing power to your demand, hence the flapping of wings going out of sync.

               

              Your edge file isn't optimal. Something awkward, is that you had a good idea with a first symbol wings_single instantiated twice in a second symbol wings_set, but your implementation is not correct :

               

              in wings_single you have two interpolations on the rotation angle in parrallel (you double the computing demand, without taking advantage of instantiation), then in wings_set a single instantiation of wings_single (so that wings_set is useless).

               

              Try this : only one interpolation in wings_single, instantiated twice in wings_set (one instance being flipped horizontally).

               

              Another track : if your stage background is solid color, get rid of transparency (alpha layer) by already placing your wing on a background of that color and exporting a PNG24 (RGB) instead of a PNG32 (RGBA).

               

              Keep me informed of the results.

               

              Gil

              1 person found this helpful
              • 4. Re: Duplicated Symbol animations going out of synced
                AMULI Level 4

                I'm also wandering if rotating a vector version of the wing would behave better than with the current bitmap version, but I have no idea about which is the winner.

                 

                The question is : adding the rasterizing step in the flow, will it increase the computing  demand or not ? Could be interesting to test.

                 

                Gil

                1 person found this helpful
                • 5. Re: Duplicated Symbol animations going out of synced
                  ksn_wYn Level 1

                  Hi Amuli,

                   

                  Thanks for your help.

                   

                  I didn't realize browser computing power could be a problem.

                   

                  As for the wings, I initially did rotation animation on one wing, turned it into a symbol, and instantiated it flipped horizontally, but I ended up with the problem of the left wing being unsynced with the right wing, so I went ahead with doing the animation manually to fix the problem, but forgot to optimize the symbol hierarchy.

                   

                  I'll definitely keep optimization in mind from now on.

                   

                  Thanks again!

                   

                  Cheers,

                  wYn

                  • 6. Re: Duplicated Symbol animations going out of synced
                    AMULI Level 4

                    I didn't realize browser computing power could be a problem.

                     

                    When you apply transformations to bitmaps

                     

                    • translation : it's just a matter of modifying the (x,y) of each pixel by a given offset. Graphic cards always had built-in circuits for such operations and they are fast to render.

                     

                    • scaling down means sub-sampling the original pixmap : fast.

                     

                    • scaling up : it implies re-sampling the original pixmap (for each pixel, computing the transformed pixel)

                     

                    +interpolating the value of pixels in between the transformed ones. More demanding.

                     

                    • rotation : it again implies re-sampling the original pixmap

                     

                    +this time, computing the transformed pixel implies calls to trigonometric functions (sin, cos), which are expensive

                     

                    +interpolating the value of pixels in between the transformed ones. Much more demanding.

                     

                    This is true for a single transformation. Now animating, you ask for those expensive computations say 200 times a second !

                     

                    And cloning the object, you finaly multiply by 12 the demand. It seems to be too much for the computing power of today's PC 

                     

                    Work with the constraints and make them to your advantage. To my eyes, the out of sync effect of flapping does not look like a "defect" : it gives individuality to each, when six perfect clones flapping in sync look coldly mechanical

                     

                    Gil

                    1 person found this helpful