Typography - Task 3:Type Design and Communication

23/5/2023 - 6/6/2023/ WEEK 8-WEEK 10
DAVIES ANNIKA ANGELA /0362108
TYPOGRAPHY/BACHELORS OF DESIGN(HONOURS) IN CREATIVE MEDIA

LECTURES

can be found in Task 1

Week 8:we were given a briefing on the task at hand advised to watch the deconstruction video

Notes I got from video

Do research on different type faces which are good
look for reference to other fonts that are similar
understand how contrasting letters can be made
Deconstruct the similar type face
Curved areas of letters tend to overshoot x height

INSTRUCTIONS

Task- design a typeface for the letters and punctuations "a e t k g r i y m p n ! #"

a good typeface consists of

subtlety or character
presence
legibility
readability

We will then display the font on an A4 paper as a simple poster design.

TASK 3: TYPE DESIGN AND COMMUNICATION

We were assigned to find 5 different objects we can use to write which have different thickness to explore different fonts we might want to create.

The 5 tools I picked were

Highlighter
Black sharpie 770sp fine point
0.5mm gel pen
0.5 fine tip pen
2.3point marker

Irregular object not typically used for writing - lip gloss applicator

For each tool we were told to make different strokes (vertical, horizontal diagonal and circles)

then write the letters AOTMX in 5 different ways then pick the one we like most and write the letters

"a e t k g r i y m p n ! #"

We can either have them in lower case or uppercase .I picked uppercase

Fig 1.1experimenting with 5 tools in class week 8 (23/5/2023)

This was quite a fun and interesting exercise as we got to use our hands. My two favourite strokes came from using the sharpue and lip gloss brush though it was difficult controlling how much ink to use I felt like I was in the middle ages using a quill pen and I got to admire and gain an appreciation of how people from back then were able to write with such and produce good hand writing.

Fig 1.2 failed attempt at how much ink to use week 8 (23/5/2023)

After experimenting with this tools I decided to swap the 2B pencil for a highlighter as it would produce a thicker stroke that would be easier to convert into a font

fig 1.3 5tools I will be experimenting with including ink 26/5/2023 week 8

In the picture above it shows

-a lip gloss brush

- a highlighter

-a 0.5 water water based pen

- a 2.3 m/m metallic metallic ink marker

- a 770sp sharpie

fig 1.4 a close up of the points of each tool 26/5/2023 (week 8)

2.3 m/m metallic metallic ink marker

fig 1.5 strokes (left) 5 different ways to write "AOTMX" and my favourite from the 5 selected 27/5/2023 week 8

With this marker i realised adding more pressure as I write produces thicker strokes. In my experimentation here I looked for inspiration of fonts from https://www.dafont.com which is a free website to download fonts I looked at some of the square fonts and gothic fonts and changed them abit to suit what I want

I ended up choosing the first font because of its legibility and how the round strokes work well with the straight strokes . I enjoyed how smooth the pen was writing as compared to the highlighter

I realised that as I put more pressure when writing I began to produce more consistent circles and strokes

I decided to write the letters "a e t k g r i y m p n" 3 times to practice and perfect each letter

Highlighter

fig 1.6 strokes (left) 5 different ways to write "AOTMX" and my favourite from the 5 selected 27/5/2023 week 8

For the highlighter I found it difficult to create contrast between thick and thin strokes even though i held the highlighter at the same angle like Mr. Vinod advised when trying to come up with one way to write the letters "AOTMX" I got more inspiration from https://www.dafont.com . I liked the curly letter from the some of the fonts in the curly section of fonts so I tried that as displayed above. I also liked the groovy kind of font types and tried to create my own version. I also tried a Serif style and I likes that one the most because of the serif I made, I also liked the contrast between the thick and thin strokes that were shown.

It was difficult making the circles consistent.

Irregular tool - Lip gloss brush

fig 1.7 strokes (left) 5 different ways to write "AOTMX" and my favourite from the 5 selected 27/5/2023 week 8

I found it difficult to produce consistent circles and strokes as I was still figuring out how I can hold it in a stable manner

