How to handle screenshots for print
- Started
- Last post
- 16 Responses
- markeebee
I'm producing a little promo booklet which has to contain screenshots at reasonably large sizes (say 8-10 inches). The problem is that they're obviously much lower resolution than the final output (72dpi as opposed to 300dpi), so the final sizes are tiny unless I enlarge them (which makes them look pretty rough).
Can any of you print designers give me some tips on how to make the screenshots look half-decent when printed?
- jysta0
I normally try and res them up to 150dpi usually a better compromise if your wanting to print at a larger size.
8-10 inches is pretty big no? - 'well, thats what she said'
- markeebee0
Yeah it is pretty big—I tried to explain that it wasn't a great idea but nobody ever listens to me... :)
So do you literally just resample and increase the DPI, in Photoshop or similar?
- frost2150
i just ran into the similar problem and what i ended up doing mocking up a laptop with the screen shot in it. Go find yourself a free psd laptop mock up and just drag and drop the screen shot in front of it. Should look ok when printed.
- johndiggity0
set your monitor resolution insanely high and then take the screen captures.
- Nice thought, but it means that the stuff in the screenshots will be tiny cause it's mostly fixed width web pages.markeebee
- markeebee0
Cheers for that guys, I think I'm just going to go with whacking up the DPI and hoping for the best then. Just tried it and it doesn't actually look too bad if you use the 'Bicubic Smoother' resize method in Photoshop.
- linearch0
get on a big monitor, make the browser window as big as possible to get the most pixels.....been in your position before.
good call on the laptop frame.....you can a least shrink the image some then.
- nosaj0
Take a photograph of a monitor displaying the website. Collage it up a bit.. maybe have the actual PSD mock small in one corner, a detailed close up in another spot and the photo behind it all.
- ESKEMA0
take a picture of the screen with a camera, otherwise do what they said above.
- acrossthesea0
Good resource for Mac stuff to add your screenshots to.
http://www.apple.com/ca/press/pr…
- duckofrubber0
When you resize the screenshost, change the method to "Nearest Neighbor". This makes everything bigger while avoiding the anti-aliasing that can cause fuzziness.
- fugged0
if you have a problem with the content being too small in the web page when you set your monitor to a really high resolution, then try zooming in on it using the browser zoom controls (firefox and safari support it - not sure about how well IE does). CMD +, CMD -
- JackRyan0
Will this help?
http://www.webdesignerstoolkit.c…
- ReverendGeneral0
I do this constantly as part of my job, here's what I do to get the best ones for print:
Make the window as small as possible that still looks good. Eliminate as much unneeded space as you can. If you're capturing your whole screen, change your resolution to as small as makes sense.
Capture the window/screen in whatever you use. Honestly I find PrntScrn does a fine job of capturing the entire screen.
Open the capture in Photoshop (or paste it into a new doc if using PrntScrn). Open the Image Size dialog.
Now here's the most important part: TURN OFF IMAGE RESAMPLING. Do not resample the image at all, this will give only let you change the print size and will adjust the DPI accordingly. Don't change the DPI.
This will give you a razor sharp printed screen capture because it will just adjust the size at which the pixels are printed. If you start with a very large screen capture, it will make your fonts very hard to read but if you use a smaller screen cap you will be able to read everything.
Test it out a couple times on your own printer to see. I spent a week researching this and it is the only way I've found to reliably resize screen caps for print.
- Basically the same thing as using Nearest Neighbor as the resampling method, except you don't end up at 300 dpi.duckofrubber
- Nearest Neighbor can introduce doubled lines and pixel artifacts at odd resize calculations. Wasn't reliable for me.ReverendGeneral
- Hmmm... I can see that as being a potential issue.duckofrubber
- formed0
I use SnagIt for screen captures. I think I have it set to 96dpi and seems to work fine. Obviously compressed images won't look better than they really are.
For our designs, almost everything is done in Illustrator, so we just export out hires jpegs of each page (and use hires images for the design process/client feedback/approval).
Works well for portfolio printing and future stuff.
- ^ I do maximize my screen, then use Snagit to grab a shot, then resize in PS.formed