Used in this video
Pitchdeck
ピッチ
Magically turn your Figma designs into animated presentable slide decks, or export them to PowerPoint, PDF, Keynote or Google Slides.
Try Pitchdeck for FreeIncludes 10 Free Pro Trials
Video Transcript
Today I’m going to be showing you a quick tutorial on how you can automatically export your slide deck presentations from Figma into Canva using the Pitchdeck presentation Figma plugin in Figma. To get started, all we need to do is go to our Figma file, go to the little resources icon down here at the bottom, and if you click on that and then search for Pitchdeck. Under the Figma plugins tab, if you just click on the Pitchdeck item, you can run the Figma plugin by either clicking on this run button down here, or I’d recommend clicking on the save icon next to that. That will let you run the Figma plugin from your Figma plugins list. I’ve already clicked on the save icon, so I’m going to go back to my Figma canvas and just right-click anywhere. Then go down to plugins, go down to saved plugins, and then click on the Pitchdeck item. That’s just going to run the Figma plugin that we saved a second ago.
If you’re new to the Figma plugin, the way that it works is it basically treats any parent-level Figma frames or components on your page as slides, and then you can load those slides into the Figma plugin and create presentations. In this case, I’m just going to load up all of my slides. I’ve already pre-designed all of these slides, so I’m not going to go through how I designed them. I’m just going to assume that you’ve already got your slide deck designed in Figma and you just want to export it out to use in Canva.
To do that, all we need to do is go to the export button in the Figma plugin at the top right here. By default, it’s going to be on the Pitchdeck presentation option, which basically uploads the presentation to a web URL that you can share. But in this tutorial, we want to use the Canva option. We’re going to open up the presentation format dropdown, and we’re going to go down to the bottom here under the static deck options, and we’re going to click on the Canva option. Just go ahead and click on Canva. You can see here that it’s basically going to export the deck as PSD because Canva natively supports PSD imports. This is going to allow us to retain all of the layers and everything like that.
You’ve got a few different options here. You can compress the images, you can make sure they’re 2x retina images, and you can downsize Figma fills. In this case, I’m just going to keep it really simple and I’m going to turn on retina images and also compress the images. Downsizing large Figma fields basically just automatically downscales any really large assets to 2x their layer size. If you do need to do that, feel free to enable that as well. But for today, I’m just going to keep it really simple and enable these settings. Then I’m just going to click on export for Canva. That’s essentially going to go through all of your slides or all of your Figma frames. It’s going to compress any images down, and then it’s going to bundle all of that up into a PSD file. Canva has a 300 MB file size limit for PSD imports. If the deck happens to be bigger than 300 megabytes, it will split it into multiple PSD files and zip those up. In this case, it’s just going to be a single PSD file.
Once that finishes, just go ahead and click on the download your PSD file button. Then you can just save that anywhere. In this case, I’m just going to save it to my desktop. Once that’s saved, you can just go to your browser and then go to canva.com and log into your own Canva account. All you need to do on the homepage here is just grab the PSD file that we just exported from the Figma plugin. Drag and drop it into here, and you’ll see it’ll say drop items to upload. Just let go of the mouse on that, and that’s going to automatically upload the PSD file into your Canva account. Once that finishes uploading, we’re going to be able to open that up and we’re going to be able to edit it in our Canva account.
It’s just finished uploading that, so you can see here we’ve got the little thumbnail. If I click on the project here, you can see it’s just loaded up that in Canva. We can zoom in and take a look at our designs here. You can see that all of the frames have been imported, and because these are all layers, we can actually edit that. We can edit the text, we can style that if we need to in Canva, and obviously we can also move around images and reformat things like that in our slides as well. This basically makes it really easy to edit your slides in Canva after you’ve already exported them from your Figma designs.
If you need to get them out of Figma and into Canva, you can do this really easily using the Pitchdeck export feature. As I mentioned, that does have a 300 MB file size limit. I also just wanted to note that PSD files also have a canvas size limit. You’ll notice that the Figma plugin is automatically arranging these into the grid that is going to maximize the amount of canvas space. You’ll notice that my layout here is a little bit different; I’ve got three rows of three. In this case, when we open it up in Canva, you’ll notice that the grid has been extended to maximize that available width just to make sure that it doesn’t have to split up the PSD files when it’s not necessary. I just wanted to flag that as well, but it’s nothing you really have to worry about. If you do get a zip file with multiple PSDs, you can just upload both of those PSDs into Canva, and you’ll be able to edit both of those as you’d expect, just like this.
I just want to keep this really quick for today and show you this new export feature in case you’ve been wondering how to get your slide decks or your presentations out of Figma and into your Canva account. This is going to be a really easy way to do it without having to rebuild those slides or just import them as images. This way, you’ll be able to continue editing your designs or slides in Canva. We’ll leave it there for today. Thank you as always for watching, and we’ll be back with more Figma tutorials like this one very soon.
Adam Brock
Founder & CEO of Hypermatic