PageProof Academy: Figma plugin

Hello everybody, it's Marcus from PageProof here for another PageProof Academy, this time on Figma. And this is the first time for 2025 for the PageProof Academy. Now we have a range of different things that are going to be coming through this year and plugins for different products. We're going to have updates. We've also had some new ones coming out as well. And I'll talk more about that at the end of this. So Figma, very, very popular. Proofing done through PageProof. And what we've done is taken the feedback from, from all of you and built a plugin built into Figma for you to use. But before we take a look at that, we're going to look at a couple of other plugins just to get a sense of where this sits in the PageProof family of plugins for products. So first, I'm going to take a look at Canva. So many of you are using Canva for your design work, good for doing quick social and all sorts of things like that. But people, a lot of people don't realize that we actually have a plugin that enables you to send your proofs from Canva over to PageProof. So if you go up to the share at the top of your design screen and you will find PageProof here, this gives you an option to select which pages from your design that you would like to send out for review. And you click on Save. It prepares your design file for you, and then you can click View in Page Proof, and that opens up the proof setup screen and hands over to it the design. There's a link here in your reference field that links it back to Canva. So you've got that, and you just simply come in, add your reviewers, and send out your proof. So that is the Canva plugin for for page proof. Now that just lets you send out proofs. It doesn't let you see any comments going back in. It doesn't let you do new versions. But those are all things which we have planned for 2025. So that's the Canva plugin. Now on the other end of the spectrum, we have the Adobe plugin. So this is a plugin that we have for Adobe InDesign. Now, PageProof for a very long time has supported all the Adobe desktop apps. So we've got Illustrator, Photoshop, InDesign, also the video tools as well. So Premiere Pro and After Effects. We just recently added Apple's Final Cut Pro. There's a plugin for that as well. So plugins are something that we really take seriously and really love to give to you so that you don't need to have multiple screens open. And you have all the features you need right inside your design applications. Now the InDesign plugin, actually all the Adobe plugins, lets you send out proofs. So just like we saw in Canva, but this time you got a few options here. So you can set these options and then upload and it'll make the proof for you and send it up into PageProof for sending. You've also got an option here for uploading a new version. So you can click beside the proof here, upload new version, and you'll see it's got the same set of options for your new version, but now it's going to attach this as a new version of that proof. And that enables features like compare and others inside of PageProof for that. In addition, also, you can see the comments showing inside of here. So when you click onto the comment, it actually puts the markup into the artwork. So this is a really great feature. It's unique to PageProof. Nothing else does this. This is really, really, really important to a lot of our customers. And it means that you can speed up the cycle of getting things done inside of your proofing. It even lets you do things like, for example, you know, here we have a copy of that for this comment. You can see the text inside of here is correct. So the reviewers have given us the correct text in the comment. You watch the InDesign file, I'll press the button over here that says replace. Boom, and it changes the text for me. So you can see the InDesign plugin, extremely powerful for going through and making changes. So that's at the other end of the plugin spectrum, very mature, got a lot of the features in PageProof here. So Figma, what we've got with Figma is a citizen that sort of sits in the middle. Right, so here we are inside of Figma, familiar to a lot of you. A lot of companies using Figma for doing their work, and you'll see in here, this is just a sample file from Figma themselves. What we've got now is a plugin built into Figma, so you can access it by going to icon down the bottom here and doing a search for your plugins, and it'll add it here to your recents. You can also get there from the top menu as well. So coming down to plugins and you'll see it inside of here as well. Now that plugin opens up in Figma. You've got the login here, so it'll prompt you to log in. You log into your account, you've got some options inside of here, logging out, etc. And you'll see the button here to create a proof. It lists your proof inside of here. You've got a refresh in the corner and you've got access to the different areas of PageProof as well, the PageProof dashboard. So, and of course, the search. So you can do things also to do with versions as well. You'll see on the end here there is an upload new version button on beside each proof. So you can see that's a good mix of the features. So there are no comments coming in here just yet. These are all things that we will build out as we go through 2025. But let's have a look at creating a proof from inside of Figma. So the first proof that I want to show you, we click on create proof. We actually get a bunch of different options in here. So by default, it's going to prompt you for the proof name and the file type will be a URL proof. So a URL proof from Figma is a fully interactive proof. So this means that your reviewers will be able to interact with it. It's essentially a web, a web proof. And you'll see the message down here, set your Figma prototype share link to anyone can access and then copy and paste it into here. The reason you have to do that is that Figma doesn't give us a programmatic access to generating links. So all you need to do is go up to the share icon here, come down to the one that says copy prototype link, but just make sure that it's set to anyone can view. That's very, very important. Anyone can view and copy the prototype link. So just click on that, close this, paste the link into here, and then go create. That's going to pop us over to the PageProof setup screen. You can go through and fill out your deadlines and all the things, add a checklist and add a workflow as well. So let's go through and add a workflow and go send proof. That's gonna put the proof into PageProof, notify the reviewers in the workflow. They can click into it and it's gonna take us to the PageProof proofing screen. So it's gonna load the prototype right here inside of PageProof. So there we are. And, uh, I can go through all the different screens here. So you can see all the different screens showing up inside of here. And I can go through and take a look at those and leave feedback. So you can go through and leave markup and everything using the pen tool as we normally do. So that is doing a URL proof. If we go back to here, there are a couple of other options as well. So there are sometimes, and it may be a preference of yours, where you want to send out something that's non-interactive to your reviewers so they can't interact with it. You just want them to look at it and you really want a snapshot so that people can use compare mode and those sorts of features which are available in static proofing but not necessarily available in URL proofing. So let's take a look at that. If I go create proof, you can pop this menu down and just choose JPEG or PNG. So I'm going to grab JPEG. That is going to do a single canvas proof of all of these screens. Okay, so I can go Create, that's now going to create the JPEG of that whole screen and it's going to put it into PageProof and then we can send it out for review from there. So it's going to pop it up for us. We can then come in and send it out to our workflow. Send proof. That'll upload into PageProof and of course it will then make it available for me to, or your reviewers to leave feedback on. So if I click on go to proof. That will then open up the proof for us and then we can leave feedback. Okay, so there's the canvas and page proof. So I can zoom in. This literally is a JPEG. So I can come in and I can grab hold of the pen tool and I might say, hey, this needs to move down. So I'm gonna come in here and say, move down and add that comment onto the proof. Right now, I'd like to send this back to the designer. So I'm gonna say changes please. That's then gonna submit it back to the designer. Okay, so now I'm back inside of Figma. I can see if I come in here and do a search for that proof, there's the proof there that says to-dos requested. And so I'll be able to come in and actually make the changes that we need inside of here. So I know they wanted me to move it down. So I can come in and I can make that change. So I'm gonna come in, I'm actually gonna move that down a little bit. So we're just gonna pull that down. That looks like a good place to put it. And then I'm going to upload a new version. So Again, go up to that proof, click on the upload new proof button here, make sure it is of the same type, so it's a JPEG, upload new version, and that's now going to put a new version up into PageProof, sending it to the same workflow, same settings, et cetera, and same deadline, and I can alter those if I want to. Upload new version, it's going to put a new version into the platform, and then the reviewers will be able to take a look at the new version that I've just put up. So here I am in the new version and I can tell that 'cause down the bottom it tells me version 2. So if I wanted to look at version 2 and version 1 side by side, click on the compare icon. It's gonna put the two side by side. I can see the comment over here that says move down. I'd like to look at that in smart compare mode. So click on smart compare and PageProof is going to show me the differences. So now you can see it's pulsing and showing me where the differences are between version 1 and version 2. Really, really great way of checking changes. There's also the slider. So I can use the slider to slide between version 1 and version 2 as well. So I can see, right, that has been moved down. I'm very happy with it. And at this point I might want to approve it. So just showing you how you can do that with statics. Now there is one more type that you can send out and it has a few more extra features to it, which is PDF. So if I click on create proof, you'll notice it's here. PDF. Now the characteristics of PDF are that if you just don't select anything, it's going to send out the whole lot. Great. That's, that's probably what most people want, but they go out as separate pages. So it actually starts putting these out into different pages, or I'm going to select over these last 3 pages here. So you select them all and then you click on create proof. And choose PDF, it's going to make a PDF of those three. So that's going to upload it into PageProof, and then we can send that proof out to our reviewers. So if I come in now and say, hey, send that out for review, that's going to upload to the workflow, notify the reviewers so they can get in and take a look, and it'll be a PDF that they're looking at made from Figma. So we'll We'll send that out. So now I just go to Go to Proof, and you'll see that we have a multi-page PDF. So there it is, 3 pages. If I go to the view, you can see there are the 3 pages that we selected inside of Figma, and now the 3 pages showing inside of Page Proof. So that is the way in which you can do selections of pieces of your Figma prototype and get just those pieces out for review. So that just gives you a good sort of rundown on what you can do inside of Figma, the plugin is there. It's a 1.0 plugin. So we've got the ability to create proofs in various different formats. We can also upload new versions as well. Coming soon will be comments and those sorts of things. So we think this is a really great way to get PageProof and Figma working into a workflow. And that makes a really big difference to those designers working in Figma. Now I did mention. That we would talk about some future plugins that we've got for this year. So I'll give you a little bit of insight. First one is an update to Canva. So there will be an update to the Canva plugin that will enhance the features. So it won't just send, it will do more than that. So we'll see that announcement come through first half. We will also be supporting Adobe Express. So that will be coming as a plugin for Adobe Express. Again, we will announce the functionality of that. At a minimum, it'll obviously be sending out proofs and new versions, and then we'll build it out from there. The third one is kind of a big deal, which is Microsoft Office. We're building a native plugin for Microsoft Office that works in Office 365 and also in the desktop applications on Mac and Windows. But it gives you the ability to send out proofs directly from your applications and bring in the feedback, new versions. So that will work in Word, Excel, and PowerPoint. And particularly for PowerPoint, that is a game changer for those doing a lot of PowerPoint review. You will be able to really use the plugin inside of those tools to really get that feedback into the pages that you want it. Now, of course, we support Word, Excel, and PowerPoint today. So you can still, you know, upload PowerPoint files. This is a plugin that gives you a native interface into your applications. So exciting year, some great plugins coming, some great enhancements, and also some new ones coming too. And, you know, we have a great roadmap for you coming through 2025. Look forward to seeing you again in the next PageProof Academy. Until then, take care.