Welcome to the MacNN Forums.

mzllr · Jul 16, 2003, 09:18 PM

i work mainly in web design and while i have an online portfolio, whenever i go to an interview employers like to see a printed portfolio.

the problem i'm running into is taking screenshots of my websites and getting them to print out 'crisply'. the process i use right now is to use 'grab' in osx to take the screenshot, take the tiff file into photoshop to crop, into quark for page layout, and then to print.

i have a feeling that the dpi of the screenshots isn't high enough for print work. so i was wondering if anyone knew of a better way to go about printing out examples of your webistes.

thanks...

bradr · Jul 17, 2003, 12:11 AM

If money is no object, say abut $250. You can invest in Adobe Acrobat. The full version allows you to capture a website to a PDF (cool thing too, the links still work). You can capture a page, or the entire site. I've had good results with that method.

meem · Jul 17, 2003, 01:38 AM

I use Snaps Pro for such thing when I need screen captures . It did come with my computer when I bought it. Its only like 30 bucks to register the full version but you can give it a try. I don't use it to make portfolio pieces but I thinks its better than Grab.

http://www.ambrosiasw.com/utilities/snapzprox/

mzllr · Jul 17, 2003, 02:24 AM

thanks for the advice, bradr & meem. i'll give those a shot and see how they come out.

arclight · Jul 21, 2003, 08:03 PM

I take screenshots of my web work all the time. I just grab the screenshot with the old command+shift+3 or if you want to grab just a section, command+shift+4. When I was in OS9 I used Snapz Pro which is a very cool program. It allowed you to specify grabbing entire screens or windows and cursor visibility (and a millioin other things).

The built in screenshot commands (which may simply invoke the Grab app) work fine for me. I take the final shot into Photoshop and edit out the background to white. I also always include the browser window since you will never see the page without it. Safari makes even crappy websites look better. I'm not sure how the antialiasing of OS X will effect your page copy though. You may have to fool with the settings. Oh, and 72dpi is fine, upsampling will not help you. The information isn't there and the prints at 72 dpi are crisp and clean. images are a little blurry but it's the web!

Snapz Pro will allow you to skip the editing of the background since you can grab JUST the browser window.

ARENA · Jul 21, 2003, 09:05 PM

Originally posted by arclight:

Snapz Pro will allow you to skip the editing of the background since you can grab JUST the browser window.

You can also grab only a window without Snapz pro. Just press command + shift + 4 and then the space bar. "New" cool Mac OS X feature introduced in Jaguar.

Burn · Jul 21, 2003, 09:14 PM

and a mouse click..

But that's the coolest trick! I have been doing lots of screenshots recently with CMD-Shift 4, but this is the cherry on top :-)

superblue · Jul 22, 2003, 10:53 AM

The only down side of the command-shift-4-space grab is that it doesn't grab the window's shadow.

For truly sexy portfolio shots, I recommend command-shift-4ing safari over a white desktop, making sure you grab the full drop shadow.

I always put a few small screenshots per page so you get a good feel for the whole of the site on just one page of my folio - and the upside of this is that the shrinking tightens up the images nicely.

Powaqqatsi · Jul 22, 2003, 11:22 AM

Just up the res to 300dpi in Photoshop and print it at 300 dpi. It will look like **** on screen, but it will look good printed.

redcalx · Jul 24, 2003, 11:27 AM

You're kidding right? That is wrong in every sense of the word.

What I usually do is take a screenshot of my site and bring into photoshop, and bring it up to about 150 dpi (while taking the dimensions down)

Try to find a printer with a Xerox 2600, It'll come out looking great.

Originally posted by Powaqqatsi:
Just up the res to 300dpi in Photoshop and print it at 300 dpi. It will look like **** on screen, but it will look good printed.

Powaqqatsi · Jul 24, 2003, 12:52 PM

Originally posted by redcalx:
You're kidding right? That is wrong in every sense of the word.

What I usually do is take a screenshot of my site and bring into photoshop, and bring it up to about 150 dpi (while taking the dimensions down)

Try to find a printer with a Xerox 2600, It'll come out looking great.

Well actually I'm not, ik works perfectly here.

Well, maybe not as good as "native" 300dpi but sure a hell lot better than 150 or something (I always push it to 360 dpi and print it on my Epson 750, looks pretty nice)

godzookie2k · Jul 25, 2003, 11:51 PM

then you are totally not picky enough.

Powaqqatsi · Jul 26, 2003, 07:47 AM

