Typography | Task 2: Typographic Exploration & Communication

Some uppercase letters may appear symmetrical at first glance, but in fact they are not. In Baskerville, for example, you will notice that the connections between the serifs and the main strokes (the so-called ‘brackets’) have a unique arc-shape. It is also worth noting the differences in the thickness of the strokes, which gives this font a special expressiveness and character.

Fig 1.1 The uppercase 'A' in Baskerville

Typography: Letters

Although uppercase letterforms may seem symmetrical at first glance, a closer inspection reveals subtle differences in their proportions. For instance, the left slope of certain letters is often thinner than the right stroke, creating a sense of dynamic balance. This attention to detail is evident in typefaces like Baskerville and Univers, where the designer's careful craftsmanship results in letterforms that are both visually cohesive and distinctively expressive. Both typefaces reflect a balance between uniformity and individuality, with each character maintaining its own unique characteristics while contributing to an overall harmonious design.

Fig 1.2 The uppercase 'A' in Univers

Typography: Maintaining x-height

The x-height typically refers to the height of lowercase letterforms, specifically the height of the lowercase "x" without ascenders or descenders. However, for letters with curved strokes, such as the lowercase "s," the situation is a bit different. In order to maintain visual consistency and balance, the curved strokes need to extend slightly above the median (the imaginary line marking the top of the x-height) or dip below the baseline. This ensures that the curves of the letter appear to be the same size as the adjacent vertical and horizontal strokes, contributing to the overall uniformity and legibility of the typeface. This design consideration is crucial for achieving visual harmony between different letterforms in a typeface.

Fig 1.3 X-height for the word 'razors'

Fig 1.4 Close up x-height for the first three letters

Typography: Form / Counterform

In typography, just as crucial as recognizing the shape of the letterforms themselves is developing an awareness of the counterform—the space enclosed or defined by the strokes of the letter. A counterform refers to the negative space within and around a letter, such as the inside of an "o" or the space between the vertical and diagonal strokes of an "A."

When letters are combined to form words, the counterform extends beyond individual letters to include the space between them. This negative space plays a vital role in the overall legibility and aesthetic balance of a type design. Proper attention to the counterform ensures that the letters work together cohesively, and the spaces between them are consistent, enhancing readability and visual harmony. The relationship between letterforms and their counterforms is a key aspect of effective typography.

Fig 1.5 Counterform example

The concept of form and counter is especially important for letters like lowercase 'r', which lacks an enclosed counter. Unlike letters such as "o" or "e," the "r" relies on the balance of its strokes to convey its shape.

To understand how form and counter work together, examining letterforms closely reveals how the balance between solid strokes and negative space is achieved. This process also provides insight into the craftsmanship behind letter design.

An interesting observation is that the shape of an 'S' remains clear even when enlarged, while the lowercase 'g' loses its distinct identity when individual elements are examined in isolation. This shows how context and relationships between parts define a letter's uniqueness.

Fig 1.6 Counter in the letters 'S' and 'G'

Typography: Contrast

The basic principles of graphic design directly influence typography, and one of the most powerful dynamics in design is contrast. Contrast in typography creates visual interest, hierarchy, and clarity. Rudi Ruegg's format for exploring contrast in type illustrates how varying characteristics can produce different effects.

For example, simple contrasts can generate a wide range of variations, such as:

small + organic vs. large + machined
small + dark vs. large + light

These contrasts in size, weight, and style contribute to the overall tone and impact of the design, helping to guide the viewer's eye and establish emphasis.

Fig 1.7 Different contrast between the uppercase 'A' in Helvetica Bold and Baskerville

Week 6

Lecture 6: Screen & Print

In this lesson, we've learnt the basic rules and key aspects to consider when applying typography in different environments, be it digital media or printed materials.

Fig1.8,Print common layouts

For print, typefaces like Caslon, Garamond, and Baskerville are popular choices due to their elegant, intellectual character and excellent readability, especially at smaller font sizes. These classic serif fonts are designed with well-proportioned letterforms that maintain clarity and legibility even when the text is set in smaller sizes.

