Typography | Task 3 Typographic Design and Communication

This week we received final comments from Mr. Vinod on our assignment and moved on to the third part, sketching on graph paper. We were also given guidance on the second assignment, and we started experimenting with different writing styles and getting used to using different types of pens.

Week 8

Independent Study Week, there are no lectures in this week.

Week 9

This week, Mr. Vinod gave us feedback on our digitization and highlighted areas for improvement. He showed how to simplify removing anchor points using the smooth tool, though it may alter the letter's shape.

Week 10

In class, Mr. Vinod provided hands-on guidance, helping us fix and refine our digital type designs to ensure they were more precise and polished.This week, Mr. Vinod gave us valuable feedback on our digitized typefaces and highlighted specific areas that need improvement. We also received helpful video tutorials on how to work with FontLab.

Week 11

This week Mr. Vinod continued to work with us on improving our digitized fonts. In class, we received help in correcting the fonts After that, he suggested that we move our designs from Illustrator to FontLab for further refinement. We also watched tutorial videos that helped us better understand the program's features.

Week 12

INSTRUCTIONS

TASK

3.1 Dissection of Letters

We need to choose a font from the 10 previously submitted and perform detailed lettering . For this assignment, I chose the Bembo Std Regular font from the choices provided. In this analysis, I focused on detailed analysis of the shapes of four letters: H, o, g , b.

During the parsing process, I paid attention to various elements such as the ratio of height to width, the nature of the serifs, and how smoothly straight lines transition into rounded shapes.

Figure 3.1 Dissection of the letter H

Letter “H.”

The serifs have different thicknesses and their weight is not evenly distributed. The thickness of the horizontal strokes is less than the vertical ones.
The ends of the serifs are in the form of rounded arcs, which harmonize with the geometric grid.
The central bar is not in the absolute middle of the letter, but slightly higher.

Figure 3.2 Dissection of the letter O

The letter “o”:

The oval shape of the letter emphasizes its softness and elegance. The axis of the curve slopes slightly to the left.
The middle of the figure is oval rather than circular, which makes the font visually more elegant.
The thickness of the stroke varies: at the top and bottom it becomes slightly thinner than at the sides, creating the illusion of volume and fluidity.

Figure 3.3 Dissection of the letter g

The letter “g”:

The lower hinge is made larger and more massive than the upper oval shape.
The serifs and curved contours are constructed using multiple intersecting circles.

Figure 3.4 Dissection of the letter b

The letter “b”:

The thickness of the main vertical stroke is uniform, but the rounded element has a thinner outline.
The serifs are minimalistic, and the shape of the letter is inscribed in perfectly balanced circles.
The upper rounded part of the letter is slightly slanted.

3.2 Sketch

I bought two markers - one with different sizes to see how the work would look with different line thicknesses. Before choosing a sketch for further work in digital format, I wrote a lot, because Mr. Vinod said that one should write, not draw.

Figure 3.5 Sketch "Hogb"

I chose between serif and round fonts, thinking about which one would be best for my project. I wanted to create an uppercase version of the font to make it more expressive. I thought that uppercase letters would look more elegant and modern, and in combination with the right thickness of the lines, an interesting contrast and dynamics could be achieved. In general, I wanted to find a balance between aesthetics and readability.

Figure 3.6 Sketch "Hogb" 2

I then proceeded to create a sketch for the letters “ o l e d s n c h t i g , . ! # ”. This was the next step in the process, and I focused on how these symbols would interact with each other. I experimented with their shapes and placement so that each letter and sign would fit seamlessly into the overall composition.

Figure 3.7 Sketch 3

Figure 3.8 Sketch 4

3.3 Digitise

First, I created guides for the x-height, ascender, descender, and cap height to ensure the letterforms maintain proper proportions.

Figure 3.9 Setting Up Measurement

In this part, I'm going to digitize my sketch. I've chosen my favorite sketches.

Figure 3.10 Hogb

Figure 3.11 letter "g" and "b"