Originally posted by godzookie2k:
then you are totally not picky enough.

Well, I'm VERY picky. And it just works

and no I don't have eyesighyt problems. I do it al the time with CD-covers and they come out just nicely and very sharp. Maybe I've got some magic printer

But I have to be honest, the first time I did this, I was extremely surprised, I expected some pixelated junk to come out of te printer but it looked very good.

godzookie2k · Jul 26, 2003, 11:28 AM

Actually to be honest it depends. I have decent luck if I open my browser window to the full size of my monitor which is a pretty high res, and then scale it down, it turns out 'ok' small type stays kinda pixelly though.

gfourdoor · Jul 26, 2003, 11:38 AM

The best way to print screenshots clearly is to resize them "after" they are placed into a page layout application.

The RIP will do a far better job of upsizing than Photoshop can.

Powaqqatsi · Jul 26, 2003, 03:35 PM

Well, this topic makes me think about something. When you see certain pics in magazines. What if they have a low res pic ? How do the layoutpeople scale it up so that the pic looks good printed at 300 dpi ? I think it's not always possible to have high res pucs if stuff you need...

godzookie2k · Jul 26, 2003, 03:38 PM

I work at a magazine. if we get pictures (digitally) in that aren't native 300 dpi at the appropriate size (and trust me we can tell without opening photoshop) the pictures don't run.

We send slides out by the hundreds for drum scanning, and its our preferred image delivery format.

If someone can't get us a high res photo or a scan, we send a photographer.

chris v · Jul 26, 2003, 08:38 PM

Originally posted by Powaqqatsi:
Well, this topic makes me think about something. When you see certain pics in magazines. What if they have a low res pic ? How do the layoutpeople scale it up so that the pic looks good printed at 300 dpi ? I think it's not always possible to have high res pucs if stuff you need...

My new line when someone hands me a crap image is "It's gonna look like that, you know."

You can squeeze a few dpi out of bicubic interpolation, but it's hit and miss. you can go from 250 dpi to 300 dpi, with maybe a little de-speckle filter and unsharp mask, but don't expect to be able to go from 72 dpi to 300. (Don't get me going on all the arguments I've had with web designers about print resolution.)

