Skip to main content
key10reeder
Adobe Employee
key10reeder
Adobe Employee
November 1, 2022
Question

SVG animations that include raster/photographic images?

  • November 1, 2022
  • 1 reply
  • 924 views

I'm looking for a lightweight and smooth way to make animated ads that have the ability to include photo information.

I'm aware that SVG animations can be done simply with vector graphics using plugins like Lottie or Bodymovin, but those seem to have issues when including raster data. Does anybody know a method of animation that combines the smoothness and low file size of SVG, with the addition of a raster image?

For instance, elements like text, buttons etc. would be SVG vector, but there would also be the inclusion of a photograph or raster-based image along side the SVG elements? Is this possible out of AE, or any other programs you know of?  Thanks in advance. 

This topic has been closed for replies.

1 reply

Mylenium
Mylenium
Legend
November 1, 2022

Animate, not After Effects - or whatever is you favorite other non-Adobe graphics program. The programming would require to manually edit the file, anyway, so there's not much point using a program that was never designed for this like AE and using a crutch like Lottie/ Bodymovin.

 

Mylenium 

    key10reeder
    Adobe Employee
    key10reederAuthor
    Adobe Employee
    November 1, 2022

    Thanks for the response. I haven't fully worked in Animate since my Flash days of yore. I recently tried opening it up and doing a simple animation, but it appeared as if the animation was made in the early 2000s... very clunky and rough. In your experience are there ways of making smooth crisp keyframed animations that are indiscernalbe from an AE animation, or are animations from Animate always going to look a bit clunky and dated? 

    R
    Community Expert
    Rick GerardCommunity Expert
    Community Expert
    November 1, 2022

    Check the Animate user guide. You can do some amazing things with bitmap images.

     

    After Effects is the last tool I would choose if to animate for the web. AE makes pixels. Pulling vector information out of AE is a hack. No offense to BodyMovin or Lottie, but it's just a hack. There are severe limitations to the process because you are using a hammer to drive screws. 

     

     

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices