What Is a Mockup?

One of the terrific mockups available at Placeit

Always wondered what a "mockup" is but never managed to fully figure it out? Well, in today's video, we're going to break it down and see how easy it is to use one using Placeit's Mockup Generator.

Follow along on our Envato Tuts+ YouTube Channel:

A mockup is a full-size model of a design or device, used for product presentations or other purposes.

Think of it as a means of showing off what your design will actually look like when it's put out into the real world. You can see lots of mockup examples in our blog post on the latest mockup trends for 2020.

Depending on your skills and time, you can go through the process of creating your own mockup using dedicated graphics software such as Adobe Illustrator or Photoshop, but sometimes you might be better off using more basic tools like the Mockup Generators offered at Placeit.

What Is Placeit?

What is Placeit, you might ask. Great question. Placeit is an affordable online design generator that makes premium professional branding, promotion and marketing tools accessible to everyone regardless of skill level.

Benefits of Using Placeit

1. Easy to Use

What makes Placeit so incredible is that it provides design novices as well as those with more experience with high-quality designs, logos, videos and mockups that they can customise online and download in a matter of seconds.

This means that you can design all your branding and marketing materials directly from your browser, without needing complicated software or training.

2. Unlimited Downloads

One of the great things about Placeit is that it's designed to suit a range of budgets. If you regularly need mockups, logos, and various designs, you can sign up for a low monthly or yearly plan. This gives you access to unlimited downloads of any and all the digital assets available at Placeit.

You heard that right. One low monthly/yearly fee = unlimited access to the best logos, mockups, designs and videos available on the internet today. But that's not all.

3. Affordable

What if you're on a budget and can only afford to buy one digital resource at a time? Rather than take advantage of that low monthly/yearly fee, you can create the resource you want and pay a small fee to download just that resource. How cool is that?

How to Use Placeit to Generate Mockups the Easy Way

Now that you know what Placeit is, let's show you how easy it is to use it.

Placeit's powerful platform offers you an incredibly diverse mockup library that you can use in combination with its online generator to do all the work for you.

Step 1

Let’s say I’ve finished working on a weather app, and I want to show the client what the home screen will look like on a real device.

In a matter of seconds, I managed to find a great iPhone X mockup that I feel that would be a great fit for the project.

Step 2

All I have to do now is upload my design, either by using the Upload Image button or by providing a link to it.

If I hover over the first option, it will let me know what size the image needs to be in order to be a good fit.

As soon as I click on it, it will allow me to select my image, giving me the option of adjusting the position and size of my design.

Step 3

Once I’m ready, all I have to do is click on the crop button, which will quickly give me a preview of what the final image will look like.

If I find that I need to make some quick adjustments, I can easily do so by clicking again on the little crop button, which will bring up the previous window.

Once I’m happy with the result, I can easily download the image by simply clicking the Download button, which will charge me a small fee for using the mockup.

As soon as I’ve downloaded the image, I can open it up and then use it however I want to.

Step 4

What I love about Placeit is that it has a huge library of mockups, some of which give you the option of making colour adjustments on the fly, like this T-shirt one.

As with the previous one, I’ll quickly go through the process of uploading my image, and then if I take a close look at the top-right corner of the page, I can see that I have an option called Shirt Color.

If I click on the little dropdown button, it will give me the option of changing the T-shirt’s colour using either one of the predefined values or a new one of my own.

Once I’m happy with the result, I’ll press the Download button and then quickly go through the process of acquiring it.

15 Awesome Mockups You Can Find at Placeit

Now let's take a look at a selection of cool mockups you can customise with just a few clicks.

T-Shirt Mockup Templates

1. Mockup of a T-Shirt Hanging Against a Solid Background

First up, T-shirt mockup templates. Placeit has a huge selection of T-shirt mockups that will leave you wanting more than just one. With this example, not only can you add your design with just a couple of clicks, but you can also change the colour of the background as well as the colour and type of graphic that surrounds the T-shirt.

2. Mockup of a Fierce Woman Wearing a Plus Size T-Shirt

Some projects work best with a person actually modelling the design. If that's the case with your projects, then you'll be spoiled for choice with the number of different age groups, genders and ethnicities you can select from at Placeit. This beautiful T-shirt mockup features a young woman in a cap-sleeved tee and denims, which would be a great choice for a clothing logo or a humorous or socio-political message.

3. T-Shirt Mockup of a Boy Sitting on a Log

Maybe you're looking to market nature or outdoor activities business to kids. This T-shirt mockup of a kid looking calm and happy while sitting on a decaying tree trunk would be a great choice of mockup for you, but it's also just one of the many premium mockups at Placeit that would be ideal for your project.

Hoodie Mockup Templates

4. T-Shirt Mockup of a Dad and His Daughter Wearing a Hoodie at the Park

Now, on to hoodie mockup templates. This sweet father-daughter template is a bit of a hybrid. It's both a T-shirt mockup and a hoodie mockup template, and it's a great choice when you want to show your design on different garments or work by different ages.