Typically, a font size of 10 or 12 points is preferred for body text in printed materials, as this range offers a balance between readability and space efficiency, depending on the distance from the reader. The timeless design of these typefaces ensures that they remain easy to read, even in long passages of text.

On screen:
When designing for screens, typefaces often differ from those used in print. To enhance readability on digital devices, fonts tend to have taller x-heights, wider letterforms, and more open apertures. Additionally, hairline strokes and serifs are often made bolder, and stroke contrast is reduced to avoid pixelation at smaller sizes. Curves and angles are also adjusted to accommodate screen resolution. For web or screen-based content, a font size of 16 pixels is commonly used for body text, as it provides a good balance of legibility and visual comfort.

Brief summary:
As technology evolves, we now have a variety of reading media. However, this doesn’t mean typesetting is becoming obsolete; instead, it calls for continued innovation and versatility in design. Good typography should always serve the content, whether text or images. As a designer, it's essential to treat text as a user interface, not just as content, ensuring that the type enhances the user’s experience and interaction with the material. This mindset is key to effective and engaging design.

INSTRUCTIONS

Task

TASK 2: TYPOGRAPHIC EXPLORATION AND COMMUNICATION

We were given 3 text options for us to choose, in this case I pick the third one which is "Unite to visualise a better world".

1. References

Before beginning the project, I made sure to conduct thorough research to gain a deeper understanding of the task. This helped me explore various ways to experiment with composition while keeping the results clean and effective. By studying different design approaches and understanding how different elements work together, I aimed to achieve a balanced design that communicates the intended message clearly, without unnecessary complexity. This approach ensured that the final outcome would be both visually appealing and easy to navigate.

Fig 2.1 References

2. Sketches

Fig 2.1 Sketches

3.Final Composition

Fig 2.7 Final Composition

Fig 2.8 Final Composition with grid

Fig 2.9 Final Composition

FEEDBACK

Week 6

General feedback: After reading the feedback on spacing, I realised how important it is to accurately maintain indentation between paragraphs and page edges. This has a big impact on the perception of the work as a whole. In order to make the layout look light and neat, I started paying more attention to details such as even spacing and proper placement of elements.

Specific feedback: It's important to remember that each element of the layout should focus on the main goal. I need to avoid overloading the design with unnecessary embellishments and focus on making sure the information is clearly perceived by the viewer. I would also need to work more on line spacing and indentation to avoid tight blocks of text.

Week 7

Overall feedback: I decided to apply a tighter structure and organise the text and images to enhance the perception of the information. In this respect, the layout became much better. Sometimes the best ideas come at the most unexpected moment, and it's important not to miss them.

Specific feedback:

I'm happy with how it turned out, as the font became more expressive and interesting to read.It's very important to check if all elements are displayed correctly and make sure the file is opened without problems before submitting the project. This helps to avoid technical errors.

REFLECTIONS

Experience

During this two-week course, I learnt how to design full layouts, including the development of headlines and text. In order to create an eye-catching headline, it is important to first understand what letters or elements need to be emphasised and then build the whole layout around that idea. There are also a few ‘inhibitions’ when working with text, and you need to consider how the text can harmonise with the headline.

Observations

While working on the project, I noticed that while creating the headlines I came up with many ideas, but in the process of digitising them I realised that many of them didn't fit. It was particularly important to work out how to emphasise the main element of the headline so that it didn't overwhelm the text. I also observed that some classmates had the same problem with finding the main idea for a headline. This helped me realise that we often look for a word to diversify, but forget that it is important to convey the main message with as few elements as possible.

Findings

I've learnt that inspiration is a fleeting spark and if you get an idea, it's important to implement it straight away. I also learnt how to work with Adobe Illustrator files in Adobe InDesign, which made it much easier to change sizes and layouts without losing quality. This knowledge became very useful, especially when creating layouts for printed materials. I also began to realise that I needed to consider things such as the readability of text and its interaction with other elements, as well as how the printed result would look.

Result

I also learnt a lot by analysing other people's work, especially professionals. Although I have not yet been able to optimise my composition to the level I have seen from others, I am glad that I have been able to recognise my weaknesses and understand what changes I need to make in the future. This really helps me to move forward and strive for excellence in design.

Search This Blog

Aidina Begimbaeva (0380489)