"Grand grimoire effect" in photoshop


I'm helping out in creating an ARG game. For this game I'll need to create pictures of ancient pentagrams and illustrations that look like they are a result of a very bad scan of medieval hand drawn pictures cleaned up.

To show a few examples:

  • Lines are not completely straight, somewhat dodgy.
  • Parts of the lines are faint or completely missing.

enter image description here

  • The quality of the whole thing is horrible.

What I currently have:

enter image description here

  • The thing is sketched up in paint as you can see. The next one is a little better.

enter image description here

  • The font is crappy and not archaic. I might need a proper font.
  • The lines are too clean.
  • The picture is too clean in generaly.

My questions are

  • How to achieve an effect that makes the lines dodgy and faint?
  • What font should I use that resembles the one in the first example picture?
5/26/2015 5:08:00 PM

Accepted Answer

I'd use Illustrator for this. Creating the paths, setting the type, etc is all just easier in Illustrator than it is in Photoshop.

Just create your base shapes, combine them. Use Object > Expand to turn the strokes into shapes, then use Effect > Distort & Transform > Roughen to add some life to the straight shapes. And finally, if you want, add an Opacity Mask, (1), (2), to create some drop out areas.

enter image description here
Right-click/Control-Click and choose "open image in new tab/window" to see it larger.

As for what font, well, it's a serif font. Which one is kind of your choice. Sticking with a humanist serif would probably be more in tone with the sample - things like Garamond, Goudy, etc.

4/13/2017 12:46:00 PM

Here's one way to simulate a bad scan of an old document. I'm using the GIMP here, but you should be able to do all these steps in Photoshop too.

Step 1: Start with a suitable-looking picture.

Step 1 of making a fake scanned grimoire in GIMP

If you're trying to emulate an old hand-written document, remember not to be too precise. Hand-position lines, vary the font size (and/or use several fonts), rotate or stretch individual letters, maybe even apply a slight perspective transform to whole paragraphs of text to make the lines slant a little. The picture above is just a quick test.

Step 2: Make some noise.

Step 2 of making a fake scanned grimoire in GIMP: make some noise

Make a new layer and fill it with some procedural noise. Here I have a mixture of low-frequency noise (generated with the Render → Solid Noise filter) to simulate a non-flat paper surface, and high-frequency noise (generated with Noise → RGB Noise) to simulate paper grain and scratches. In hindsight, I probably should've made the low-frequency noise even lower in frequency, but this is good enough for a quick demo.

Step 3: Blend the drawing with the noise.

Step 3 of making a fake scanned grimoire in GIMP: blend drawing with noise

Here, I just set the noise layer's opacity to 50%, and flattened the entire image for the next step.

Step 4: Blur everything a little.

Step 4 of making a fake scanned grimoire in GIMP: blur everything

It might not be obvious from the final result, but this is actually the crucial step to making the scan look realistically bad. Basically, we're blurring the image to simulate the imperfect optics in the scanner. Here, I've applied Gaussian blur with a radius of 2.0 pixels, but you may want to play with the radius to fine-tune the results.

Step 5: Adjust levels.

Step 5 of making a fake scanned grimoire in GIMP: adjust levels

Just open the Levels tool, pull down the white level until the background looks mostly white, and then raise the black level until the text and lines look mostly black. (This is pretty much exactly what scanners do in text mode.) Voilá, one bad scan ready to go!

You may also want to consider applying some Unsharp Masking after the blur; combined with the Levels adjustment, this will create a distinctive effect where faint lines vanish near thicker lines. (It also undoes some of the effect of the blurring, so you may want to use a bit more blur to compensate.) I didn't do it here, because the result looked good enough without it, but it is a feature often seen e.g. in old photocopied documents.