Using this tool was quite difficult as I had to make sure I never put too much ink on the tip and I had to figure out which way would be best for me to hold the tool. I got more inspiration from https://www.dafont.com and saw some fonts made by brush strokes as well as stencil fonts.

I found holding the tool at different angles produces strokes of different thickness . I observed that when I do not dip the tip in ink for a while an interesting brush stroke is created as shown in the third row of "a e t k g r i y m p n"

fig 1.8 different ways I tried holding the lip gloss brush 27/5/2023 week 8

I found that holding it in the 3rd way was the most stable way and produced more consistent strokes

0.5 water water based pen

fig 1.9 strokes (left) 5 different ways to write "AOTMX" and my favourite from the 5 selected 27/5/2023 week 8

I found for this tool the strokes were always the same width no matter the angle at which the pen is held . I tried a serif type font with this tool I found it to look interesting. I did not like how thin the strokes were. I ultimately decided to select the 3rd "AOTMX" I liked the childish look it had.

fig 2.0 strokes (left) 5 different ways to write "AOTMX" and my favourite from the 5 selected 27/5/2023 week 8

This was my favourite tool to use for experimenting as had stability when I was writing with it though the ink did come out rather fast which produced a small knob at the beginning and end of each stroke I made. My favourite way to write was the third one .It reminds me of futura medium condensed but with an awkward twist. It also has legibility, character and presence.

After experimenting with these 5 tools I compiled them on to one graph paper to pick which one I liked best.

compilation of 5 different handwritings

fig 2.1 Compilation of 5 different handwritings by each tool.27/5/2023 week 8

I decided to go with the handwriting with the sharpie because of its character and simplicity.

fig 2.2 practice with selected handwriting 30/5/2023 week 9

We were advised to practice writing with our chosen font that we will then turn into a font in font lab.

We were told to take pictures of the letters that we liked the most from our practice

fig 2.3 selected letters from practice sheet

DECONSTRUCTION OF LETTERFORMS

Fig 2.4 Deconstructed letter "r"

I was advised to deconstruct 3 Letters of a typeface that resembles the font I want to create.

Fig 2.5 Guidelines

As we design our fonts the following needs to be used

ascender height
cap height
median
x height
baseline
descender height

Adobe illustrator art board size

height - 1000pt

width-1000pt

x height should be 500pt

DECONSTRUCTION OF LETTERFORMS

In this process I was looking for the minuscule details that give the font its character and further help me as I design my own font.

Fig 2.6 Deconstructions of letter "T" Futura std medium condensed 2/6/2023

This deconstruction process enlightened me on how not everything is as it seems because in the beginning I thought the stroke width would be the same for the stem and the arms of "T" then I discovered that the stem is in fact thicker than the arms. I also noticed that the armas are not the same length and the left terminal is longer than the right terminal as shown in Fig

fig 2.7 Deconstructed letter "G" Futura std medium condensed 2/6/2023

It was interesting to see the different curves and the difference in size at each curve point as well as how the width of the stroke differs like how the arm has a thinner width than the stem.

Fig 2.8 Deconstructions of letter "E" Futura std medium condensed 2/6/2023

I noticed the stem has a thicker stroke than the arms of the "E" . The arms have the same thickness of stroke thought the middle arm is shorter than the arms above and below.

After my deconstruction process I began digitalising the font in Adobe Illustrator

fig 2.9 shows guidelines and the beginning of digitalising letterforms 6/6/2023

When I was constructing my letterforms I used the pen tool and made the point size 60pt.

fig 3.0 first attempt modifying letter forms 6/6/2023

I thought adding the little knobs would be an interesting feature to add to the letter forms so I used the curved pen tool to modify the letters to add the knob.

fig 3.1 finished letterforms in comparison to handwriting letterforms 7/6/2023

fig 3.2 experimenting with letterforms 7/6/2023

I liked how refined the letterforms looked in illustrator though I did not really like the rounded nature of them. Mr. Vinod advised that I do not add roundness as well as the Letterform already had enough character.

I tried experimenting with then letter forms in fig by adding little indentations at vertexes but Mr Vinod said that would be adding too much character.

