Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Clms

Morph: avoid sharp/pointy forms during transition

Recommended Posts

Hi there,
 

I was playing around with the morph plugin and liked it a lot.

I tried to morph organic forms into another, smoothly.

 

There is one issue I encountered; during the process, "sharp" edges are created - it does not look organic anymore until it reaches the final state.

It seems like it stops a short moment when reaching the final SVG form - I would love it to be a continuous, smooth process without any kind of stopping.

 

Would appreciate your input a lot. Please consider me an absolute beginner who is willing to learn about this :)

Thanks a lot,
Clemens

 

See the Pen GYvaYR by clmsvie (@clmsvie) on CodePen

Link to comment
Share on other sites

Hi @Clms,


The first thing is - so my point of view - to keep the SVG shapes as smooth as possible: all points as bezier .


The timeline then with yoyo effect (instead of jump back it runs back) ...

Here's a quick example:

 

See the Pen xyLvWq by mikeK (@mikeK) on CodePen

 

Happy morphing ...

Mikel

 

 

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×