Create your own glitch typeface

Making Dataface was really quite an exciting journey. What started off as an attempt to make a typeface inspired by glitch art turned out to be a story of collaboration, exploration and hours of research. Here, I will go through my process.

As you may have seen from my previous experiments in vector databending it’s totally possible to manipulate vector files. My original method for creating Dataface was to save each glyph in the Liberation font to an SVG file and then go through the process of glitching it for each file. Obviously this would’ve taken me a long time, hence why there was very little activity between my original announcement in January and when I started work on it again a few weeks ago.

At this time I thought about writing a script to do this for me. sed is a great command-line utility for Linux that essentially does the same as using find/replace on a character. As it’s command-line it means I can do a lot of automation with it. So, I wrote this simple script that attempted to solve the problem

#!/bin/bash
rand=$(($RANDOM % 9))
sed -i s/[0-9]/$rand/g fontfile.svg

The only problem was that it would replace all numbers in the file with whatever random value was chosen by $rand as the script was executed. Not only is this bad because it would result in a lot of strangely similar glyphs but also because it would modify the header data of the font file, thus rendering it unreadable. I soon remembered that recently the SVG Font specification was finished, which aided my cause by putting all of the glyphs in one big file, but I still couldn’t find a way to efficiently randomise values in the file.

Thankfully fizzPOP came to my rescue. I’m glad that hackerspaces have people with a range of abilities in hardware and software, as I was soon presented with a solution to my problem by GB. After a few revisions he created a script that would replace only specific values in the file and wold even let you specify how much it should be randomised. You can download the finished script and source files and have a go for yourself.

Click to download

Simplified instructions on compiling the script:

• Unzip the file in a clean folder. This will give you three files:Font_Sample_-_Liberation_Sans.svg, glitch.l and makefile
• Type “make” into the command line (without the quote)
• If you haven’t got make, type:

  flex -t glitch.l >glitch.c

  gcc -o glitch glitch.c

in either case, you will get a program called “glitch”.

Please note this has only been tested on Linux, requires Flex (available in the Ubuntu repository) and it is designed to work on SVG font files. I only know FontForge that is able to create these fonts files. To run the script do the following

./glitch 0.50 outputfile.svg

That tells the script to glitch the file by 50%. I have noticed that sometimes you get errors if you put in 1.00 or more.

Once you have generated the file you can import it back into FontForge to save as a .ttf, .otf or whatever font type you choose!

(I still hate Comic Sans)

Here’s everyone’s favourite Comic Sans glitched at 50%