fig 3.3 development of "A" as well as outline of development 7/6/2023

STEPS TO CREATING LETTER "A"

I used pen tool to draw over the reference image of my handwriting
Extended the bottom of the "A"
I expanded the object which outlined the stroke
I then used shape builder to unite the stroke
I then used the eraser tool to remove the extended bits

I repeated this process with the other letterforms as well.

fig 3.4 development of "E" as well as outline of development 7/6/2023

For the "E" I made the stem slightly thicker than the arms because in my deconstruction of the "E" in futura medium condensed it was thick as well as making the arm in the middle slightly shorted that the arms above and below it.

I also decided to make the middle arm align with the cross bar of the "A"

CONSTRUCTION OF LETTER G

I realised I forgot to do the G of the letterforms, so I started develpoing it.x

fig 3.5 finished letterforms including the "G" 14/6/2023

I tried using the pen tool to make it and it did not come out looking right.

Making the G was quite difficult but Mr Vinod advised me to use an ellipse first the work from there, so I did that but also used the "P" as well so that the curves of the "P" "R" and "G" match.

fig 3.6 short video of me using shape builder tool to construct G 16/6/2023 Week 9

fig 3.7 using P and ellipse to construct "G" 16/6/2023

fig 3.8 different stages of development of "G"16/6/2023

STEPS TO CREATING LETTER "G"

Creating ellipse
using P and shape builder tool
rounding up sharp points on the curve

I made sure to overshoot the cap line and baseline when constructing the "G"

Refining letterforms

fig 3.9 initial letterforms 16/6/2023 week 9

fig 4.0 refined letterforms 16/6/2023 week 9

Mr. Vinod advised that I make the Apex of the "M" be at the same level at letters P,Y and R so I added a guide and did that. I think this helped create more consistency.

fig 4.1initial M (left) final M( right) 18/6/2023

Mr Vinod also said I created the Y wrong so I fixed that as well.

fig 4.2 initial "Y" (left) refined "Y" (right) 18/6/2023

I also modified the N, M and A so that the points are not too sharp

fig 4.3 Initial "N" (left) final "N" (right) 18/6/2023

CONSTRUCTION OF PUNTCTION MARKS

I used the pen tool and shape builder tool for the construction of the punction marks

PERIOD

From the Instagram post notes I observed that the period should be slightly bigger than the width of the stroke of the font so I made the width 65pt which is 5pts bigger that the width of the stroke.

COMMA

the Comma is basically two periods

fig 4.4 construction of comma 18/6/2023

I went for a squarish comma because I felt it would compliment the font as it is a square like font.

The shape at the bottom of the comma does not have parallel vertical lines, the first line is slightly more slanted than the other line

EXCLAMATION MARK

For the exclamation mark I used the period and made the stroke 65pt and modified it so that it does not look like a rectangle.

fig 4.5exclamation mark beside the comma. 18/6/2023

HASH TAG

fig 4.6 construction of hashtag 18/6/2023

I made the diagonal parts the same as the diagonal strokes on the letter K because I felt it would bring harmony.

MECHANICAL PROPORTIONALITY & OPTICAL PROPORTIONALITY

mechanical proportionality - width much match
optical proportionality - width should match optically

fig 4.7 boxes used for mechanical proportionality 19/6/2023

Box width - 275pt

For the letters "A,E,T,R,P,N,K" , I applied mechanical proportionality

For the letters "Y,M,G" , I applied mechanical proportionality and made them slightly bigger in width as when I tried to make them fit in the box they looked thinner than the other letters.

fig 4.8 Chaos during the digilisation process 20/6/2023

FINAL LETTERFRORMS

fig 4.9 final letterforms in comparison to handwriting 22/6/2023

FINAL JPEG

Fig 5.0 final letterforms 22/6/2023

fig 5.1 final letterforms pdf 22/6/2023

TRANSFERING LETTERFORMS TO FONT LAB

fig 5.2 letters in font lab 22/6/2023

KERNING OF LETTER IN METRICS TAB

I typed out my font and began the process of kerning the letters.

