Skip to content

Tablet & Smartphone Mockup

iPad··PSD

Tablet & Smartphone Mockup

What's inside

  • Applications Photoshop
  • File Types PSD
  • License Free (see author's terms)
  • Author Dribbble Graphics

Need to show a tablet app to a client? This tablet smartphone mockup does the job in a few minutes.

It’s a handy file for product teams and publishers. Screenshots with a white background can blend into the bezel; a thin shadow or darker UI reads better.

Stakeholders who don’t read wireframes still understand a screen on a device straight away. Pair it with a second device from the same angle to show a responsive layout.

Use it for

  • A tablet app
  • A digital magazine page
  • An e-learning screen

The file is made by Dribbble Graphics. The download button takes you to their page, where you get the original file and the licence details.

What you can edit in this Tablet & Smartphone Mockup

Main things you can change in Photoshop:

  • Screen design, placed through the smart object
  • Background colour
  • Screen glare and reflection layers
  • Device colour, where the file includes it

Add your design to the Tablet & Smartphone Mockup

  1. Export your screen design as a PNG at the exact size of the screen smart object.
  2. Open the file in Photoshop and double-click the smart object thumbnail in the Layers panel.
  3. Place your design, hide the sample artwork, save, and go back to the main file.
  4. Change the background colour to fit your brand.
  5. Save a JPG for clients and social media, and keep the PSD for later changes.

One more thing: turn the screen glare layer down if your UI has small type. Glare looks nice but hides detail.

Best uses for this Tablet & Smartphone Mockup

  • Show a tablet app to a client before it goes to print or production.
  • Show an e-learning screen on your online shop or product page.
  • Present a digital magazine page in a client proposal or brand guide.

Quick notes on this mockup

  • Made by Dribbble Graphics. The download size and format are listed on their page.
  • Check the licence on the author’s page. Personal and commercial terms differ from file to file.
  • Built for Adobe Photoshop. A recent CC version handles the smart objects best.
  • Check the smart object size before you design, so your artwork fits without stretching.

Scroll down for similar ipad mockups from other designers.

Questions about this mockup

Is it free for commercial use?

It's free to download, but the licence belongs to Dribbble Graphics. Check their page: it states whether commercial use is allowed and if attribution is needed.

How do I put my artwork on the tablet?

Find the smart object layer (it has a small icon on its thumbnail), double-click it, place your design, then save and close that tab.

Which Photoshop version do I need?

A recent Photoshop CC version is best. Older versions can open the file but sometimes have trouble with smart objects and effects.

Can I remove the screen reflection?

Usually yes. Reflections and glare are normally a separate layer that you can hide or lower in opacity.

Advertisement