Prototyping Import & Export
Figma Plugin Import
Use the “Import to Phase” plugin in Figma to import your designs into Phase. If you’ve set up interactive components in Figma, Phase will automatically convert them into corresponding actions.
Action (Interaction) Export
Without selecting any desired Actions, Phase will automatically export the first Action on the screen as an animation when you click on the “Export” button.
To export a desired Action:
- Select the element that’s associated with the desired Action.
- Click on the lighting bolt icon and select the desired Action from the Action List Dialogue.
- Click on the “Export” button.
- Import Settings Window will pop out.
- Press Export. The Action will be exported as an animation.
The supported Animation Export File Types are:
- GIF: GIFs are the go-to for small, looping animations perfect for website embeds or social media.
- MP4: For high-quality video exports, MP4 is the way to go.
- Lottie (.json): Lottie JSON files keep our animations editable and lightweight. They're awesome for implementing smooth animations across platforms and apps.
- dotLottie (.lottie): DotLottie files compress our Lottie animations into a single, self-contained package with a smaller file size - perfect for streamlined sharing and deployment.
Code Export (Coming Soon)
In Inspect Mode, we’ll translate your design into React components with CSS & JS. You’ll be able to copy the translated code and paste it into your codebase or provide it to your engineers as a reference.
Start Prototyping
Get Started with Our Free, Web-Based Platform.
© Phase Software GmbH 2025