How it works?

Don't know how to use Smartmockups to create project screenshots with just a few clicks? No problem, here is a short tour how to enjoy our curated collection of free product mockups and present like a boss!

It's been almost two months since we launched our project called Smartmockups. Since then, we've got more than 40K users from 157 countries of the world. If you are curious about how we made it to the popular page on Product Hunt and Hacker News, check The Story Behind Smartmockups Launch.

Okay, but now, let's see how to use Smartmockups and our curated collection of free product mockups!


1. Choose the right mockup

First of all, you need to choose the perfect mockup for your project. On Smartmockups you can find more than 100 free product mockups so it shouldn't be a problem. All mockups are divided into few basic categories such as desktop, laptop, smartphone etc. If you know exactly what you need, try our filtering by tags and see the results you're looking for.

Let's say we want to present some mobile app in black iPhone 6S. I'll go for one of my most favorite mockups — Black iPhone 6 on paper with app sketch


2. Image upload / URL screenshot

Now if we found the perfect mockup, we need to prepare our image file we want to present. As you can see in the mockup, there is an iPhone 6S with 750x1334px screen resolution. If your file has a different resolution, you will have to crop the image after uploading.

Image upload

In case you have your image file in your computer, just click the “Upload image” button and find your file. After uploading there might be a crop window if the resolution doesn't fit.

URL screenshot

As we are still working on Smartmockups to make it even better, we've recently added new feature that let's you grab a screenshot from URL. It's perfect when you want to present some live website or don't have your image file nearby.

After clicking the button you just paste the URL address in correct form and hit submit. Grabing screenshot from URL takes some time so please, be patient and give it a few seconds.


Snowmobile UI by Tony DeAngelo

3. Download final image

That’s it! The last thing you have to do is click the download button and choose the resolution of the final image. We know you don't need the original resolution all the time so choose the one you want and use the final image wherever you want. It's perfect for presentations, portfolios, dribbble shots and other promotion stuff you would ever need.

Note: If you use safari, you need to download the final image manually. The final image will also replace Smartmockups site so don't close the tab, just go back.

Well, I hope this tour will help you use Smartmockups and if you have any other questions, feel free to contact us – hello[at]smartmockups.com

Don't forget to follow us on twitter and facebook and for our design friends, we’re also on dribbble and behance.