So you have a blog .. running on nice big server somewhere. You’ve installed some publishing software, lots of plugins, some slick themes, AND carefully planned content. You’re pimpin’ .. or are you? But wait, why are your screenshots so blah?!!

Late, late last night I got started with iMovie - an hour later, out popped this screencast (.mov / 2:08 / 12MB / 800×600) which gives a quick brisk overview showing how to make your screenshots get noticed with a few basic Photoshop manipulations (two examples below by Derek of 5ThirtyOne):

The Dialogue

So you find yourself in need of a cool screenshot, what to do? Although this demo shows me saving and editing the entire page, you can always take smaller screenshots of a selected area (Shift-Command-4 in OSX) then import to Photoshop for further editing. From there, the demo shows the layer being duplicated twice to create a ‘background’, and two ‘content boxes’. Select the focused content, delete the inverse selection, then move it onto the background - rotate, add effects, and voila! Hopefully seeing the actual keystrokes helps you follow along, as I sped it up quite a bit.

Tools Used

Image capture and editing were done with Firefox Add-On Pearl Crescent Page Saver for capturing the page and Adobe Photoshop for the rest. To create the screencast, iShowU was used alongside Keycastr (displaying keypresses) and the result then imported into iMovie HD 6 to add the audio and effects. All of this was done on a 15in MacBook Pro sporting a 30in Apple Cinema Display.

You may file complaints below for wasting two minutes of your life