All Collections
Importing from Figma
Importing From Figma into Play
Importing From Figma into Play
Updated over a week ago

We’re making some important updates to our Figma copy & paste feature, which has been in Beta. As of v1.6.1, we are disabling the current Figma copy & paste feature as we work on updates.

Why we’re rebuilding the Figma Copy & Paste Feature

With the initial version we built, we created the ability to copy directly from Figma and paste into Play with no plug-ins, webhooks, or APIs. As time has gone on we have realized that things are not copying over and maintaining their accuracy. As Figma has rolled out more and more features (variables, how variants work within the context of a design system) we need to rebuild this feature to ensure what you copy over into Play looks exactly like what you designed in Figma.

In this rebuild, we will be using Figma’a API to import your objects from Figma over to Play. You will only need to authenticate one time in Play to give access to your Figma, and you will then be able to easily copy and paste from your Figma file directly into Play. After much R&D, we think this is a more seamless approach for the user vs having to work with a plug-in.

How the new Figma Import Feature will work

We will be rolling the new Figma import feature out in phases, which we have detailed below. We are first prioritizing the accuracy of what you copy over and then will be rolling in additional editing and syncing features.

Phase 1

In this first phase, when you copy any object from Figma into Play, frames and layout (objects will be in an absolute position with fixed width and height), images, and effects (drop shadow, borders, blur) will be translated into Play elements and the properties will be maintained for easy editing. Shapes and text will be ported over as PNGs.

Figma treats text differently than how it would normally render in iOS, and it is very important for us to maintain a perfect 1:1 appearance in Play. For that reason, in this initial phase, we are porting over text as an PNG to ensure it is pixel-perfect.

Phase 2

In this phase, we will release a new element in Play—SVG. Text will be imported as an SVG and you will have the option for that text to be translated over to a Play text element where it will be editable. There will also be an option to translate Figma’s Auto Layout to Play’s layout with support for porting over properties like Hug & Fill, as well as gap spacing, padding, and margin.

Phase 3

In this phase, we will support loading in multiple pages from the project URL (this will automatically create Play pages for each “page” or frame in Figma). We will also support the ability to import components from Figma into Play.

Future Phases

In future phases, we want to support a shared library from Figma where you can load in Figma components with a sync back to Figma (i.e. edit something in Figma, come back to Play, and the component in Play will be updated).

Questions or Comments

We have created this phased rollout with valuable input from our users…thank you for all of your feedback! If you have any comments or questions, please don’t hesitate to email us at [email protected].

Did this answer your question?