Mr. Vinod gave me feedback that I would need to change the letter “g” and “b”. He then helped me redesign and improve the “g” and I, inspired by his examples, also redesigned and improved the “b”. Now that all the changes have been made, the font looks much better.

Figure 3.12 before and after "hogb"

Figure 3.13 final version "hogb"

Once I selected the font I preferred, I began the digitization process in Adobe Illustrator, following the tutorial videos provided by Mr. Vinod. We were asked to create these letters and punctuation marks in our own style: o, l, e, d, s, n, c, h, t, i, g, , . ! #.

I'm going to digitize my sketch. After adjusting the X height, I adjusted the cap height, rise and fall accordingly.

Figure 3.14 Setting Up Measurement

After preparing the setup, I began digitizing my sketch. I used the pen tool to create the basic outlines, carefully tracing the letters I had designed. While tracing, I noticed some mistakes in the shapes and made immediate adjustments to correct them.

Figure 3.15 digital process

Mr. Vinod also gave me feedback that the thickness of the letters should be the same to create a more cohesive and harmonious look. He showed me how to test this through a square, using it as a reference point for the proportions and width of the lines. This helped me better understand how to achieve the same thickness and avoid visual imbalances. After I made these adjustments, the font started to look much neater and more professional, and everything now looks much more harmonious and balanced.

Figure 3.16 digital process

Figure 3.17 digital process

Figure 3.18 digital process "before and after"

I also had a problem with punctuation marks. Mr. Vinod gave me feedback to watch a video he sent in Teams. After watching it, I finally understood what my mistake was and how to properly work with punctuation in the context of the font. I made the necessary corrections, and the result improved significantly — the punctuation marks now look more neat and harmonious with the rest of the font elements.

Figure 3.19 digital process "before and after"

The comma should be the size of two dots. Also, the dot above the letter 'i' should be smaller than the actual dot.

Figure 3.20 Final version

3.4 Fontlab

After we go with our font to FontLab and download the demo version of the app. I named my font Dinline.

Before importing the font into FontLab, I watched Mr. Vinod's video where he shows how to properly import a font. After that I imported the font into FontLab and customized it by adjusting the height.

After that I imported the font into FontLab and adjusted everything , I adjusted its height.

Figure 3.21 settings

Figure 3.22 Adjustment of measurement

I adjusted the kerning, trying to balance the spacing between the letters, guided by my eye. I wasn't too keen on this, since Mr. Vinod said that kerning should only be used for letters that create spacing problems.

Figure 3.23 Kerning

Figure 3.24 Kerning 2

3.5 Poster Process

After that, I moved on to creating a poster to showcase the result of my work. The poster became not only a reflection of my font, but also a visual interpretation of the whole concept.

I then needed to make words or phrases from our created letters. I asked ChatGPT and he gave me a few options. I chose the phrase: #let the design shine, echo in the night!

After that, I start by typing out my phrase and my name, year and font name (Univers Ltd Std 8pt).

Figure 3.25 initial poster

I created the original version of the poster, but after Mr. Vinod gave his feedback, I made changes. He suggested increasing the size of some words and adjusting the kerning in some places to improve the readability and overall harmony of the design.

Figure 3.26 Final poster

3.6 Final Outcome

You can download the font here: Dinline

Figure 3.27 Screen Grab of FontLab

Figure 3.28 Final Type Construction in AI JPEG

Figure 3.29 Final Type Construction AI in PDF

Figure 3.30 Final JPEG A4 White Poster

Figure 3.31 Final JPEG A4 Black Poster

Figure 3.32 Final PDF A4 White Poster

Figure 3.33 Final PDF A4 White Poster

FEEDBACK

Week 6

General feedback: We should control that the number of characters per line is around 50-60 when aligning the text. Regarding headings, it is important to understand why we are emphasizing them and to properly justify this choice. When creating large headings, we should place them side by side, avoiding unnecessary spaces so as not to create confusion for the reader.After reading feedback on spacing, I realized how important it is to accurately maintain indentation between paragraphs and page edges.

