Physical Studio with John Kelly 5: Type Transcription

Typographic Transcription Part 1

The fifth and final physical studio workshop with John Kelly will extend over the course of a couple of weeks leading up to the final month of the first year. The subject of study for the duration of these studios will be typography and type transcription. Due to typography not being my strong suit when it comes to design I was eager to get started with this studio.

To begin with the class were provided with a selection of studies from varied artists and designers as a form of inspiration to create letter forms out of five selected letters, the selected letters were 'ANSEG'. The studies I chose as my inspiration consisted of bold disorderly artwork, each sharing a similar colour palette of black with a red contrast. Out of all the studies I found these to be the most appealing. The artists of the studies were, Wolfgang Weinhart, El Lissitzky and Lauri Rosenwald, below are scans of the studies I chose as inspiration. 

With John's studio sessions we would regularly mount our work on the wall to showcase and evaluate to the whole class. Due to the first session being studies I wanted to take a different approach to prevent having similar work to other students. To accomplish this I extracted different aspects from each of the artwork to create my own type faces for 'ANSEG'. Specifically I extracted the bold stroke of the type from Wolfgang's work and combined it with the contrast of coloured shapes intersecting the type from El and Lauri's work. For the creation of these fonts I used graph paper, allowing me to keep consistent measurements throughout. 

The first of the two fonts created consisted of a bold, block typeface with the measurements of 3cm wide and 4cm high on paper. Additionally using an orange pen I added streaks and lines that intersected the type to add a 3 dimensional effect alongside a splash of contrasting colour.

The second of the two fonts created was slightly more complex, whilst sticking to the inspiration of bold black type I took a different approach of intersecting colour by deconstructing the letter it self. While keeping the centre of the letter untouched, I used a ruler to create two diagonal lines as my segmented points, the outer parts of the letter were then shifted slightly to create a sliced up look. The letters were then coloured a bright yellow to give it a hazard stripe theme.

Below is a scan of the resulting typefaces created during this studio session. The resulting fonts got positive feedback at the end of the session and I would like to develop either of the two fonts further and possibly create an entire alphabet out of the typeface.

As an additional note towards the scan of the above typeface, the scanner used had what looks to be ink on the glass causing there to be black marks on the scan. Although the marks are apparent, the work is still legible and therefore I chose not to worry about the scan. Tutors will be notified about the scanner however.   

Type Transcription Part 2

The next session of the type transcription studio with John Kelly consisted of development, by creating three full alphabets using the studies we obtained from the provided artists in the previous session. With only creating two typefaces in the 'ANSEG' session, I spent a small amount of time during the session creating an extra study sheet from the artwork from the ANSEG session, below is a scan of this study sheet.

Additionally using the same sheet I attempted to create a font idea that was inspired from a book I was reading about Japanese graphic design (Top Row). The font's dimensions were 5cm x 5cm on paper and designed to be all lower case, the style was bold and sharp giving a futuristic appearance. Although I found this font to be appealing, it became apparent that it wasn't possible to create an entire alphabet with this font. Letters such as I, K and X didn't look part of the typeface when created. However, due to majority of the alphabet being legible for this font style, it could be a possible idea to create this font with what letters I can for the purpose of titling.

Below this font was a second attempt at creating a futuristic style that could consistently work for each letter of the alphabet, using black lines to separate each letter to create a segmented appearance. The font unfortunately began looking a bit too straight edged and blocky, although this idea would have consistently made a full alphabet, It personally didn't find it to be an appealing font design.

Out of the two font design ideas created during this session I prefer the first one, although I am unable to create a full alphabet with this font idea, the futuristic appearance is appealing. I am considering digitising this idea, the design is simple and would create a nice title font with legible letters with this font. 

Font Development

Font Design from Session Development

With a couple of rough ideas from the second session of the type transcription studio, I decided to develop one of the typeface ideas that I created during the session. In my previous type transcription post, I discussed about the font having a futuristic and bold appearance, however it became apparent that I was unable to create an entire alphabet with the font due to how it was laid out. The font was intentionally made for lowercase only, due to the design of the font rounded letters such as 'a' 'o' and 'e' worked perfectly fine, whilst letters such as 'k' and 'm' had difficultly looking part of the typeface when designed.

