Anima

Quick guide for creating Animations along a curved path in Sketch using Anima.

Group the element you want to curve (Example, the Sun or Moon), to one end of a rectangle as show in the image below

Then, in the Interactions Editor, rotate the Group from one state to the other

1. Group the element you want to curve (Example, the Sun or Moon), to one end of a rectangle as show in the image below
2. Then, in the Interactions Editor, rotate the Group from one state to the other
3. Adjust Transition timing

Adjust the width of the rectangle to change the curve

Hide rectangle once you are happy with the curved path created

- Adjust the width of the rectangle to change the curve 
- Hide rectangle once you are happy with the curved path created

Due to the shift towards Figma in the UX/UI market, we have decided to remove official support for our Sketch plugin. However, users can still use the plugin as-is. We recommend using Anima with previous Sketch versions.

- Due to the shift towards Figma in the UX/UI market, we have decided to remove official support for our Sketch plugin. However, users can still use the plugin as-is. We recommend using Anima with previous Sketch versions.

<a href="https://www.animaapp.com/learn" rel="nofollow noopener noreferrer" target="_blank">Anima 101 – Video Tutorials, FAQs, and Full Documentation</a>

- <a href="https://www.animaapp.com/learn" rel="nofollow noopener noreferrer" target="_blank">Anima 101 – Video Tutorials, FAQs, and Full Documentation</a>

<a href="https://support.animaapp.com/en/articles/2627097-anima-for-sketch-how-to-create-a-high-fidelity-prototype">Creating a High-Fidelity Prototyping in Sketch</a>

<a href="https://support.animaapp.com/designer-s-guide-to-anima/how-to-publish-a-website-and-host-it-with-anima">How to Publish a Website and Host it With Anima</a>

<a href="https://support.animaapp.com/en/articles/2641923-how-to-handoff-design-specs-to-developers">How to Handoff Design Specs to Developers</a>

<a href="https://support.animaapp.com/designer-s-guide-to-anima/how-to-export-sketch-to-html">How to Export Sketch to HTML</a>

<a href="https://support.animaapp.com/en/articles/2644596-team-collaboration">Team Collaboration</a>

- <a href="https://support.animaapp.com/en/articles/2627097-anima-for-sketch-how-to-create-a-high-fidelity-prototype">Creating a High-Fidelity Prototyping in Sketch</a>
- <a href="https://support.animaapp.com/designer-s-guide-to-anima/how-to-publish-a-website-and-host-it-with-anima">How to Publish a Website and Host it With Anima</a>
- <a href="https://support.animaapp.com/en/articles/2641923-how-to-handoff-design-specs-to-developers">How to Handoff Design Specs to Developers</a>
- <a href="https://support.animaapp.com/designer-s-guide-to-anima/how-to-export-sketch-to-html">How to Export Sketch to HTML</a>
- <a href="https://support.animaapp.com/en/articles/2644596-team-collaboration">Team Collaboration</a>

Quick guide for creating Animations along a curved path in Sketch using Anima.

To create a curved path:

Learn More

Get Started with Anima!