... (and then there's the ones who will take the same 72 dpi jpeg that you just rejected, and type in 300 in the pixel dimensions dialog and then re-save it as a tiff and hand it right back)...

Back on topic somewhat... I tend to save all my web site workup files as native PSDs so that I've got hi res versions if I ever need to re-size them.

ghost_flash · Jul 27, 2003, 03:16 AM

Originally posted by Powaqqatsi:
Well, this topic makes me think about something. When you see certain pics in magazines. What if they have a low res pic ? How do the layoutpeople scale it up so that the pic looks good printed at 300 dpi ? I think it's not always possible to have high res pucs if stuff you need...

Hi-rez should be the starting point.
At the last job I had, building a catalogue, I found many of our photos in the database were crap, and whenever I had to deal with them, I either ordered the product from the catalogue, then photographed it myself, or contacted the manufacturer (read big ticket and my a-hole boss would not aprove of the shoot) and negotiated to have them shoot it or send me hi-rez. I told them, they can have their product look like **** in our catalogue, or not, it was up to them. I always got hi-rez out of them for my files.

If you do print work, then why on earth would you bump the rez on a 72, 90, 150 dpi sub par image?

godzookie2k · Jul 27, 2003, 12:35 PM

because non-designers don't know better.

Synotic · Jul 27, 2003, 06:15 PM

This is probably really wrong... But can't you just print from the browser? That way it actually prints the text as text and not pixel data... Or even save the page as PDF and print that. Feel free to point this out as a dumb idea

mzllr · Jul 28, 2003, 02:19 AM

Originally posted by Synotic:
This is probably really wrong... But can't you just print from the browser? That way it actually prints the text as text and not pixel data... Or even save the page as PDF and print that. Feel free to point this out as a dumb idea

not dumb... just when i print a site out for my portfolio i like to have the browser in there, as a way to frame the page...

so i normally turn to screenshots.

godzookie2k · Jul 28, 2003, 08:42 AM

Originally posted by mzllr:
i like to have the browser in there,

Zmai · Jul 28, 2003, 09:15 AM

I print my website screen captures at 150dpi, which makes them smaller on paper but also makes the image far more acceptable. My clients have been pleased with this solution.

.z

velodev · Apr 7, 2004, 02:03 PM

I don't know if any Mac apps do this but one of the best screen capturing apps I have ever used is HyperSnap for PC. You can actually adjust the dpi before you snapshot and take a screen capture - with scrolling.

I am not a print designer, I do only web - however it would be stupid for me to not have a printed portfolio during an interview.

Anyone know of any Mac capturing apps that can take 300 dpi?

scottiB · Apr 9, 2004, 01:39 PM

I'm not a graphics pro, but you might try Genuine Fractals:

http://www.lizardtech.com/solutions/gf/

The LE version is $49, has some limitations (file size cap, no CMYK), but it should be able to increase a web site DPI from 72 to 300 with little loss in quality. I use it to enlarge old family slides scanned at 1600 dpi.

A demo of the full version (20 uses) can be downloaded.

godzookie2k · Apr 10, 2004, 04:59 PM

well, you actually can't really magically increase the dpi from a screenshot from some application, whats on your screen is 72 dpi, you can't change that. apps like this are just doing the same thing as photoshop would to increase the dpi of an image, guessing..

scottiB · Apr 10, 2004, 07:58 PM

Originally posted by godzookie2k:
well, you actually can't really magically increase the dpi from a screenshot from some application, whats on your screen is 72 dpi, you can't change that. apps like this are just doing the same thing as photoshop would to increase the dpi of an image, guessing..

I should've been clearer. I didn't mean to imply that GF can create pixels from nothing, but it can provide better results than upsampling in Photoshop. I wouldn't create a 60'x21' billboard with a screen grab but for what the original poster wants, it should be viable.

reviews:

http://www.imaging-resource.com/SOFT/GF/GF.HTM
http://www.macworld.com/2003/10/revi...calingplugins/
http://www.bainb.dsl.pipex.com/Fractal/Review.htm
http://www.inkjetart.com/news/gf/

graphicpush · Apr 11, 2004, 08:31 PM

I wrote an article about this not too long ago and posted the link on this forum ...

http://www.graphicpush.com/tutorials/screenshots.shtml

In various capacities, it details the problems you cited. A few people disagreed with the concept of upping the resolution since you can't make a 72 dpi image magically be a perfect 300 dpi image, but I have printed hundreds of screenshots, and for some reason, upping the rez through "Nearest Neighbor" produces a better final image. I hope you find the resource helpful.

siliconwarrior · Apr 14, 2004, 08:42 AM

Yes, we've been here before...

Myself and graphicpush are of differing opinions on this one.

"There is nothing to be gained by any method of resizing a screen capture. Crop it and clean up the corners etc, sure, but for best results don't change the pixel dimensions - there's no point.

Screen captures are the one exception to the 300dpi print rule; all you will achieve through resampling is a blurred (anti-aliased) image. As for file size, a 1024 x 768 screen capture is 2.25MB uncompressed, and this needn't be increased for print output."

Thorzdad · Apr 21, 2004, 01:53 PM

If I'm preparing screenshots of websites I've worked on for a printed portfolio, I will often go to the trouble of going back to the original images (which are almost always larger and higher rez than the final "web" versions) and re-build the pages I want. Yeah, it's extra work, but the printed results look clean and sharp.

art_director · Apr 27, 2004, 08:33 AM

i just need to say a few things here.

1) screen grabs should never be used for production. they're not of sufficient quality. period. no application can improve them. sure, some tight azz clients will tell you they're good enough but it's a crock and i would be concerned about the checks from those clients clearing the bank. personally, i refuse work from people who find such things acceptable.

2) to the original question � yes, screen grabs could be used but why when acrobat will make your work look so much better?

3) film is always preferable. working with digital imagery blows. i've been around a long time and can assure you there are a number of problems and issues with digital images. some would disagree but i challenge them to color correct hundreds of digital photos for a campaign on a tight timeline and with a small budget. that gets you one thing: an ulcer. been there. done that. hoping to never see that day again. long live film.

graphicpush · Apr 28, 2004, 08:27 AM

screen grabs should never be used for production. they're not of sufficient quality.

We know this, but the simple fact is that they are often necessary. when you do brochures for software companies, you are going to need a lot of screenshots, so they might as well be as clean as possible. I have done a few experiments in this area -- 72 dpi grabs do look like ****, but ripped to a vector EPS, they look much better. The screenshots look so clean and seamless that it almost look like photography.

film is always preferable.

Couldn't agree more. I worked in fashion for a long time, and everything was done on film. It was an expensive process, but when you're running a couple million pieces, it had better be perfect.