Blackletter Logo

ryanfiller

ryanfiller

Posted on April 13, 2023

Blackletter Logo

When I started my website from scratch in 2020, I always intended to create a new logo as one of the first things I would work on. However, other tasks took priority, and now more than three years later, I still only have my name typed out in a font at the top of the site serving as a makeshift logo. This has made it difficult to make big design decisions elsewhere on the site, as I was afraid I would put a lot of work into a design element, only to have it clash with whatever I eventually settled on for a logo. This time around, I made sure to do things in a different order when starting over.

To check out the finished logo, feel free to jump straight to the end.

What is Blackletter

Unicode Character U+211C

"Blackletter," according to Wikipedia, "is a script used throughout Western Europe from approximately 1150 until the 17th century." Despite its wide usage during the European Middle Ages, the style eventually fell out of favor due to the rising popularity of less ornate and more readable styles, in addition to having a complicated relationship to one of the 20th century's worst events.

The style of this lettering is characterized by tall and narrow letters formed by straight, angular lines that often end in sharp final shapes that "bite," or overlap, other letters. Due to its prominent historical usage in the European Middle Ages it still lives on as a sort of shorthand for the "medieval period" for works set in the time period, especially the fantasy fiction genre.

Inspiration

inspiration board of things that made me think of 'blackletter' - The Addams Family, Treasure Island, Bugs Bunny in Knighty Knight Bugs, The Legend of Zelda, Final Fantasy, Lord of the Rings, Doctor Doom, Merlin, Quest 64, The Sword in the Stone, Gargoyles, Dragonheart, Dungeons & Dragons, Lego Castles, Hook, Shining Force II, The Hobbit, Night on Bald Mountain, Castlevania, The Chronicles of Narnia, The Three Musketeers, Castlevania III, Gauntlet, Pirates of Dark Water, Robin Hood, Warcraft II

I began the project by researching everything I personally associated with this style of font. Surprising to me, many of the things I thought of as using "blackletter" actually use a different type of lettering like antiqua, a rotunda or minuscule style, or even a more generic Roman style font. I found this interesting because I guess I wasn't aiming to reference any specific historic period precisely, rather I wanted to capture the general "vibe" these projects had.

Rough Sketch

I actually had this initial idea a while back and jumped directly into Adobe Illustrator to rough it out. According to the file created time, I started experimenting with this logo in April 2021.

original logo sketch from 2021

I took a lot of inspiration from the Textura form because I thought its inherent geometry fit the best with my personal design style. I also really wanted to avoid the WWII connotations I mentioned above so I did my best to stay away from directly referencing the Fraktur style. The logo is made up only of straight lines, with each letter constructed using a combination of a square diamond shape and a vertical rectangle.

Refining

I lost interest in this logo for a while, but then something happened earlier last year that really got me back into the "medieval fantasy aesthetic" mindset.

screenshot of my Elden Ring game menu showing my level 247 knight character with 251 hours of playtime

After months of adventuring around The Lands Between, battling all sorts of knights, wizards, and monsters, I felt compelled to find a way to make this logo work.

Letter Stems

outlined version of letter r, after on the left and the right. the after version is shorter and thinner

One of the first changes I made was to slim down all of the vertical letter stems. In the original sketch each stem had the same width as one of the diamonds rotated 45°, but for the updated version I reduced the width to only half of the width of one of the serif finals. This added some visual contrast to the logo and made it more realistic in terms of what a calligraphy pen could produce.

X-Height

a monogram version of the logo showing only the letters 'rf', a square is drawn around them
a new version of the 'rf' monogram overlaid on the old version showing that the new version is shorter

From the start, I had envisioned a version of the logo that could work as a monogram with only my initials. While working on the lockup, I realized that it would work best if it fit inside a square so it could be used for various favicon images that my site would eventually need.

This ultimately ended up deciding the final height of the letters so that the ascender and descender of the "f" would line up with the imagined outline, as would the bottom bottom terminal of the "r". To fit into the square the overall x-height and body height of the letters was reduced a decent amount from the original sketch.

[[clearfix]]

logo with vertical dotted lines overlaid to show that each letter has a consistent stem width

letter with horizontal dotted liens overlaid to show that each letter has a consistent baseline, x-height, and body height

With the x-height, body height, stem width, and terminal size were established, I reworked the rest of the letters for consistency with the updated "r" and "f."

Grid Layout

outline of full logo overlaid on a grid system showing uniform alignment for all the shapes

I had two main goals while creating each individual letter form: to use the minimum number of shapes necessary, and to strictly adhered to a 6x6 grid system created from the size of the base diamond shape.

I also decided to combine the "f" and "i" characters into an "fi" ligature was both for consistency in the letter spacing of my last name and also just because I am a fan of ligatured letters in general.

logo with diagonal dotted lines overlaid showing the consistent angled gaps between the r and y, f and i, and e bowl

When I was in design school I remember a professor telling me -

Once An Accident, Twice A Coincidence, Three Times A Pattern

I looked this quote up and expected it to have been said by a famous designer, but apparently this is actually an Ian Flemming quote from the James Bond novel Goldfinger. Regardless of who coined the phrase, I made sure to repeat the small, diagonal spacing at least three times — once between the "r" and "y", once in the "fi" ligature, and once in the open counter of the "e".

logo with diagonal dotted lines overlaid showing alignment between different letter ascenders, descenders, and terminals

With that spacing nailed down I designed the remaining letters to create as much diagonal alignment among their ascenders, descenders, and terminals as possible. Because of the previous constraints around x-height and overall letter height not every element could align perfectly.

The Finished Logo

Progress on the New Site

screenshot of beta.ryanfiller.com that corresponds with the additions from this blog post

Follow along with my redesign at beta.ryanfiller.com (which may or may not currently match what is shown at the time of publishing this blog post.)

💖 💪 🙅 🚩
ryanfiller
ryanfiller

Posted on April 13, 2023

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Blackletter Logo
design Blackletter Logo

April 13, 2023