5 Replies Latest reply on Oct 7, 2014 12:41 AM by CatSulzmann

    import png sequence and scrub through

    CatSulzmann Level 1

      Hi all,

      Can edge animate do something like this?

      Click on the 3D model and it will spin with mouse control

       

      http://visualscience.ru/en/projects/hiv/3d-model/

       

      So its a collection of images that when played, represent a spinning 3D object. Scrub right and the timeline plays, scrub left and the time line rewinds - and it will scrub in either direction forever.

       

      I have done something like this in flash, but wondered if edge can do this too?

       

      Thank you

        • 2. Re: import png sequence and scrub through
          CatSulzmann Level 1

          Hi Carlos,

          Thanks for your reply.

          I have tried that method, which works fine but I have 100 images per 3d object and 15 3d objects to put into my little program, so I'm not relishing the thought of individually adding opacity to each image. however I will if that is the only way.

          I also heard of a FW plugin that could import the png images as a sequence but heard it was too buggy.

          I have also tried sprite sheets but it doesn't take large numbers of images easily.

           

          My second query in all this is the mouse movement - I have found e.page x with jQuery that can allow for some mouse control, but it's just mouse move rather than click and drag-  so I'm still investigating this. Also it applies to the whole stage rather than just the images in question.

           

          Still quite stuck

          I love all the interactivity that edge offers and I'm sure it must be possible or there is a tutorial out there- but haven't found the perfect one yet

          Any more help would be greatly appreciated

          • 3. Re: import png sequence and scrub through
            Carmdq Level 1

            Look for creating sprite sheet animations in Google. That could be a way. Apparently it can be done through Fireworks too How do I import an image sequence into Edge?

            • 4. Re: import png sequence and scrub through
              Siva. Level 3

              You could easily achieve this 3D rotation effect using Sprite Sheets.

               

              The best way to create sprite sheets for Edge Animate is Adobe Flash CC 2014.

               

              Since you have 100+ images, you need multiple sprite sheets each having a max dimention of 1K x 1K pixels. (For making it mobile friendly)

              Each sprite sheet needs to be imported as a separate symbol in Animate. These symbols needs to be instantiated one after another in the stage.

               

               

              How import a PNG sequence as a symbol in Animate

              Using Flash,  create a symbol out of your PNG sequence -> Refer this

              Using Flash, export the symbol as a sprite sheet -> Refer this

              Using Animate , import the sprite sheet  ( created by flash) as a symbol -> Refer this

              • 5. Re: import png sequence and scrub through
                CatSulzmann Level 1

                Thank you Siva- that sounds perfect!

                I'll try it straight away.

                I expect the e.pageX jquery code will work great for the scrubbing fowards and reverse.

                Thanks again