Unlimited PS Actions, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
  1. Design & Illustration
  2. Product Mockup

How to Use Envato Elements Assets to Create a Product Mockup

Final product image
What You'll Be Creating

Digital assets are a great boon to any designer's toolbox. With Envato Elements, Envato's upcoming subscription service for asset downloads, you'll have access to thousands of top quality digital assets, from add-ons to product mockups and more!

In this quick tip tutorial, we'll combine two of the freebie assets, a coffee branding mockup and a vector watercolor texture, from Envato Elements. For this tutorial we'll be using both Adobe Illustrator CC and Adobe Photoshop CC.

1. Using Watercolor Textures

Step 1

Let's start in Adobe Illustrator CC. Using the Type Tool (T), write out a quick word or two. I've chosen "LO VE &" for my type.

Using the Type Tool T write out a quick word or two Ive chosen LO VE  for my type

Step 2

Expand (under Object) your type or Create Outlines. Doing so will convert your type to objects, making it easier to edit them.

Expand under Object your type or Create Outlines

Step 3

Arrange your type as you see fit. I Scaled my ampersand up and rearranged my letters a bit for my design. When satisfied with your placement, Select all of your objects and Unite them in the Pathfinder panel.

Rearrange your type objects and unite them in the pathfinder panel

Step 4

Open the watercolor brushes and textures file from Envato Elements free downloads. Copy (Control-C) one of the watercolor textures provided in the pack and Paste (Control-V) it into your document.

Place it behind your text object in the Layers panel. You may have to ScaleRotate, or edit the texture a bit.

Copy and paste watercolor texture into your document

Step 5

Select the watercolor group and the text group and create a Clipping Mask (Control-7). Now your text has a fantastic watercolor texture applied to it. Consider layering multiple textures to get a different effect.

Select the watercolor group and the text group and create a Clipping Mask Control-7

2. Using a Product Mockup

Step 1

Let's switch over to Adobe Photoshop CC. I'll be keeping both of the programs open for this section.

Download the free coffee cup product mockup pack from Envato Elements. Open one of the files included. In the Layers panel, Double-Click one of the Smart Objects in order to open it.

In the Layers panel Double-Click one of the Smart Objects in order to open it

Step 2

Copy your design from Adobe Illustrator CC and Paste it into the Smart Object document in Adobe Photoshop CC. I typically Paste in objects as Smart Objects so they retain their scalable features.

Place or edit your object as needed so it matches up with the label already present in the file.

Place or edit your object as needed so it matches up with the label already present in the file

Step 3

Once your object is placed over the placeholder object, Hide the original Smart Object layer in the Layers panel and Save (Control-S) the document. You can also just replace or delete this layer if it takes your fancy.

Hide the original design layer

Step 4

Back in the mockup document, you'll find the coffee cup you edited has a new design on it. Repeat on any other Smart Object layers within the document and save your file.

Repeat this process on the other smart objects

Great Job, You're Done!

Now that you've got the hang of combining and using these digital assets, apply your design to some of the other product mockups included in the pack to create a full set of presentation pieces. Or create different designs to create a series of portfolio pieces.

Check out more assets and sign up for Envato Elements to get some fantastic freebies!

Our final product mockup
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.