Forum Discussion

ChrisAU's avatar
ChrisAU
Community Member
2 days ago

GSAP Shape Transformations

Hi all,

Just wondering if it is possible to animate a shape (eg. a rectangle) transforming into another shape (eg. a circle) using GSAP?

I use lots of basic GSAP in my projects but haven't figured out how to do this or if it's possible.

Thanks in advance.

e-learning development
storyline 360

2 Replies

  • Nedim's avatar
    Nedim
    Community Member
    1 day ago

    Ever since GSAP was acquired by Webflow, all GSAP plugins have become available for free to all users. Unfortunately, Articulate has not upgraded to include the newer free version, so plugins such as MorphSVGPlugin still require registration when used within the default Storyline environment.

    In the past, I have created examples by integrating a newer GSAP version into Storyline to take advantage of the MorphSVG plugin. Technically, the process involves targeting SVG shape paths and using GSAP animation methods to morph one path into another. No webobjects involved.

    Examples are provided below. One I posted for an ELH challenge, where you can see where the Morph animation was implemented.
    LINK (example 1)

    (example 2)