Morphing Shapes

I'm trying to morph one shape into another shape. Is that possible?


I'm also trying to create a dropping motion for a tear drop. Nothing seems to work as I need it to. The Throw and Gravity behaviours don't accelerate fast enough. And the Motion Path doesn't accelerate at all. Any suggestions?

MacBook Pro 13″, macOS 10.15

Posted on Jul 3, 2020 9:42 AM

Reply
Question marked as Top-ranking reply

Posted on Jul 3, 2020 4:53 PM

Hi


As Luis recommends please include visual references to the project or the ideas you are working on to illustrate what you have in mind.


About morphing shapes

There are no dedicated 'shape morphing' tools in Motion.


There are 3 options I use and these are for shape layers made in Motion, not images imported.


1: Keyframe the points directly. Motion only provides linear interpolation when editing points so the results cannot have any easing in the speeds of the animation.

https://support.apple.com/en-nz/guide/motion/motn173b4891/mac


2: Onion skin the animation

Like a flip book, patiently create the animation frame by frame, you can get some nice results with this method and it can save time compared to directly editing points depending on the project


3: Filters

With a combination of blur and levels you can get a morphing of shapes that might suit the project.

https://www.youtube.com/watch?v=hOE07O66Tbc


A fourth option in some cases that could work is to use replicators running a sequence replicator behavior.


These are all the options I know of and use to morph shapes. I'm sure others here have more tips for you.


The tear drop.


There are various ways to animate a tear drop ... I guess you have in mind something that grows and travels down. Please provide us with specific visual references to help you further.


For a tear drop animation 3 ways that I'd usually look at first


1) Emitter with scale over life.

Information on emitters here

https://support.apple.com/en-nz/guide/motion/motn8eab5e27/mac

https://support.apple.com/en-nz/guide/motion/motnc0dd1c6c/mac

Information on scale over life for particles here

https://support.apple.com/en-nz/guide/motion/motn14e89d6b/5.4.4/mac/10.14

https://support.apple.com/en-nz/guide/motion/motnc0dd1c6c/mac


2) Bezier with an airbrush/paint stroke brush.

https://support.apple.com/en-nz/guide/motion/motn173b9a07/mac


3) Animated shape on a motion path - the motion path behavior can accelerate - there is a specific acceleration speed setting or you can create your own custom speed with the 'custom' setting.

https://support.apple.com/en-nz/guide/motion/motn137445dd/mac










10 replies
Question marked as Top-ranking reply

Jul 3, 2020 4:53 PM in response to Sunshine_82

Hi


As Luis recommends please include visual references to the project or the ideas you are working on to illustrate what you have in mind.


About morphing shapes

There are no dedicated 'shape morphing' tools in Motion.


There are 3 options I use and these are for shape layers made in Motion, not images imported.


1: Keyframe the points directly. Motion only provides linear interpolation when editing points so the results cannot have any easing in the speeds of the animation.

https://support.apple.com/en-nz/guide/motion/motn173b4891/mac


2: Onion skin the animation

Like a flip book, patiently create the animation frame by frame, you can get some nice results with this method and it can save time compared to directly editing points depending on the project


3: Filters

With a combination of blur and levels you can get a morphing of shapes that might suit the project.

https://www.youtube.com/watch?v=hOE07O66Tbc


A fourth option in some cases that could work is to use replicators running a sequence replicator behavior.


These are all the options I know of and use to morph shapes. I'm sure others here have more tips for you.


The tear drop.


There are various ways to animate a tear drop ... I guess you have in mind something that grows and travels down. Please provide us with specific visual references to help you further.


For a tear drop animation 3 ways that I'd usually look at first


1) Emitter with scale over life.

Information on emitters here

https://support.apple.com/en-nz/guide/motion/motn8eab5e27/mac

https://support.apple.com/en-nz/guide/motion/motnc0dd1c6c/mac

Information on scale over life for particles here

https://support.apple.com/en-nz/guide/motion/motn14e89d6b/5.4.4/mac/10.14

https://support.apple.com/en-nz/guide/motion/motnc0dd1c6c/mac


2) Bezier with an airbrush/paint stroke brush.

https://support.apple.com/en-nz/guide/motion/motn173b9a07/mac


3) Animated shape on a motion path - the motion path behavior can accelerate - there is a specific acceleration speed setting or you can create your own custom speed with the 'custom' setting.

https://support.apple.com/en-nz/guide/motion/motn137445dd/mac










Jul 5, 2020 5:48 AM in response to Sunshine_82

Hi


Here's a link for a project file with a tear forming as the shape descends

https://www.dropbox.com/s/9p5ikey3ddasukw/Tear%20%26%20Stars.motn?dl=0


