We Lived Happily Ever After: How to Digitally Frame your Prints Using a Photo Mock Up (for white & chalkboard backgrounds)

Tuesday, May 5, 2015

How to Digitally Frame your Prints Using a Photo Mock Up (for white & chalkboard backgrounds)

I love shortcuts, because, let's face it... Life is way too short to do everything the hard way! Today I am going to share a simple process for displaying your artwork & prints in a "mock up." Basically, how to fake a staged print! :)

This is a great process for etsy shop owners and bloggers (like myself- I use mock ups all the time!) I just don't have the time to print, stage & photograph every print I make; so this process streamlines my efforts & allows me to produce more quality content with a beautiful staged "fake" (don't judge!!!) finished product.

With that said, here is how to make your own product mock up!

(I sell some mock ups on my creative market shop, as shown below)


Open your stock image up in Photoshop (you can do this same basic concept in Picmonkey too though!)

We are going to use a PNG image. PNGs are a type of file that can be saved with transparent background. 

Paste the PNG version of your print in your photoshop document. Make sure it's not a rasterized version of your print- for best results, you want the background to be transparent so that the paper in the frame shows through.

For added realism, you can tilt your PNG ever so slightly.

Lower the opacity to help the PNG blend. The less harsh it is, the more real it will look.

And there you have it, a nice convincing photo of your print, ready for your blog, shop, catalog, etc.


Now lets talk about adding a fully colored print to a mock up. This is slightly more challenging, but it is still totally doable & the finished product will look great!

First, paste your print into the photoshop document & re-size it accordingly. You can keep the original proportions of your print by holding down SHIFT while re-sizing it by moving the corners.

Next, lower the opacity so we can see where the frame's edges are.

Click on the "pen tool."

Trace around the edges using the pen tool. Simply just add a point on every corner and edge.

To adjust the sharp angles for places with curves, use the "add anchor point tool" to give your lines curves.

To ensure that your lines aren't harsh & pixelated, right click your image, press "make selection," and enter 2 for your feather radius. Right click again and press "select inverse." Press CTRL X.

You have now erased the edges of your print in alignment with your frame!

Increase the opacity again, and you are all done.

Hope that was helpful! Check out my SHOP for more great digital graphics tools & resources, or head on over HERE for tons of freebies!

This post included affiliate links, but I only share things that I LOVE & think you will too. :)


  1. Thanks for this tip! I am a new blogger and do everything the "hard way" lol. This will make things a lot easier!

  2. Thanks for the post. I've been looking for this!!! Do you find success on the Creative Market? I sell on Etsy and have had great success, but wondering if it's worth it to open a shop on Creative Market? Would love your input.

    1. Depends on what you sell. It's all about digital resources for people, so if you have something that is in demand (but lacking in actual resources) you will do really great. It's totally worth it to give it a try- I know I was pleasantly surprised at how well my shop has done. Also, it's a one time "time investment" so once you have a product up, it basically sells itself... no more work for you! ;)

  3. I am a blogger-newbie and this tip is super helpful!! Thank you :D

  4. I love your gorgeous styling and pretty mockups, but I must admit, I think a layered file and a clipping mask would be much easier to use than this method. :)