Getting Started with Anima
Follow these 9 steps to start using Anima and ship better products, faster.
1. Sign up
Create your Anima account here.
2. Bring in your team
Designers and Developers collaborate on Teams > Projects.
If you’re the first person on your team to join Anima, you’ll need to invite your colleagues.
3. Create a project
The next step after creating a team is to create a project where your design file will be synced to.
4. Install Anima plugin
Install Anima for Sketch. Adobe XD, or Figma.
5. Optional: Create responsive prototypes
Using Anima Pins for Sketch, Figma’s Constraints, or Adobe XD’s Responsive Resize, you may create fully responsive prototypes that adjust to the screen size.
In addition, Breakpoints make designs look great in all screen sizes.
6. Add Smart Layers (Optional)
Smart Layers help you design realistic prototypes with ease.
Anima’s prototypes are based on code. Anything you can do with code - you can do with Anima.
Using Anima’s plugin you may add Videos, Gifs, or Lottie. You can create forms with real text Inputs, add hover-effects or animations. You may even embed code right into your prototype - Such as Google maps or a live chat.
7. Preview in Browser
Click Preview in Browser at the bottom of the Anima plugin to watch the magic!
Preview in Browser lets you see your design running as code. This is a private draft of your work that only you can see to make sure it’s aced.
8. Sync to your team’s project
Click Sync when you’re ready to share.
Your private draft will update the shared Anima project.
9. Collaborate with your team
After Syncing your design, the whole team can play it, comment on it, or generate code from it.
Additional resources
The full Anima docs are available here.
Need a sample file to get you started?
