Hi everybody！I'm working on a project and facing some problems. Does anybody know how to blend two shapes with framer , like two circles mix together?
Intriguing question. At first glance that kind of meta ball effect seems beyond the capabilities of Framer. A quick search led me to this: http://www.somethinghitme.com/2012/06/06/2d-metaballs-with-canvas/
You can simulate something like that with some really advanced SVG filters.
Like in this pen: http://codepen.io/lbebber/pen/RNgBPP
You're in luck! Someone on Twitter recently shared this article that answers what you're looking to do.
You can combine blur with contrast on the parent element to get something similar. The contrast will mess with the color though so you might need to adjust with color filters.
Joshua Tucker wait, it basically is just a sharpened blur filter ? That's it ? Wow, I thought it's more complicated than that.
Andreas Mitschke I didn't realize how easy this was until I read this as well.
Joshua Tucker as I was reading the article it just came to my mind that there is an old technique for Photoshop to get rounded corners in the same way (gaussian -> channel contrast). Used it in PS7 quite often actually.
However, using blurring filters and then recalculating it to flat surfaces again is very resource heavy. Let's see :D
Andreas Mitschke Nice! Hit us up back here if you run into anything exciting :).
Depending on how you are planning to use the effect, you could do it in After Effects or the like and trigger it as a video as well, if it causes too many issues.
Dose anyway to make two ball being longer when u drag one of them?
You can use an sag sprite and hack it in.
Here's another alternative with Paper JS.
Jordan Robert Dobson,Have any information about “sag sprite..?”
SVG sprite. Sorry.