Moving from Adobe XD to Figma? Our transition and guide for teams

It’s been a good time Adobe XD. If you had not heard or noticed, Adobe no longer lists it as a product, and it now continues to sit in maintenance mode. From Adobe themselves:

“We want to remind you that Adobe XD continues to be in maintenance mode. This means that we’re not investing in ongoing development or shipping new features within the product.”

 

Why make the move?

First: Adobe throws in the towel with XD

With the Adobe and Figma $20 billion merger falling through in December 2023, there was talk of Adobe XD being resurrected due to Adobe having no UI tool, this sadly has not been the case. Adobe XD will remain in 'maintenance mode' and will get no more investment.

There is now sense that Adobe XD might not be around forever and there is a need to move designs away.

Second: Superior Features

Figma keeps growing from strength to strength, with a wealth of features that as XD users we could dream of. It feels now that every month there are new features being released on Figma with a highly active community.

Third: Industry leading

Figma is leading the way and space for UI design tools. Staying on top of the latest tools is important and can play a key role in attracting new talent.

 

Is it easy to move designs from XD to Figma?

Moving from Adobe XD to Figma will be more complex than you think due to the different set-up of these two tools. As of now, there is no singular tool or plugin that perfectly exports all your designs to Figma. There’s a certain level of manual work that would still need to happen. However, we have put some tips below on we learnt making the transition.

 

Tips for moving from Xd to Figma. 

 Rebuild, don’t copy.

As said, moving is not so straight forward. You may be tempted to go Copy>Paste on Adobe XD screens to Figma, this will just copy the screen as an image into Figma, not ideal.

Rebuilding the pages allows for to the designs to utilise Figma correctly and utilise design systems (see next tips).

How to help with the rebuild:

• You can copy and paste Adobe XD files as SVG Code. While this will work, you will lose components, styles, images, effects, overlays… However, it can act as a great starting place to rebuild.
• XD to Figma plugin. Still in early development, this plugin from Hypermatic will do a good job at getting the building blocks in place. It still will require manual input to get it right.

 

Design for Figma, not Adobe XD.

While Figma and Adobe XD are very similar, they are also very different in their approaches. Try not to use Figma as you would Adobe XD and embrace how powerful Figma can be. Take time to learn collaboration, auto-layout, frames, link-sharing, prototyping, dev mode, the list goes on!

Some places to help:

• Figma has fantastic resources to learn the basics.
• Dan from ‘Bring Your Own Laptop’ has a great crash course on YouTube
• Utilise the Figma community to look at designs already made, reverse engineer the files and understand how they have been built.

 

Start with your Design Systems

If you use libraries or have a design system in XD, it’s a good idea to get this set-up in Figma. This will allow you to get used to designing in Figma but help build a file structure and system that works for the team. It also promotes the continuity of future design and development work using Figma.

 

Training

Make sure someone in your team becomes a champion of Figma. They should lead the training of the wider team, PMs, Developers and clients on what to expect and what their interactions with it will be.

Having everyone onboard with Figma will make the transition a lot easier and remove any concerns.

 

Prioritise what Adobe XD files you want to transfer over

There is no denying it is a time exhaustive task to make the conversion and if you are like us with a vast array of design files and libraries, it can feel overwhelming. Therefore, prioritise key clients and project files first, ones where you will know a safe future for their designs is needed. Get the ball rolling, the rest can follow.

Choose a target

Choose a new project or day to official ‘mark’ the start of using Figma. This can act as a test project to iron out any workflow issues. Start as you mean to go on.

 

So, what does the future hold for Adobe XD?

We don’t know. For now, Adobe XD still sits in a maintenance mode with no indication that it is going to be updated. How long this will last for is anyone’s guess, but if Adobe chooses to close XD permanently, there is a potential for a lot of lost design file and a mass scramble to make the move. Our advice, get ahead of the curve and be industry leading in your software choices.

See our other insight into the latest industry leading AI tools to help with your UX.