To do this I started with a circle converted to points. I used the recording keyframes to change the shape of the circle to the tear by adjusting the point position and handles to make the contour. To make it fall in this case I just animated the tear group to move down. This is generally the process I suggested before. Like I mentioned before, when keyframing points of a shape, there is no interpolation other than liner available, so the morphing animation is plain, but over a short duration it passable.


I also including a replicator of stars rotating - something I saw you were discussing in another thread. The rotation is done here by animating the offset of the replicator with a rate behavior but this is purely for demonstration sake. You would want to keyframe the offset directly to get exact control.


hope this helps.

Jul 4, 2020 8:07 PM in response to Sunshine_82

Hi


To make the tear shape morph/form I would keyframe the points directly. This is where the recording keyframes feature will be useful. I don't think wriggle shape is the best tool for this.


From what you present in the screen shots I think you will be fine using the motion path and use the custom speed setting to create the speed curve you want. Otherwise, just animate the shape on the Y axis directly.

Jul 5, 2020 4:23 PM in response to Sunshine_82

Hi


Accelerate the dropping? The keyframes are there, you can adjust them in any way you need. You will need to work with the keyframe editor to make changes.

https://support.apple.com/en-nz/guide/motion/motn1474ab82/mac

https://support.apple.com/en-nz/guide/motion/motn147486cf/mac


In the screen shot I can see that the '5 sided star 1' layer, which is the source fo the replicator - is not active on that frame - so the replicator is not being sent anything to display yet. Make sure the source object for any replicator is the same duration as the replicator.


I don't know why the replicator does not respond to the rate behavior on the offset parameter in your project. I recommend making a new replicator from the start. Between the demo I made for you and your own project and I can only guess at the cause of that difference in function.


Make a new replicator and then see how it goes from there.

Jul 3, 2020 11:47 AM in response to Sunshine_82

All those behaviors have many settings that you can tweak.

Perhaps you could post a few screenshots of your current project to help us better understand what you are trying to achieve.

What shape are you trying to morph into what? Is this a shape built in Motion, or imported as an image?

Without more details it is difficult to make a suggestion. I am guessing that you will be able to achieve what you want, but need more information.

Jul 4, 2020 2:27 AM in response to rowie302

Thanks for the help, everyone. I'll need to review all of the links in full later, but for now, here's some clarification of the tear drop project.


The idea is to show the slow enlarging of a drop of water, maybe even morphing its shape before it forms into a drop, then having it transition smoothly into a traditional tear drop shape before falling downward. Acceleration would be helpful (so it speeds up as it falls).


Here are some screenshots in sequential order as the drop fades in and changes shape.


This is towards the end of the shape changing (right now I'm using the Wiggle behaviour to change the shape) before the drop changes frame to the traditional tear drop shape. Problem is that the change is not seamless and it lurks from one shape to another without a smooth transition.


Are there any methods that are ideally suited for this project?

Jul 5, 2020 8:02 AM in response to rowie302

Wow, that helps a lot. Thanks!


I was just working on this today.


I'm not exactly sure how you created the circular movement with your star motion. I tried replicating your steps but the Rate behaviour doesn't seem to animate the Replicator. Other than that, what you created will work fine for now.


Here's where the teardrop appears in my project when it's added to the project.


Then when I try repositioning it, that movement gets added as an animation.


And I'm not sure how to reposition the teardrop that you've created. This is probably an elementary issue, but when I click and drag what you created as I'm using it within my project, my repositioning of the teardrop gets added to the teardrop as an additional animation. Is there not a way to simply reposition the object?

Jul 5, 2020 9:09 AM in response to rowie302

Ok. Thanks. I fixed the teardrop. Is there a way to accelerate the dropping animation using the keyframe method?


Now I'm having a strange experience with the star animation. Suddenly I lost visual with my entire grouping. It appears that the layers still exist but they don't display.


Before I lost visual with my animation, I followed the protocol you mentioned about setting the offset. Didn't seem to work for me. My stars just remained stationary.


Jul 5, 2020 8:12 AM in response to Sunshine_82

Hi


If you reposition a layer that has positional keyframes, then you will be adding to that overall animation. You want to use the main group for positioning. In the project file I provided, that group would be named 'tear' - in your screen shot there, maybe that has been renamed 'teardrop motion'. Generally, use the upper group to reposition, then everything within that group will be isolated and work as normal.


In the replicator I have the rate behavior applied to the 'offset' parameter of the replicator. You'll need to get to know replicators more to make sense of it - the example in the project is just for demonstration. Perhaps you didn't enter a value into the rate behavior ? It will be dormant until a value is entered...is it at zero by default.

This thread has been closed by the system or the community team. You may vote for any posts you find helpful, or search the Community for additional answers.

Morphing Shapes

Welcome to Apple Support Community
A forum where Apple customers help each other with their products. Get started with your Apple Account.