WEBDESIGN · BACHELOR THESIS · 2016
Lettermatch
Many graphic designers spend a lot of time collecting inspirational typographic works on websites like Pinterest. One special subject of typography are monograms, which preserve exciting and inspirational typographic ideas.
Inspirational collections can be considered working tools for graphic designers. If you get stuck with your creative process, you can just jump over to your inspirational board to get your eyes on your already preselected inspiration.
If you are looking for inspiration particularly for a monogram-design, things are different. If you spot a monogram in your inspiration collection that fits the style you are looking for, it’s not unlikely that the monogram’s concept can’t be applied on the given letters of your monogram project.
The question which letters can be used for a certain monogram idea depends on the individual geometry each letter has. For example, monogram ideas with the rectangular letter E in use can be often transferred on geometrically related letters like the F, but not on the circular letter O.
In most cases, the geometric requirements of exciting monogram-inspirations are often not easy to spot. So it’s hard to tell with ease whether monogram ideas from one’s inspiration board may be useful for inspiration or not.
This challenge is aggravated by the circumstance that there isn’t just one letterform for each character of the alphabet, but dozens of different variations called letterforms. This means if you pick an alternate letterform for the letter O that is rectangular, the letter may be suddenly applicable on monogram-ideas requiring a rectangular shape.
With this insight, I imagined a monogram inspiration tool providing a search interface that finds applicable monogram-ideas once the user entered the two letters of his monogram project.
This fictitious monogram inspiration website (“Lettermatch”) was the topic of my bachelor thesis.
Personal Favorites
My interest in monogram design comes from my enthusiasm for typography and letterforms in particular. It’s joyful and inspiring to discover smart typographic solutions to combine two letters.
Alternate Letterforms
To combine two letters, one has to figure the geometric characteristics both letters are sharing. Examples: roundness (O, C, …), triangularity (V, W, …) or loops (B, P, …). These examples are based on archetype letterforms. Luckily there isn’t only one recognisable letterform for each letter of the Latin alphabet. Those variations from a letter’s traditional skeleton are called alternate letterforms.
Once I started analyzing monograms, I learned that alternate letterforms play an outstanding role in monogram design. To recognize the letter A is doesn’t need to be necessarily triangular. An alternate version, drawn roundish, of the letter A will be read as an A as well. As a result, the letter A can suddenly cope with roundish monogram-ideas. By exploring alternate letterforms, you will find more similarities between the two letters allowing you to come up with more ideas to design a monogram.
Rounded Apex A
Missing crossbar A
Slanted A
Rectangular A
letter-characteristics examples
As explained above alternate letterforms have an enormous impact on the versatility. Nevertheless, each letter has it’s very own unique features for monogram design as shown in the examples below:
BIt does require little to recognize the simple outline of the letter B.
CThe round shape of C is predestined for nesting the other letter.
LThe letter L is frequently used as a shelf for the other letter.
Monogram Analysis
Every smart monogram takes advantage of the special geometric shapes of the monogram’s letters. I designed analysis sheets to analyse monograms from my collection. I did check which letter combinations can be combined the very same way as the monogram inspiration.
The monogram that has been analysed in this monogram-analysis is shown in the top-left corner. On the first page, I analysed which geometric conditions need to be met to apply this monogram-concept on other letters or rather letter-combinations.
From the second page on I proof the assumptions I made on the first page.
What’s the analysis for?
This analysis can be applied on any inspirational monogram. After analysing a big number of monograms, the database can be used to provide a search interface that only showcases monogram-ideas that are in fact applicable on the searched monogram’s letters.
Furthermore the database does also attach fitting letterforms to the monogram-inspiration. As you can see in the slider below, all of these monograms (CO, RC, BC, RB) had been registered as possible monogram-ideas for the letter-combination K+C.
Logo: This service provided by the website reminded me of a butler, who serves only the best inspirational monograms for the user. Therefor this metaphor got used as logo (LM = Lettermatch).
Monogram-Categories
To structure the contents of my monogram-library, I had to come up with a classification system for monograms to ensure clarity for the user.
There are indeed already plenty of systems to organize logos (especially in logo-books). However, those systems are rarely dedicated only to monograms. While authors of logo design books need flexible systems applicable to all kind of logos, I was able to make a narrower ranged classification-system exclusively for monograms.
Most category-terms were adopted from great logo-books like Logo Modernism, Logo (The Reference Guide to Symbols and Logotypes) or Modern Monograms. Anyway, the most work was done by declaring precise category definitions and creating a sub-category system.
Main Categories
Monogram Subcategories
The syntax is explained with 3 examples.
categorized as: overlap-Y-diagonal
The syntax is explained through the following images.
overlap-Y-diagonal
The letters are simply overlapping. For this reason
this monogram is saved in the category “overlap”.
overlap-Y-diagonal
The letter X is shifted on the Y‑axis.
overlap-Y-diagonal
The letter-structure-element both letters are sharing is the diagonal.
categorized as: nesting-X-horizontal
(GetSafe by Metadesign)
nesting-X-horizontal
If one letter is nested in the other letter, the category-name is “nesting”.
nesting-X-horizontal
If the smaller letter doesn’t cross the outlines of the bigger letter, the attribute for the axis-shift is X not Y.
nesting-X-horizontal
The letter-structure-element both letters are sharing is the horizontal.
categorized as: interlock-Y-horizontal-vertical
(Trans Union by Unimark International)
interlock-Y-horizontal-vertical
Both letters are interlocked.
interlock-Y-horizontal-vertical
The T is shifted on the y‑axis to interlock the letter.
interlock-Y-horizontal-vertical
Both letters are sharing the same horizontal and vertical strokes at the touchpoint.
Website
Website Structure
The website is divided into three parts. My project’s goal was to achieve a tool for the monogram design-process (“Lettermatch”). To put the idea into effect, I had to collect a lot of letterforms and monograms. I realized that these collections building up the monogram-tool might also be interesting without the purpose of designing a monogram. For this reason, I also created two collection pages for alternate letterforms and monograms.
1. Lettermatch
Website-Structure of the Lettermatch-Page
The following video demonstrates what’s going on after the user has entered two letters in the search interface. The generative monogram-inspiration-page is divided into two parts:
AAlternate Letterforms for Letter 1 / Letter 2
For the monogram design process, it’s very helpful to know about a wide range of alternate letterforms. For this reason, the user gets presented a lot of alternate letterforms to discover similarities between his both letters.
BApplicable monograms for inspiration
The core of the website is the monograms-database. Every suggested monogram on this page is applicable on the user’s monogram letters. How the tool is supposed to be used is shown below.
How it’s supposed to be used
Example shown in video
2. Letterforms
Features of the page
BInformation
Get all necessary information about the alternate letterform.
CFont-Alternates
Finding different fonts that are using a certain alternate-letterform.
3. Monograms
Features of the page
ADiscovering
The filter-menu for the monogram-categories allows you to discover the differences between the categories.
BResearch
Find monograms matching your letters or search for a single letter to discover the letter’s unique features.
CParticipation
Users can add new monograms to the collection. If they fulfill the quality criteria, they will be added.