Used in this video
Pitchdeck
ピッチ
Magically turn your Figma designs into animated presentable slide decks, or export them to PowerPoint.
Try PitchdeckGet started today
Video Transcript
Today, I'm going to be showing you a tutorial on how to export your designs from Figma Slides to Google Slides using the Pitchdeck Figma plugin.
To get started, we're going to switch out from our Figma Slides file here into a regular Figma design file. I'm just going to go to my regular Figma design file over here.
What you want to do is go to the "Resources" icon and search for Pitchdeck. Under the "Plugins" tab, if you click on the Pitchdeck result, you can run that Figma plugin by either clicking on the "Run" button here, or I recommend clicking on this little "Save" icon here to save it to your plugins list for easy access later. I've already clicked on the save icon here, so I'm just going to go to my Figma design file canvas, right-click anywhere, go down to "Plugins," then go down to "Saved plugins," and click on the Pitchdeck item. That's just going to run the Figma plugin we saved a second ago.
If you're new to the plugin, the way that it works is it loads in Figma frames that you can then turn into presentations or export to PowerPoint, Keynote, or Google Slides. What we're going to do now is switch back into our Figma Slides file, and I'm just going to create a Figma Slides deck. I'm going to grab one of these templates, click on "View template," and I'm just going to click on the "Add all slides" button. That's just going to spin up a new Figma design in our Figma Slides file with all of these predefined slide templates.
We want to make sure first that we're on the grid view, which we are at the moment. By default, it'll probably be in this list view, which makes it a bit harder to see all your slides at once. Just make sure you click on this little grid view at the top left here and swap into your grid view like we have on our screen right now.
What you want to do now is select all the slides you want to export from Figma Slides to Google Slides. In this case, I'm just going to grab the first dozen slides as an example. You can select all of those slides if you want to export the entire deck, but for now, I'm just going to do this as a quick demo. I've just selected those dozen slides, and then I'm going to right-click on those slides, click on the copy button, and then swap back over to my Figma designs file.
Back to the normal Figma file over here, and what I'm going to do is just right-click on my Figma design canvas and then click "Paste" here. That's just going to copy and paste all of the slides from our Figma Slides file over here that we selected and paste them into a regular Figma design file. Once we've pasted in those frames, we want to go ahead and click on the refresh layers button in the Pitchdeck Figma plugin. Alternatively, you can just rerun the Figma plugin, and it will automatically detect all of the frames on the page. But that's another quick way you can go about it.
You can see here that we've got all of our slides now loaded into the Pitchdeck Figma plugin that we exported from Figma Slides over here. Now we can go ahead and export these into Google Slides. The way we do that is just by clicking on the export button in the top right of the plugin, and then we want to change the presentation export format option in this dropdown to Google Slides. Go ahead and click on the Google Slides option, and in brackets, it's got the pptx file because we're going to be exporting this to a pptx file and then importing it into Google Slides in a moment.
You can toggle some of these settings if you want to change things like making the retina images. If you want to have really crisp images, you can make those 2x retina. You can toggle the compression settings. You can make sure that the editable text toggle is enabled, which it is by default, if you want to ensure this text is editable in Google Slides. I'm happy with all of those options, so I'm going to click on the export for Google Slides button. This is going to run through all of our slides and create a pptx file that we can then import into Google Slides.
I'm going to click on the download your pptx file button, and that's going to save it directly to your computer. I'm just going to save that to my desktop and click on save. Now that we've saved that file, we can go to our browser and open up a brand new Google Slides presentation. I've just got a brand new Google Slides file, and what I'm going to do now is go to the file button in the top left here. I'm going to click on import slides, then I'm going to click upload.
Make sure the upload tab is selected, and then what we want to do is just drag and drop our pptx file that we just exported from Figma into the Google Slides upload window here. That's just going to upload the file that we exported from Figma Slides into a pptx file and import those slides into Google Slides. Once that loads up, just go ahead and click on select all slides. That will automatically select all the slides in your file, and you can uncheck the keep original theme; we don't really need that checked. Then click on the import slides button. That's basically going to run through all of the slides in the file we just exported from Figma and import those into Google Slides.
You can see here that it's gone through and imported all of those slides directly into Google Slides, and these are editable slides. You can see here that the text can be modified, and all of the font settings have been maintained. We have the Inter font selected, and that's at size 14, which is exactly the same as we had in our Figma Slides design over here. If we jump back into Figma Slides, you can see that if we inspect these elements, you'll notice that we're using the Inter font, and the sizing is exactly the same as what we can see over here in Google Slides.
That's looking really good, and that also means we can move these layers around as well. You can move those around if you need to, same with these image layers; you can move those around as needed and resize them or delete them. But that's basically what that looks like there. That's basically what it looks like to export your layers from Figma Slides into Google Slides.
I'll show you one more quick example just to give you a bit of variety. What we can do is go back to our Figma file, and I'm just going to create a brand new Figma Slides file. Just click on file, then new slide deck, and this is going to open a brand new Figma Slides file again. I'm just going to select another deck here. I'm just going to select this agency Pitchdeck, click on view template, and then I'm just going to click add all slides.
Now that we've added those slides, again we're just going to make sure we're in the grid view, and we're going to copy all of these. I'm just going to do Command A, or you can do Control A if you're on Windows, to select all. You can see all the slides in Figma Slides are selected. I'm just going to right-click those, click on copy, go back to my Figma file, and I'm going to create a brand new page. Just go ahead and click on the new page button.
Again, I'm just going to right-click on my Figma design canvas, click paste here, and that's pasted in all of the slides from our Figma Slides. Again, we're going to refresh those layers, load them up in the Pitchdeck Figma plugin, and now we're going to click on export again. We've already got our settings saved to Google Slides, so go ahead and click on export for Google Slides again. Once again, that's just going to run through all of the slides from your Figma Slides file, and then you can click on the download your pptx file again. Save it to your desktop or wherever you like, and then in Google Slides again, you can just create a new presentation and we're going to import those slides into this new presentation.
Once again, just go to file, import slides, click on the upload tab, then drag and drop the pptx file you just exported from Figma into Google Slides. Once that finishes uploading, you should be greeted with the slide selection frame again. You can see here under import slides, it's loading up previews of all those slides for us to import. One more time, I'm just going to click on select all slides, make sure those are all selected, then I'm just going to uncheck keep original theme and click on import slides.
Again, that's going to run through all of those slides and import them directly into my Google Slides file. You can see that all of the fonts have been taken care of automatically. Because we're using Google Slides in this case, the cool thing about it is that Figma Slides also often uses Google Fonts as its default fonts for a lot of these templates. Any Google Fonts that are being used in Figma Slides are automatically going to get included and loaded up in Google Slides because Google Slides also automatically loads in all of the Google Fonts in the same way that Figma Slides does.
You can see that's looking really good. The fonts have all been swapped in; we can edit that text as you'd expect and move that around if you need to. Again, we can run through all of these and see that all of the content has been imported as we would expect from our original Figma Slides file.
Yeah, that's looking really good. Again, mindful that sometimes designing in Figma Slides is going to be way better than designing it from scratch in Google Slides. But there's also the use case where you just do need the output to be in Google Slides sometimes. This is a really quick and efficient way of taking any slides that you've designed in the new Figma Slides format and dropping those into the Pitchdeck Figma plugin and exporting that out to Google Slides.
You can basically go from Figma Slides to Google Slides in a number of clicks, and hopefully that helps your workflow if you are a Figma Slides user who also likes exporting things to Google Slides for stakeholders or clients that just need it in that format. Hopefully, this removes a bit of that headache of manual work transferring those designs from Figma Slides into Google Slides each time layer by layer.
I'll keep it pretty simple and leave it there for today. I just wanted to show you a couple of examples of how to quickly get your Figma Slides out into Google Slides automatically. As always, thank you for watching, and we'll be back soon with more Figma tutorials like this one very soon.
Adam Brock
Founder of Hypermatic
The secret weapons used
in high performing teams.
World-class teams of designers, developers and copywriters use our Figma plugins to 1,000x their daily workflows.
TinyImage
タイニー
Export compressed JPG, PNG, SVG, WebP, AVIF, GIF and PDF files from Figma, reducing sizes by up to 95%.
Try TinyImageGet started today
Pitchdeck
ピッチ
Magically turn your Figma designs into animated presentable slide decks, or export them to PowerPoint.
Try PitchdeckGet started today
Convertify
コンバート
Export Figma to Sketch, XD, After Effects or Import XD, Illustrator, Google Docs, PDF to Figma.
Try ConvertifyGet started today
Emailify
メール
Easily create and export responsive, production ready HTML emails (eDMs) from Figma.
Try EmailifyGet started today
CopyDoc
コピー
Everything you need to easily export, import, localize and update text in your Figma designs.
Try CopyDocGet started today
Bannerify
バナー
Animate and export production ready banners from Figma to HTML, GIFs and Videos, in seconds.
Try BannerifyGet started today
Crypto
ロック
Securely share your Figma designs and prototypes as password protected URLs or PDF files.
Try CryptoGet started today
Favvy
ファビー
Export production ready favicons (with code) for your website or PWA from Figma in seconds.
Try FavvyGet started today
Pixelay
ピクセル
Compare and visually QA your Figma designs against real website URLs using smart overlays.
Try PixelayGet started today
HyperCrop
クロッパー
Batch crop/resize multiple images into multiple sizes with presets, smart cropping and face detection.
Try HyperCropGet started today
Commentful
コメントフル
Supercharge your Figma comments and gather external feedback from stakeholders.
Try CommentfulGet started today
Weblify (Beta)
サイト
Inspect your Figma layers as clean HTML, Tailwind, React or Vue code in one click.
Try WeblifyGet started today