Specific feedback:The editorial layout on a piece of paper should be printed.I need to avoid cluttering the design with unnecessary embellishments and focus on making sure the information is clearly understood by the viewer. I also need

Week 7

General feedback:This week, Mr. Vinod provided us with final comments on our project and gave us permission to begin our third task. Prepare the artwork and print it out for layout check. We also need to create a sketch for the third task using the marker we purchased. I decided to apply a tighter structure and organize the text and images to improve the perception of the information.

Specific feedback:Do not use smaller fonts in the text as it impairs readability. The same goes for the use of bold and italicized fonts. It is very important to check that all elements are displayed correctly and make sure the file opens without problems before submitting the project. This will help avoid technical errors.

Week 8

Independent Learning Week

Week 9

General Feedback:Mr. Vinod reminded of the importance of uniformity in spelling of letters and punctuation marks, as well as proper use of x-height. Small but important details were discussed. In the class, we looked in detail at points such as the intersection of the grid in the letters “l” and “g”. It was also emphasized that the letter “s” is not symmetrical: it is smaller at the top and wider at the bottom.

Specific Feedback:The lowercase letter “t” should not be at a raised height.Overall, the work looks okay, but there are a few things that need to be changed. In some places, the font does not look quite clear, and correction of the form is required. Special attention should be paid to the letter “E”, which now looks not very clear. Its shape should be changed to make it more readable and harmonious.

Week 10

General Feedback:Mr. Vinod helped us refine and adjust our digital sketch, correcting some errors in font creation. The comma should be about two points high, and the dot should be slightly larger than above the letter “i”.

The end of the comma should resemble the end of the letter “s”.

It is important to avoid overly decorative looking punctuation marks.

Specific FeedbackMr. Vinod noted that a few things in the font needed to be refined. One important comment was that the thickness of all letters should be the same. This is important to maintain the integrity and harmony of the font. Mr. Vinod showed how the thickness can be measured using a square, which will help achieve the same width for all elements.

Week 11

General Feedback:Mr. Vinod helped us fix the fonts we were working on and guided us to switch to FontLab for future work.It is important to watch the tutorial video carefully to avoid mistakes when transferring a font from Adobe Illustrator to FontLab. Skipping even a few instructions can lead to problems.

Specific Feedback: The overall design is fine, but the letters “g” and “b” need some tweaking to improve proportion and clarity.

Week 12

General feedback:We continued to refine the font, focusing on improving individual letters and elements. Mr. Vinod continued to support and guide us, checking our work and providing helpful suggestions. We continued our work at FontLab, improving the font according to the feedback we received.

Specific Feedback

I'm finalizing the font by fixing the remaining errors in FontLab. Most of the work on improving letter proportions and character alignment has been completed. The letters now look harmonious and readable. Only the final part of the work remains - to export the font and prepare the poster.

REFLECTIONS

Experience - This assignment was the first time I realized how important it is to create fonts that are just right for me. It was a new and unusual experience that made me realize how a typeface can be not only aesthetically pleasing, but also functional. I've always wondered how different fonts work in different contexts, but now I was able to immerse myself in the process. I particularly enjoyed experimenting with letterforms and finding ways to make them expressive yet readable. In the future, I want to continue to explore font creation and perhaps create my own style.

Observations - I have noticed that it is important to consider many factors when creating a typeface such as proportions, spacing of letters and how they interact with each other. This turned out to be a much more complex process than I expected, but also extremely fascinating. I also realized that it is important to think about the “character” of each typeface and how it will be perceived in different media. I learned how to work in FontLab, which gave me new tools to realize my ideas. Video tutorials and step-by-step instructions were very useful, they helped me to quickly get used and not get lost in the process.

Findings - This experience showed me how important it is to approach font design with attention to detail. Every little detail affects the big picture and it became clear to me how to work around this. I also realized that having a clear plan and time management are key to successful work. I learned how to use my time resource effectively and prioritize properly. Being open to feedback proved to be an important tool to improve the outcome. Help and advice from my teacher and colleagues became valuable for me in the process of working on the font.

Search This Blog

Aidina Begimbaeva (0380489)