Harsha Vardhan N
Mockups are simple visual models that show how a design will look, helping everyone see the final idea before it’s built. If you’re trying to present your design with a mockup on Figma, unfortunately, there isn’t any built tool for it.
In this guide, we will help you create mockups through the use of plugins to get you covered.
Create Mockups in Figma
- Open Figma on your browser and sign in with your credentials. Now, open the design file you’re working on from Recently viewed. If you haven’t started yet, click on New design file.
- As there isn’t any tool to create mockups on Figma, the best approach is to use plugins. To access plugins, navigate to the Toolbar and click on Resources.
- In the Plugins tab, search for Mockups, and you will find multiple results. For the demonstration, we’re going with Artboard Mockups. However, consider checking the plugins below to find the mockup that fits your design requirements.
- Mockup plugin by ls.graphics
- Clay Mockups 3D by Hamish
- Vectary 3D Studio Lite by Vectary
- Angle Mockups by Design code
- After you click on a plugin, you will find its description. Now, click on Run to load the plugin.
- Once the plugin is loaded, click on a mockup and then Select a mockup frame to add it to canvas.
- Now, in the frame provided, add a layer of your choice, such as an image. Once you’ve done this, click on the Render selected frame on the plugin.
- After the render, you can delete the frame to which the image is added. Now, you will have an engaging mockup that has been successfully created.
Wrapping Up
Congratulations on learning how to create mockups in Figma!
While this is the easiest approach to creating engaging and customizable mockups, the downside with most mockup plugins is that they are paid. However, be patient and search through the library of free mockups and use them for your design.
Related Reading
How To Use SF Symbols in Figma
How To Add iPhone Frame in Figma