Above is a scan of the font I wish to develop, I will be having a go a designing this font on Adobe Illustrator. With the assistance of guides and digital manipulation and tools I firmly believe that I can create an entire consistent alphabet that can be used as a viable font.
This blog post will be step by step development of the creation of this typeface. With the usage of screenshots i'll be documenting the various tools, developments and progression throughout it's design.

  
To begin with I created a simple grid consisting of 26: 5cm x 5cm squares, the grid will be my guide for each letter to keep consistent dimensions throughout. 

With the size of the font being 5cm x 5cm, the dimensions of the font are unusual, consisting of sizes such as 1.5cm, 0.5cm and 2cm. To assist in the creation of otherwise confusing dimensions, the above box contains varied quadrilateral shapes that were used as guides to help create evenly designed letters. The dimensions of the blue boxes are 1.5cm x 1.5cm and these were used to create the primary width of each letter, whilst the red boxes varied in size, mainly 0.5cm x 2cm, these were used help create diagonals and gaps within the font. below is an example of these guides in use to create the letter A.

Due to already having the first 7 letters created (A-G) the first row of the font was created without too much difficulty. Thanks to the red and blue guides, the creation of these 7 letters was quick and simple. Additionally a unique quality with this font is that certain letters have reusability, because the font is lower case, letters such as the 'A' could be rotated or flipped to create 'E' and 'G' as well as 'B' could be rotated and flipped to create 'D', 'P' and 'Q'. This saved a lot of time when creating the font.

The font also featured rounded edges on certain corners of each letter, using Illustrator's direct selection tool, selected corners were rounded to 3mm. I believe that the addition of rounded edges helped prevent the font looking too blocky and square. 

Below is a further developed screenshot of the font, as you can see a lot more letters have been completed with varied development. Each letter varied in difficulty for this font and currently the letters that remain are 'H', 'I', 'K' and 'Y', Although the letter 'I' is a rather simple letter to complete I have concerns that due to it's width in comparison to the rest of the alphabet, each other letter created spans across at least 3 corners of the guide box therefor with the letter 'I', there will be an unwanted gap at either side of the letter. (you can get a basic idea of how the letter 'I' will look with the blue and red guide lines.)

Coming up with a way to have the 'I' touch at least 3 corners of the guide box, along side having the letter look like it's part of the type face without it being an uppercase letter has proven to be difficult. Its current design has been the most viable idea that is legible and looks part of the typeface.
   

As stated before, certain letters have been reused to create others, the 'C' was rotated to create both the 'N' and 'U' which was then further developed by the addition of a central rectangular shape in order to create the 'M' and 'W'. 

The letter 'V' was an interesting letter to create, using the 'U' as a base shape i wasn't sure how i would approach the letter having an angle that looked like it was part of the font. In the outcome I designed it with half of the letter straight whilst the other half angled, this worked a charm and made the letter look alike the rest of the alphabet. 

The letter 'S' and 'Z' were initially the same letter only one was reflected to make the other, the former being the original, these letters however looked like the number 2 and 5 which sparked a possible idea of creating the numbers 1-9. With the 'S' I believe that the letter looked ok but the letter 'Z' seemed off, this was then later changed by adding a angled rectangle which turned out rather well making the 'Z' look more like a 'Z'. In the screen shot above, you can see the newly designed 'Z' with the original design below it.

One of the most complex designed letters currently was the letter 'X'. Just like the letter 'V' i didn't want to have the 'X' be completely angled due to it not looking like it was part of the font. To combat this however, I created an upper case 'I' that was angled and curved to make it look less blocky, in my opinion the outcome was rather successful. bellow are screenshots of the letter 'X' with and without the guides

In the outcome of the creation of this font I decided that the letters 'H', 'I', 'K', 'Y' don't work with this design, although i was unable to create a complete alphabet in this style, I am still proud of what I have created so far. The Letters that i was able to create look futuristic, sleek and i would love to incorporate them into my work at some point, be it university work or work out of study. The letter 'I' that I created but have concerns about will still be kept because I do like it's design and I would prefer to have all vowels done at the very least. below is a screen shot of the current design for the font.

For a name of this font I would like to give it something that is relevant to it's futuristic style and design. The name I came up with is 'Overdrive' which is in fact the name of the font created in the helvetica deconstruction seminar. With the black stroke removed an a simple gradient added, this font actually looks pretty good. If I were to use this font in work this would preferably used as a title font instead of a body of text font. 

Font Inspiration and further development