5. Pullover Hoodie Mockup Featuring a Serious Woman Looking at the Camera

This pullover hoodie mockup is a great way to keep all eyes on your design as the area where your design will sit faces the camera squarely and rests front and centre of the frame.

6. Both-Sides View Mockup of a Couple Wearing Pullover Hoodies at a Studio

If you need a hoodie mockup template that allows you to show how your design looks both on the back and the front of a hoodie, this would be the mockup for you. In addition to giving you a clear view of the front and back of a hoodie, it also gives you the opportunity to display different designs for male and female genders if you need to.

iPhone Mockup Templates

7. Mockup of an iPhone 11 Pro Surrounded by Baking Supplies

Now on to iPhone mockups. The sky's the limit when it comes to great iPhone mockups at Placeit. This wonderful flatlay is just one of a variety of flatlays you can choose from to display your app, website, etc. This one targets the world of bakers, so if you've created a backing or recipe app or are launching a new cooking blog or looking to promote your bakery business, then this is the iPhone mockup for you.

8. iPhone 11 Pro Mockup Featuring a Smiling Man with Glasses Against a Blue Surface

What better way to show off your new app or website than to have someone who is clearly happy having found it showing it off to the world? That's just what this iPhone mockup is all about, and with such a clear view of the image you'll be uploading, everyone will get the point.

9. iPhone 11 Pro Mockup Featuring a Woman Holding Her Phone

This great over-the-shoulder shot of a young woman looking at her iPhone screen is another great way to share or show off your product, app, or website or to make an announcement. One of the things that makes this iPhone mockup particularly attractive is the softly blurred foreground and background, which allow your viewer's eyes to focus fully on your content.

Book Mockup Templates

10. Mockup of an 11 oz Mug and a Book Placed on the Floor

How cosy is this image filled with all the things that comfort us on a cold night? A plush carpet, a warm sweater, comfy socks, good music, a warm drink, and a great book. With this gorgeous book mockup, you get a two for one. You can add the cover of your book to a realistic scene and reinforce the image on the cover with the one on the coffee mug. Of course, you can also express the same idea the other way around.

11. Book Mockup of a Girl Sitting on a Pile of Books

Whether you've self-published your own children's book and need a book mockup to show a child enjoying your creation, or you want to be proactive about promoting your industry published children's book, this is a template you need. It features a child sitting quietly on a pile of books, devouring a new book—yours—with relish and enjoyment. What could be better?

12. Book Mockup Featuring a Middle-Aged Couple Reading at Home

Another terrific book mockup template, this one shows a couple at home relaxing and examining books they're probably getting ready to read. This mockup would be great if you want to show two different books in a series, if you're testing covers, or if you simply want to make the point that your book is for heterosexual couples.

Laptop Mockup Template

13. Mockup of a MacBook Pro Placed on a White Work Desk and Next to a Plant Pot

Are you a lifestyle blogger, a YouTube aficionado, a designer, or an app or website developer? If so, this could be a great choice of computer mockup to display your design, website, channel, etc. Just use the handy upload button on the mockup generator to upload your image, and before you blink, your mockup will be ready to download.

14. MacBook Pro Mockup Placed Next to a Guitar

Musicians, recording artists, and sound masters will love this MacBook Pro mockup, which features a clear view of the laptop's screen surrounded by the trappings of music making.

15. Laptop Mockup Featuring a Businessman at the Office Working on his Laptop

We round up our sample of enticing laptop mockup templates with this great mockup of a businessman making notes in front of an open laptop screen, which of course is just waiting for you to upload your image and share it with the world.

More Premium Mockup Templates From Envato Elements and GraphicRiver

If you are skilled with sophisticated software like Adobe Photoshop and want a bit more control over how you use your mockups, then you may be interested in both Envato Elements and GraphicRiver.

Both offer high-quality mockups, but each service is a bit different from the other.

Envato Elements offers thousands of terrific PSD mockups by talented designers, and you can download as many as you want, as often as you want, for one flat monthly fee. What's more, that monthly fee also allows you to access thousands of premium digital assets like fonts, logos, graphic templates, mockups, photos, business card templates, and much more.

envato elements product — Display Mockup Creator is just one of thousands of mockup available at Envato Elements

GraphicRiver is another service that offers thousands of premium PSD mockups for Photoshop users, but it is better for those who are on a budget and only want to buy one mockup at a time.

So if you are proficient in Photoshop and you're interested in purchasing just one mockup instead of experimenting with several, then Graphic River may be a better choice for you. You can download a single mockup for one-time use for a low fee.

graphicriver product — Phone Mockup and Header Creator is just one of the high-quality mockups available at GraphicRiver

Choose Your Favourite Mockup Today

No matter which method you end up using, mockups can easily help you bring your design to the next level by allowing the viewer to preview what it would look like in real life.

And finally, if you want more information on other terrific mockups that are affordable and easy to use, check out these really helpful articles below: