Have you just launched a new website? Or created a course? Here’s how to create free mockups in Canva to show it off!

Woohoo! Congratulations – launching ANYTHING is a big load of work. It’s also something you probably want to promote and share with your audience. 

But how?

If you’re one of my clients, I’ll create some beautiful, perfectly branded mockups for you using Photoshop. You can share them on social media, use them on your sales page or feature them on your landing page. Take a peek here.

• 

• 

• 

If you’re not a client, though, no worries! You can make your own mockups without Photoshop. It’s quick, easy and best of all free. Actually, there are two ways to make free mockups in Canva. All you need is an account.

Ready to learn how? Let’s go!

Option 1 for making free mockups in Canva

Step 1:

Take a screenshot of your website, webpage from your course or whatever you want to promote. Leave out distracting bits like your own navigation bar etc. On a Mac, you can take a precise screenshot by pressing COMMAND + SHIFT + 4. This brings up a crosshair and you just drag to select what you want to include.

The image will save to your desktop unless you’ve changed this to another location. On a Windows PC or laptop, press the Windows Key + Shift + S. This brings up options for different kinds of screen capture. Choose what works best for you (Note: I have a Mac so sorry for the crappy PC instructions!!).

Alternatively, on a Mac you can press COMMAND + SHIFT + 5 to open a screen with more capture options, including video.

If you want to show off your mobile site, app or social media feed, just take a screenshot of the relevant page on your phone. You’ll need to make sure that the image is saved to the cloud or you send it to yourself via email so that you can access it on a desktop or laptop. That’s because you can’t do step 2 on your phone!

Step 2:

Now you’re going to create your mockup in Canva; this works in both free and paid versions – YAAY!! The only thing is you have to do it on the desktop site – I don’t know why but you can’t create mockups (at least this way) using the Canva app. This way also works just for images, not video.

Open up Canva and start a new design. The size doesn’t matter too much, but consider where you want to use your mockup. If you want to post it on social media, choose that size. If you want to post the mockup on your website, sales page or landing page, you might want to create a custom-sized design. 

Think also about the orientation of your design – if you’re going to make a mockup of a mobile phone, you might want a portrait-style canvas to work from. If you’re making a mockup on a laptop or of your ebook, landscape might be better. You can also change this later if the size you choose isn’t quite right – don’t worry!

If you want to use the mockup on your website, check with image size recommendations with your specific platform. Showit, for example, recommends you use images that are at least 3500 pixels on the long edge. So you could try creating a design that’s 3500 x 3500 to start.

Step 3:

Ok, you’ve got your blank canvas ready, now let’s import your screenshot(s). Drag and drop them into Canva or click on ‘Uploads’ in the left menu, then the Upload Media button at the top. Then drag your screenshot onto the canvas.

Step 4:

Once you have your screenshot on the canvas, click to select it. Then click Effects on the top menu bar. If you don’t see it, click on the 3 little dots and the option should appear. This will open a new menu on the left side of your canvas.

Step 5:

On the new menu, Smartmockups should come up as the second option; click See All. Now scroll through and choose the option that works best for you. You can choose from laptops, mobile phones, desktop computers, book covers and even mugs! Once you choose the mockup you want, click the apply button at the bottom of the menu.

You might need to resize your image, but otherwise, you’re done! You’ve created a free mockup in Canva and it fells a bit like magic, doesn’t it?

Now you can adjust the background colour, add other elements that go with your branding and download the image as a jpeg (best for use on your website because of the small file size!).

Option 2 for making your free mockups in Canva

This way is even easier and you can do it in the mobile app! You can also mockup videos using these instructions.

Follow steps 1-3 above. Once you have your screenshot on your canvas: 

1. Click Elements in the left menu. Then scroll down to Frames and click See All. 
2. Scroll down about 5-6 rows and you’ll see frames in the shape of IMacs, laptops, phones and tablets. Click to select the one you want and it will be added to your canvas.
3. Drag your screenshot onto the frame. When you see it go inside the frame, let go.
4. Resize if needed and repeat the above steps for other screen shots.
5. Voila! You’ve got your awesome free mockups in Canva! You can change the background colour, add elements and download. Again, jpeg format is best for use on the web because the file size is small and won’t slow down your site!

That’s it – super simple, hey?!

Which option do you think looks better?

Option 1: A mockup made in Canva using image effects:

Or Option 2: A mockup made in Canva using frames?

Where are you going to post your mockup images? If you post them on Instagram, tag me so I can see what you come up with @wildrose_creative. I can’t wait to see!

And if you want mockups that are a bit more complex, contact me and I’ll give you a hand.