In my previous blog post about the type transcription session with John Kelly, I discussed the development of one of my font designs named 'Overdrive'. Overdrive is a futuristic font design that is designed as a lower case font that would be used as a title font. Unfortunately this font is an incomplete alphabet due being unable to design certain characters such as 'K' and 'H'. Although the font is incomplete, I still like the characters that I was able to design, and I have decided to keep the font for futuristic titling purposes. 

This is an example of 'Overdrive'.

With this font designed but incomplete I would like to try and create a font that has all 26 characters consistently designed. This blog post will be exploring some possible ideas and inspirations for a new font design for this Process and Production task.

Glitch design

Glitch design has been a favourite for a while, it has a strong relation to the subculture and design aspect of cyberpunk. The whole creating art from imperfection is something I find appealing. When it comes to designing a font with a glitch style, it's actually a rather common and simple process to do, with the use of Adobe Photoshop and at times Illustrator the design can be created rather quickly. Below is an example of a simple glitch font.

The font is a distorted sans serif, with the addition of red and blue creates a 3D effect that also adds a blurry look to it, I will be attempting to create a full alphabet in this style. when looking at inspiration and other designs for glitch font, you get a variety of how the characters are distorted. some are only distorted a small amount like the style above, whilst there are some that experiment with a wavy effect resembling old television sets. For my design of this I was thinking of taking the design approach of the example image above. the programme that I will be using to create this is Adobe Illustrator.

The above image is the glitch font that I have been working on inspired by the example from before. As you can see I have created the whole alphabet and applied 2 duplicates of each letter that has been moved slightly to either side of each character, left side being a hot pink/red and right being a sky blue, this has simple method has given the font the blurry effect that helps give the glitch font a distorted appearance. The font I have used is called [Insert font name] and was downloaded from Dafont. The next part will be deconstructing the characters down.

With the use of the knife tool i sliced each character in half at different heights to prevent it from looking evenly sliced throughout. Certain cuts are even are slightly angled to add more variety to it. This effect makes the font look even more distorted yet still legible. the next step will be to add a small pixel effect to each character using small squares, this will probably be the most time consuming part of the font's creation. 

Here is the first completed character for the glitch effect, The character is still legible which is of course a letter 'A' and this effect will be applied to the remaining characters. Adding white squares cutting into the character added even more of a deconstructed appearance and I like how this turned out.

Above is a screen shot of the first 10 characters completed for this font. I have decided to make this my final font for the type transcription section of Physical studio with John Kelly. Out of the two fonts created (glitch and overdrive) I much prefer the glitch font, it was a less complex font to create and it covers the entire alphabet. In the near future I would like to add numbers and punctuation to this style to make it complete.  

Finalisation

The outcome of this section of the Process and Production physical studio with John Kelly provided me with two fonts, Glitch and Overdrive. Both fonts have a futuristic, Sci-fi and cyberpunk theming, Overdrive was a more sleek, complex font that was designed entirely as lowercase, It features a squared guideline with rounded corners and sharp angles this font required the creation of a scaffolding of such to ensure dimensions were consistent. Unfortunately as stated in a previous development blog post, due to the design of overdrive it was extremely difficult if not impossible to create certain letters within the shared guidelines. creating letters such as 'I' 'H' and 'K' did not look part of the font in comparison to the other characters. Overdrive would be used as a title font due to it's design, Below is a screenshot of the Font Overdrive.

The more recently created font 'Glitch' is a deconstructed, distorted typeface in comparison to Overdrive. Using a font chosen from Dafont It is given a three dimensional effect, sliced and distorted horizontally with addition of pixelation which was manually created on Adobe Illustrator. I personally prefer Glitch to Overdrive because not only do I find the design of glitch to be more appealing but within the first year of this university course, majority of my work has focused upon a glitch aesthetic and data corruption, being to create my own font to add to my existing glitch design work has been a great addition. However due to time constraints the entire font has not been completed only the first 10 characters have the pixelation effect added. The font contains every letter of the alphabet and as stated in the previous blog post, I would like to complete the pixelation effect to the entire alphabet as well as create additional characters such as numbers and punctuation to the typeface to complete it. Below is the current lineup for Glitch.

For my self negotiated project about cyberpunk I will be incorporating a completed version of this font to be used a featured typeface. The font primarily will be used to create glitch related slogans such as 'Bitches love Glitches' along side as a possible font in the design aspect of the editorial i will be creating for the project.