Migration of a global design system library
From Sketch to Figma
by Antoniya Dimitrova
30.05.2024
Below is an in-depth look at the key challenges you face when currently using Sketch to manage your design system.
We will also focus on some insights on how you can plan a successful migration to Figma. Let’s go!
Although both Sketch and Figma offer powerful tools for creating and maintaining design systems, we have recently seen a trend of many companies choosing to migrate their design assets from Sketch to Figma.
Limitations of the platforms
You want your design system to be available to all designers, developers and stakeholders involved in the creation process of digital products in your company. This means that you want to make it available on a platform that anyone can access.
Sketch
Sketch is a desktop application developed exclusively for macOS. This means that team members working on other operating systems (such as Windows or Linux) do not have direct access to the designs created, unless they do:
- Be invited as a viewer to the online sketch workspace, which allows them to view, comment, review and download assets for free, but they still can’t edit them
- they use third-party tools such as Abstract, Zeplin or InVision. This technical setup increases project costs and still does not allow non-Mac users to edit the project.
Figma
Figma, on the other hand, is a cloud-based tool that can be accessed from any operating system with a modern web browser. It is also available as a native desktop app, giving designers the ability to work offline and synchronize their changes once they restore their internet connection.
In addition, Figma offers built-in review, commenting and real-time collaboration features that make hands-on sessions with stakeholders more comprehensive and the development handover more efficient.
Collaboration
In the modern business world, where many teams work in different locations around the world, the ability to collaborate on a file in real time is an important feature.
Although Sketch also offers a real-time collaboration function, it is much easier to start collaborating in Figma because:
- You either provide a direct link to your project or invite the people you want to collaborate with by e-mail via the sharing settings of your file.
- You do not need to install anything on your computer. In contrast, Sketch requires a compatible version of the Sketch app to be installed on all contributors’ devices, taking up valuable hard disk space and potentially impacting your Mac’s performance.
Collaboration is crucial for the proper maintenance and further development of a design system. The project designer must be able to visually explain the challenges they are experiencing and the possible solutions they have in mind in order to seamlessly communicate them to the design system team. This has an invaluable influence on the quality of the design system as a product.
Problems with Sketch
In recent years, while maintaining a Sketch library for one of our customers, we have encountered numerous errors that affected the responsiveness of symbols or caused problems with the synchronization of libraries (e.g. symbols disappeared or linked libraries became invisible). Shortly before the migration to Figma, we decided to freeze the Sketch updates for our library and the design projects in order to keep the system stable until the migration.
Costs in comparison
The total amount per editor seat in Figma is still less than what a team has to pay for Sketch and all the third-party tools that facilitate collaboration and version control in a design system environment.
Learn
more
Wir sind mehr als nur Experten – unser engagiertes Team aus Designern, Entwicklern und Marketingspezialisten arbeitet Hand in Hand, um Ihre digitale Präsenz auf die nächste Stufe zu heben.
Ready for the next step?
Contact us and find out more about our services.
Our tips for migration
Below you will find our recommendations for migrating your design system from Sketch to Figma:
- Make a plan: Changing tools is not an easy process because it has a major impact on the entire organization and is costly, even if it pays off in the end. You should carefully consider how much time and effort you need to invest in advance in order to successfully migrate to Figma.
- Rebuild your library in Figma: Unfortunately, you will not be able to open your *.sketch file in Figma and start working with it immediately, as Sketch has some restrictions on the way components are overwritten. Almost every component imported from Sketch adds an unnecessary level of complexity. Be smart and invest in a clean build by creating components from scratch, which will ensure a stable Figma library later on.
- Split your library: Split your design assets into different Figma files that cover specific parts of your design system. This increases the performance of your library.
- Create presentation boards
Use a separate file outside your design system project in Figma where you show the full scope of the components and create an overview of all states and styles. This will give a good preview of the hidden possibilities of a Figma component (useful for developers and new designers), as well as ensure consistency between design and code. Außerdem dient die Datei als Dokument zur Fehlerbehebung bei eventuell auftretenden Fehlern dienen und als eine Quelle der Wahrheit für Geschäftsinteressenten sein, die eine Erweiterung des gegenwärtig im Designsystem angebotenen Angebots planen. - Create a schedule for the migration and communicate it openly: A clear migration plan creates trust in the process for everyone involved. Communicate it in good time and prepare the teams in advance by offering an archiving process for the Sketch files.
- Select the first migration teams: Depending on the size of your company, too many teams migrating at the same time can be overwhelming. Start small and expand support for the Sketch library over time until the full migration to Figma is complete.
- Team On-boarding & Support: Make sure you offer support on all communication channels you use in your organization. Set up a special task force to take care of open questions and concerns. Offer weekly sessions in which you can explore more complex topics in greater depth.
Let’s migrate together!
From the latest industry trends and the latest insights into AI and UX/UI design to exciting use cases.
Sign up for our monthly newsletter and stay up to date!
Stay
tuned
More articles
