How to use figma mockups plugin artboard studio mockups

“Artboard Studio Mockups” is one of figma plugins that easily help you generate mockups for your screen designs.

the plugin have paid and free subscription. with the free plan you can access free items only and use the plugin with only 3 projects.

the plugin works and tested on figma desktop version.

Let’s start by installing the plugin into figma:

1- open figma desktop application on your mac or windows, from the figma top bar menu click plugins->manage plugins and then click on browser plugins in community.

2- search for the plugin “artboard studio mockups”

3- click on the install button.

4- open any of your projects in figma to start using or testing the plugin.

example:

6- from figma top menu bar click on plugins -> arboard sutdio mockup -> add mockup item

7- a popup will display to choose one of many mockups (the ones with lock icon on them is for the paid version):

8- choose one of the free mockups that doesn’t have a lock icon on them. after clicking on the mockup you want to use the plugin will add 2 frames to your current figma page :

9- on the left: white frame is where you will add the content you want to appear on middle frame which is the mockup itself.

10- select the content frame on the far left then go the opened plugin popup as shown in the next image. (if it was closed open it again by goin to top bar menu Plugins->Add mockup item). click on blue button ‘render selected frame’Thats it you now have the mockup ready for use.

if you have any question please add it to the below comment section. Good luck!