App Screen Showcase Mockup
What's inside
- Applications Photoshop
- File Types PSD
- License Free (see author's terms)
- Author Graphberry
This app screen showcase mockup is one of the simpler ways to present several app screens or a website flow convincingly.
Useful for UI/UX designers as much as for Dribbble posters. One thing worth knowing: put your strongest screen in the most visible position. People judge the whole set by the first screen they see.
Stakeholders who don’t read wireframes still understand a screen on a device straight away.
Credit goes to Graphberry. We link to their download page rather than re-uploading the file, so check their terms there before commercial use.
What’s inside the App Screen Showcase Mockup PSD
The PSD is layered, so you can change:
- Screen design, placed through the smart object
- Screen glare and reflection layers
- Background colour
How to use the App Screen Showcase Mockup
- Take a clean screenshot of the app or website you want to show.
- Open the file in Photoshop and double-click the smart object thumbnail in the Layers panel.
- Drop your artwork in, fit it to the canvas, save and close. The mockup updates by itself.
- Export a full-size image for your portfolio and a smaller one for social media.
Worth remembering: turn the screen glare layer down if your UI has small type. Glare looks nice but hides detail.
Best uses for this App Screen Showcase Mockup
- Show a case study header on your online shop or product page.
- Make two or three colour versions of a UI kit preview and let the client pick.
- Use it as the cover image for a website flow in your portfolio.
Good to know
- Made by Graphberry. The download size and format are listed on their page.
- 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.
- Some free mockups ask for credit when you post them. A short line in your caption is enough.
Need a different angle? The app screen mockups category has plenty more free PSD files.
Questions about this mockup
Can I use this screen presentation mockup for client work?
Graphberry sets the licence, and it can differ from file to file. Many free files allow personal and commercial use, but some are personal-only or ask for credit. Read the terms on the download page before a paid project.
How do I put my artwork on the screen presentation?
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.
What size should my screenshot be?
Open the screen smart object and check its canvas size in Image › Canvas Size. Paste your screenshot at that size so it stays sharp.
Why does the download open another website?
We list free files from designers around the web and link to the original page, so Graphberry gets the visit and you get the file exactly as they published it.
