I spent a good amount of time searching for mockups that match the ones I’m presenting my work in. The device frames presented by Figma are exactly what I’m looking for. There should be an option to “Export with Device Frame”.
The prototyping feature does already has a lot of device mockups with pretty good quality to showcase designs.
Does anyone else feel that this would save them a lot of time?
I started my project in Figma with an iPhone frame and it’s just a rectangle shape of the screen but does not show the frame of the phone around which is fine. When I open the project in prototype and the click present a device frame is added automatically. My question is how do I export the screen with the mockup frame around of the phone?
I don’t want any background like in the screenshot attached.
I just spent some time looking at the plugins available for this and have to say that I’m really surprised this is not on the roadmap for Figma. All of the plugins are multi-step, and many are paid models. It’s a very reasonable use case to want to be able to export exactly what a prototype look likes in playback mode in a particular state.
Can anyone on the Figma team share why this is not being pursued?
I used the plugin “A little bit mockup”. This one worked wonders for me! Immediately imported a device frame like the one that appears in prototyping. The Device models one listed above didn’t work for me.
use the iMockup Plugin , you can choose which device to use from a pretty long list of available devices , looks identical to the Figma preview without the black background. Only downside is you have to use the plugin on the exported frames(as pdf or png) one by one.