fig 5.3 first time I typed out my font 22/6/2023

I was quite excited when I first typed it out.

fig 5.4 before kerning (left) after kerning (right) 22/6/2023

I came up with my first sentence " Man I type great" then kerned this sentenced according by making some of the letters come closer together.

fig 5.5 second sentence kerned 22/6/2023

I then came up with two words and did appropriate kerning. At this point I felt like coming up with sentences would not be an effective way of checking if all letters were appropriately kerned with one another so I started doing it letter by letter where I pick one letter then write every other letter next to it one by one including the chosen letter.

fig 5.6 kerning different pairs of letters 22/6/2023

COUNTERFORM

I wanted to try and see what my counterform font would look like

fig 5.7 counter form of my font 24/6/2023

POSTER

I was then told to showcase my font in the form of a poster

I came up with 4 poster ideas and the sentence I came up with was " MAKE IT RAIN, GAIN TYPE PAIN!"

fig 5.8 poster design ideas 22/6/2023

I placed a paper texture behind to make it more interesting.

For poster #1 I was advised that I can do better and the layout is not that good

For poster #2 I liked the stacking effect

For poster #3 I thought of making it dynamic by having some words horizontal and "RAIN" vertical but I do not quite like the design

For poster #4 Mr. Vinod gave me the idea to make the letters look like rain which I feel like is actually incorporating the Type expression task from task 1 and task 2

fig 5.9 FINAL POSTER DESIGN JPEG 22/6/2023

fig 6.0 FINAL POSTER PDF 22/6/2023

FONT DOWNLOAD LINK

https://drive.google.com/file/d/1Me6FkhyjUPFTjauJ6wFmzfvhB0LdmsvZ/view?usp=sharing

fig 6.1 font download file

MY OPINION ON MY FONT

This font is modern and sleek but also has a bit of awkwardness to it. It is space saving and more text can fit limited space such as columns or tight layouts. Despite it being quite condensed it still maintains legibility due to its clear letterforms. I believe it is a a versatile font as it can be used for display purposes like titles, headlines, and logos as for as bodies of text. It can also be used in branding and advertising given its modern and stylish appearance though it looks a bit awkward it can convey a sense of sophistication and professionalism. It can also pair well with other typefaces both serif and sans-serif. This font can also be used for editorial design due to its condensed nature and readability.

FEEDBACK

week 9:

general feedback :make sure there is not too much character in the letterforms

Week 10:

general feedback: make sure the horizontal strokes and vertical strokes are consistent

utilize your week between each lesson to do work to understand it more and produce better work and not do it the night before

specific feedback: make sure p and r look similar the counter space

Week 11:

general feedback: when making the G first start out with constructing letter O

make sure each line ends at the baseline

make sure there is consistency

mechanical proportionality - width much match

optical proportionality - width should match optically

specific feedback: "G" needs more work

make the "N" points abit blunt

Vertex of M needs to be a little lower

Week 12 :

general feedback: make sure appropriate kerning

typeface needs to be same point size

be creative and create dynamic and impactful poster

create tension with negative space

point size should be same

Use the art of looking sideways

specific feedback: The first poster design was horrible. The second design was much better and he liked the stacking layout

REFLECTION

Experience: I found this task to be fun and somewhat challenging. I enjoyed the writing aspect as I got to use my hands and have more control as compared to when I am working on Adobe illustrator. I found the digitalising process to be easier than I thought it would be. I found the evolution of my font to be quite interesting as my font evolved more than I thought it would. Font lab gave me some issues when it came to importing the R but a friend helped me figure it out. I felt discouraged at some points because I kept having to refine my letterforms but this ultimately made me produce a font I am proud of.

Observation: Asking for feedback and help and doing research before hand will always make my work easier and help me produce quality work. I observed that it is important to look at other students work and compare it to my own and also have good relationships with my peers as they helped me with technical struggles I went through

findings : Being a perfectionist is beneficial when it comes to tasks like this as the quality of work produces will be of good standard. There are also so many free resources that can help the process easier such as dafont.com and google font. Being disciplined is important as the work becomes less when I follow instructions and do my work on time.