We live for type. The FontFeed is an inspirational journal of typography tips, recommended fonts, and bits of design from around the web that caught our typographic eye.
Tip: The Worn/Weathered/Stamped Look
There are quite a few quality “stamp” fonts available — Frankie and Frankie Dos, Despatxada, FF Stamp Gothic, FF Confidential, FF Bull to name but a few. Unfortunately ready-made stamp fonts present a number of drawbacks: repeating characters are identical, and the amount of detail is limited due to restrictions in the possible number of Bézier anchor points per glyph. To remedy this I developed a trick in Adobe Photoshop for distressing type. This technique allows you to apply a convincing stamped or weathered look to any typeface.
Create whatever type composition you need in Adobe Illustrator or directly in Photoshop. Just remember to keep the resolution fairly low, because we’re going to need pixel texture halfway through. I created this example in Illustrator using Tasse Black Extended at 96pt/72pt and opened it in Photoshop as a grayscale image at 72 ppi.
Select the black type areas with the magic wand or by using an alpha channel based on your composition. (Duplicate channel…: Black: invert -> Select…: Load selection: Black copy: new selection) This prevents you from mucking up the white background.
Apply a High Pass to “eat away” the insides of the characters (Filter: Other: High Pass…) Play a bit with the slider: for the example I set the Radius to 10 pixels and applied it twice.
Apply a fair amount of Gaussian noise to achieve the “grainy” texture. (Filter: Noise: Add Noise…: Gaussian) For the example the slider was set to an amount of 15.
Deselect.
Increase the resolution by resampling. (Image: Image size…: resample image) I doubled the resolution from 72ppi to 144ppi.
Diffuse the image to mask remaining bitmapping of the character shapes (Filter: Stylize: Diffuse…).
Increase to the desired resolution by resampling. (Image: Image size…: resample image) I doubled the resolution from 144ppi to 288ppi.
Apply a Gaussian blur of 1 pixel to remove the tiny pixels created by the Diffuse filter. (Filter: Blur: Gaussian Blur…)
Increase the Brightness and Contrast until you reach the desired amount of “inking”. (Image: Adjustments: Brightness/Contrast…) I set both sliders to +50. As the High Pass filter we applied at the very beginning primarily affects areas with substantial volume, I did a partial selection of the border and applied a higher amount of contrast (+75) to bring out more noise.
Threshold the image to prepare for conversion to a bitmap image. Here you can also play a bit with the slider until you reach the desired amount of “inking”. (Image: Adjustments: Treshold…) I set the slider at 96.
Here’s what it looks like from up close: the effect is perfectly random.
Convert to a bitmap image (Image: Mode: Bitmap…: 50% treshold), save as TIFF and import in your lay-out software of choice. You now have a compact sized graphic with transparent background that can be coloured and overlaid on any element in your design. Et voilà, you’ve just used $3,000 worth of computer equipment to emulate the look of a $3 rubber stamp.
The beauty of this technique is that at every step you can vary the settings, thus achieving different textures, and different amounts of wearing and inking. Remember that the initial resolution of the Photoshop type composition is crucial in relation to the crudeness of the end result, so experiment a lot until you get the desired result. Have fun.
By Yves Peters | link | | 
October 28th, 2005 at 9:03 pm
Wow, this is brilliant. I’ve been doing things like this with fonts for ages but this is the best technical explanation I’ve seen on how to reproduce this effect. Mine is usually more random experimentation to create a similar effect.
Excellent.
October 30th, 2005 at 5:22 pm
very cool….
November 8th, 2005 at 4:58 pm
Thanks for sharing the technique Yves. I particularly like “$3,000 worth of computer equipment to emulate the look of a $3 rubber stamp”!
For some time I had been telling people to use analogue techniques like smeared paint, scratched out toner, and crumpled laserprints (’scrunching’) and then to scan the results at 300dpi or better. This was in preference to the technique Adobe called ‘Creating a rustic or eroded effect’ on type (p.76 ‘Design Essentials’ Adobe Press 1992) using PhotoShop 2.0’s diffuse filter. I guess insisting on the idea that Photoshop should never be used for setting type — even display type — is just old dogma now.
November 21st, 2005 at 5:50 pm
Yves, you have shown us another reason to be open about working outside our comfort zones and remaining open to possibilities.
This is a fine technique to enhance creativity and production. Great article. Thanks.
December 1st, 2005 at 11:57 pm
Mabuhay, Yves!
In a serendipititious run of luck, I came across your tip while I was wracking my brains in search of a PhotoShop technique of “aging” fonts. Because of you, I now have a book cover about a manuscript written by a Filipino some 200 years ago — with the appropriate effects on the title text.
Thanks.
December 2nd, 2005 at 12:07 pm
Glad it was helpful, Dan. If you get a chance, please post or send us a snapshot of your cover.
December 5th, 2005 at 7:11 am
Great tutorial… any thoughts or tips on how this might work with a t-shirt design?
December 5th, 2005 at 8:34 am
Thanks, this was perfect and easy! I’m sure it will be my new favorite! On some things, the HIGH PASS didn’t work well, so I substituted with ‘render clouds’ to achieve the grayscale variation. I love the final result! :)
December 6th, 2005 at 9:37 pm
Interesting. Never thought of going about it that way. I use this effect relatively often, but resort to scanning in photocopied black pages, playing with the levels for some grainy high contrast, and then screening the result on top of the type.
I think I’d still prefer my method, as it’s more organic, but I can definately see use for this method should lack of time or photocopiers and scanners present itself.
December 7th, 2005 at 7:53 am
> On some things, the HIGH PASS didn’t work well, so I substituted with ‘render clouds’ to achieve the grayscale variation.
What I didn’t tell was that I developed this little trick some 10 years ago, when you still needed a significant mass of water drops suspended in the sky to “Render Clouds”. ;^)
Consider this as a starting point and improve on the technique — I will definitely try out your variation. The main advantage of the High Pass filter is that it erodes more the inside of the shapes, which is very similar to what happens with stamped letters in real life .
December 9th, 2005 at 8:33 am
In answer to Stephen Coles’ query above, check out these plugin filters for PS:
http://www.mrretro.com/machine_wash_filters_three.html
They look like a good buy, if you don’t mind the fact that someone else’s hard work makes your designs look good!
May 24th, 2006 at 10:00 am
This is fascinating, especially Cameron Moll’s “Wicked worn look.” I have been seeing a lot of this type of treatment, especially in New Americana Music design…it seems to be a code for Rough Authenticity.
I still print things out and mash them about on a photocopier…but I will certainly give this technique a try!
June 23rd, 2006 at 8:21 am
i had to bookmark this one. thnx yves!
November 8th, 2006 at 6:58 pm
I like the comment about the $3000 worth of computer equipment to make the work of a $3 rubber stamp…
August 20th, 2007 at 6:07 am
Looks great, best part is, is it doesn’t look fake.
December 9th, 2007 at 8:00 am
Wow that is very impressive! I am a rubberstamper and my daughter often tries to make stamping and scrapbooking effects in her computer. Im going to forward this on!
April 10th, 2008 at 7:51 pm
Good tips. Fun to take the end result into Illustrator and play with livetrace. Right on!
July 17th, 2008 at 1:45 pm
Thank you! All other rubber stamp techniques I have seen fail where this one is FTW! Again thank you.
August 12th, 2008 at 8:00 am
Did anyone else have trouble getting the High Pass filter to work? On mine, it just turned everything gray. Adjusting the slider did nothing.
I guess I’ll resort back to my Mister Retro Machine Wash filter sets for now…
August 12th, 2008 at 10:08 am
Not sure why it’s doing that. Make sure everything is in greyscale and that you pay careful attention to the first step.
August 27th, 2008 at 8:37 pm
I had the same problem as matthew when i first tried this. You pretty much have to select from the alpha layer or the high pass turns everything grey. So you have to work from the channels and not regular layers.
August 29th, 2008 at 8:19 am
I was having the same problem, the black text needs to be directly on a white background, you can’t have it with a transparent background on a layer above a white background