Morph: avoid sharp/pointy forms during transition

[Clms 2 Likes (Newbie)]

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

[mikel 4,782 Likes (Superhero)]

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