Suchen Sie nach einer Möglichkeit, Ihr Entwickler- und Designspiel auf die nächste Stufe zu bringen? Figma ist ein unglaubliches Tool, mit dem Benutzer umfangreiche Prototypen mit Audio-, Video- und Animationseffekten erstellen können. Um jedoch das Gefühl und die Funktionen des Prototyps richtig zu testen, sollten Sie ihn als GIF exportieren und in Aktion sehen können.
Diese Anleitung erklärt, wie Sie Ihre Figma-Prototypen mit Ihrem PC oder Mobilgerät als GIFs exportieren können.
So exportieren Sie GIF in Figma auf einem PC
Der einfachste Weg, animierte GIFs aus Figma zu exportieren, ist das TinyImage-Plugin. Bevor Sie das Plugin starten und verwenden können, müssen Sie sich bei Ihrem Figma-Konto anmelden und zum Abschnitt „Community“ gehen.
So laden Sie das Plugin herunter:
Wenn Sie das Plugin installiert haben, öffnen Sie das Designprojekt, das Sie als GIF speichern möchten. Klicken Sie auf eine beliebige Stelle auf dem Bildschirm, um das Dropdown-Menü zu öffnen. Wählen Sie „Plugins“ und tippen Sie auf „TinyImage Compressor“, um es zu starten.
So erstellen Sie ein GIF mit dem Plugin:
A Note About Layering
The drop-down menu above the layer thumbnails also allows you to play the layers from left to right or from right to left. However, for more control over the final appearance of the GIF, it’s best to order the frames manually.
A Note About Playback
Set the default playback speed by moving the button on the time-measuring line. However, if you want specific frames to have different playback speeds, you can do so by clicking on a thumbnail and setting the speed in the box beneath it.
How to Export to GIF in Figma on a Mobile Device
Figma prototypes often come with advanced animations like sliding tabs, swiping options, and drop-down menus. Saving them as a GIF will make it easy for you to showcase the design in action. However, the mobile app only allows users to preview their prototypes. Although there’s no built-in export support, you can get around the issue by screen recording the app and turning the video into a GIF.
How to Export to GIF in Figma on an iPhone
In order to save your project as a GIF on an iPhone, you’ll first screen record the Figma app and make a GIF with the Shortcuts app.
To screen record Figma on an iPhone:
The recording is typically stored in your Photos app.
Check whether your iPhone has the Shortcuts tool pre-installed to turn your video into a GIF. You can also download the tool from the App Store.
Here’s how to change the video into a GIF file on an iPhone:
How to Export to GIF in Figma on an Android Device
As the Figma app lets users preview prototypes but not export them, you’ll record the preview on your Android device, transforming the video into a GIF later.
Here’s how to screen record Figma on an Android:
The video of the Figma preview will be saved in your Android photo app. You can turn it into a GIF with the GIPHY app.
To convert a video into a GIF on an Android device:
Export GIFs With No Restrictions
Whether you’re an experienced developer or an amateur designer, you deserve to have a convenient way of showing your work to others in GIF form. You can preview your creations on the Figma app, but accessing your designs may become a challenging task once the internet connection goes down. Until Figma comes out with a user-friendly exporting solution, you can rely on the methods we laid out in the article.
We hope this guide has helped you understand better how to get a high-quality GIF from your Figma creations, no matter which device you’re using.
Do you use the web or mobile version of Figma? What is your preferred way of exporting GIFs? Lassen Sie es uns im Kommentarbereich unten wissen.