ADVANCED TYPOGRAPHY TASK 2

on

ADVANCED TYPOGRAPHY

|| Leong Hui Xuan 0365793
|| 13/05/2025- 03/06/2025 (Week 4 - Week 8)
|| Bachelor of Design in Creative Media 
|| Task 2
Table of Content

Perception
- Something that regarded, understood or interpreted.
- It is the visual navigation of contrast, form and organisation of the content.

Method that create contrast in Typography:
- Light/ Bold
- Condense/ Extended
- Organic/ Machined
- Roman/ Italic
- Small/ Large
- Nagative/ Positive
- Serif/ Sans serif
- Ornate/ Simple
- Red/ Blue

- Contrast in size provide a visual hierarchy to readers. 
- Weight show how bold type can stand out.
- Contrast of form is distinchtion between lowercase and uppercase equivalent.
- Structure make the different letterforms in different typefaces.
- Texture will be apply when placing the contrast of size, weight, form and structure.
- Direction is the opposition between verticala nd horizontal.
- Use of colour suggest second color be less emphatic in values.


Form 
- Refer to overall look and feel of the typographic compositions.
- Two function of Typography: To represent a concept/ To do so in a visual form.
- Form meaning to brings a balanced harmony in terms of function and expression.


Organisation/ Gestalt
- Gestalt meaning the way that has been placed/ put together in German. 
- Gestalt theory emphasized anything that is greater than its parts.

- Perceptual Organisation / Groupings:
  1. Law of Similarity
  2. Law of Proximity
  3. Law of Closure
  4. Law of Continuation
  5. Law of Symetry
  6. Law of Simplicity (Praganz)
- Gestalt principle explain how eye creates a whole from parts.





INSTRUCTION




TASK 2 PART A - KEY ARTWORK

In task 2 Part A, we need to create a wordmark for our brand.
Then we need to come out with:
  • Black wordmark on white background
  • White wordmark on black background
  • Colour palette
  • Wordmark in actual colours on lightest shade of colour palette
  • Wordmark in lightest shade of colour palette on darkest shade of colour palette
  • wordmark animation
    •
- Each artboard need to be 1024 px x 1024 px, 300dpi format.

Mind Map for Inspiration

Figure 1.o, Mindmap myself, week 4 (13/05/2025)

This mind map is use to give use inspiration to create my wordmark.

Moodboard

Figure 1.1, Moodboard, week 4 (17/05/2025)

This moodboard is to give me inspirations of the artistic direction for my wordmark design. I like how the designer fusion the letter and the cat .

Sketches

Figure 1.2, Sketches, week 4 (17/03/2025)

Chosen keywords: Tail, Bold, Round
My idea was to explored and combined the cat tail to the letter "Q", to make the "Q" stand out.

Digitalization
Figure 1.3, Digitalize Wordmark, week 5 (20/05/2025)
For the frist part, I developed the "Qinn" wordmark heavily incorporating a cat-like motif. Besides, I also get inspiration of the spade "Q" in 4th row from the poker card.

The second part, I redinement and stylization of the "Qinn" wordmark. It's more focuses on "QINN" itself, explored different visual effects. the general theme here is much bolder, more robust and rounded font for "QINN". The variations showing the effect like drop shadow, outlines and inner shadow, 3D extrusion, Overlap and negative space.


Final digitalization
Figure 1.4, Final Digitalize, week 5 (20/05/2025)

The final digitalize, based on Sir Vinod feedback, I outlined the entire tail of the letter "Q" to make it more distinct than if I only outlined half of it. I also simplified the letter from a lot of cat elements to just the tail. Overall, it look more simple.

Colour Application

Figure 1.5, Colour Application, week 5 (23/05/2025)

For the colour palette, I used Colour Hunt and Pinterest to find inspiration. After selecting multiple colour palatte, I place them together and compared them to choose the final colour palatte.

I use Palette #1 as my initial palette and palatte #2 as my final palette. I experiment with both colour palette in the mock-up.

Figure 1.6, Final colour palette, week 6 (26/05/2025)


Key Artwork Animation

Figure 1.7, Key word animation, week 6 (27/05/2025)

I used After Effect to create my animation with Tapper effect.
Figure 1.8, Animation 1, week 6 (27/05/2025)

I tried adding different colour of the letters to see how it works.

Figure 1.7, Final aniamation, week 6 (29/05/2025)

I decided to place the colour like this at the final, orange to blue.

Task 2A Final Outcome
Figure 1.8, Black wordmark on White Background, week 6 (29/05/2025)
Figure 1.9, White Wordmark on Black Background, week 6 (29/05/2025)

Figure 1.10, Colour Palette, week 6 (29/05/2025)

Figure 1.11, Wordmark in actual colours on llightest shade of colour palette,
week 6 (29/05/2025)

Figure 1.12, Wordmark in lightess shade of colour palette on darkest shade of colour palette, week 6 (29/05/2025)

Figure 1.13, Key Word Animation, week 7 (02/06/2025)

               Figure 1.14, Task 2A PDF Compilation, week 7 (02/06/2025)




TASK 2 PART B - COLLATERAL

In Part B, we were required to apply our wordmark in 3 collaterals mock-up and design it. My idea of my brand is to create some merchandise that I liked and use it often.

Initial Idea
My first idea when doing Part B is to create Batch, Tod's bag and Cup.

Wordmark Variation
I create some wordmark variations that used in my mock-up as pattern and logo.
Figure 2.1, Wordmark Variations, week 7 (03/03/2025)

For the Experimental Patterns: 
First, I use the design of letter "Q" to create a up side down repetition pattern with the colour light blue and yellow.

Second, I edit the size of letter "Q" to more bigger and place the letter "I,N,N" beside the "Q" in the same base with the circle of letter "Q".

Third, I replicate my wordmark and make each wordmark from deep to shallow.

Collateral 1: Batch

Figure 2.2, Collateral 1 Batch, week 7 (03/06/2025)


Collateral 2: Cup

Figure 2.3, Collateral 2 Cup, week 7 (03/06/2025)

Collateral 3: Tod's bag

Figure 2.4, Collateral 3 Tod's bag, week 7 (03/06/2025)


Final Idea
After consultation, I change all my idea and start to re-experiment the wordmark design, colour palatte, and collaterals.

Then, I decided to create candle, label cards of the cloth and luggage as my mockup which three of them are often be used in my life.

Wordmark Variation

Figure 2.5, Wordmark Variations, Week 8 (09/06/2025)

The Square Logo is a combination of text and geometric shape, forming an square batch.

For experimental Patterns:

The first pattern uses repetition and overlap the "QINN" logo repeatedly layered to create subtle, textured background reinforces the brand name.

The second, third and fourth patterns use repetition of "Q" symbol with different color. The third and fourth add a copy layer of the repetition "Q" and change the layer to dissolve layer to create a rought texture feel.

Collateral 1: Candle

Figure 2.6, Collateral 1 Candle, Week 8 (09/06/2025)

For the first mockup I chose a candle. I love candles so much that I tried to make a candle with my Square Logo.

Collateral 2: Labels 

Figure 2.6, Collateral 2 Label cards, Week 8 (09/06/2025)

In this mockup I use different color of patterns to create different labels.

Collateral 3: Luggage

Figure 2.7, Collateral 3 Luggage, Week 8 (09/06/2025)

For the suitcase, I combined the repeating pattern, the square logo, and my portrait through overlapping.


Identity Expansion & Instagram Tile Design

1. Initial Development


Colour Palette

Figure 3.0,Colour Palette with Logo, week 8 (09/06/2025)

I apply my Logo "Q" to the colour palette and change the layer mode.


Black & White Photograph

Figure 3.1,Black and White Photo, week 8 (09/06/2025)


I used multiple layers of the "QINN" logo in different colors to cover my eyes so it looked like I was wearing sunglasses.


Pattern Expansion

Figure 3.2, Pattern Design, week 8 (09/06/2025)

I use the same pattern  and square logo that i used in my mockup.

Instagram feed layout

Figure 3.3, Instagram Feed Layout, week 8 (09/06/2025)

Task 2B Final Outcome

Figure 3.4, Collateral 1, week 8 (09/06/2025)

Figure 3.5, Collateral 2, week 8 (09/06/2025)

Figure 3.6, Collateral 3, week 8 (09/06/2025)

Figure 3.7, Final Instagram Feed Design Layout, week 8 (09/06/2025)


Figure 3.8, Screenshot of Instagram Page, week 8 (09/06/2025)
             Figure 3.9, Task 2B PDF Conpilation, week 8 (09/06/2025)



TASK 2 FINAL OUTCOME COMPILATION

Figure 4.0, Black wordmark on White Background, week 8 (09/06/2025)
Figure 4.1, White wordmark on Black Background, week 8 (09/06/2025）


Figure 4.2, Colour Palette, week 8 (09/06/2025）


Figure 4.3, Wordmark in actual colours on llightest shade of colour palette, week 8 (09/06/2025）

Figure 4.4, Wordmark in lightess shade of colour palette on darkest shade of colour palette, week 8 (09/06/2025)

Figure 4.5, Key Word Animation, week 8 (09/06/2025)

                Figure 4.6, Task 2A PDF Compilation, week 8 (09/06/2025)


 Figure 4.7, Collateral 1, week 8 (09/06/2025)

 Figure 4.8, Collateral 2, week 8 (09/06/2025)

 Figure 4.9, Collateral 3, week 8 (09/06/2025)

 Figure 4.10, Final Instagram Feed Design Layout, week 8 (09/06/2025)

Instagram Link:

Figure 4.11, Screenshot of Instagram Page, week 8 (09/06/2025)
                   Figure 4.12, Task 2B PDF Compilation, week 8 (09/06/2025)



FEEDBACK

Weeek 5:  
General Feedback: The word mark need a keyword to reflect the meaning. Fun is a great theme to come out with a good artwork.
Specific Feedback: The first impression is a pet shop, if going a more commersial logo, it need to be less cat design.

Week 6: 
General Feedback: Simplest the word mark.
Specific Feedback: Remove all the extra elements, and make it simple.

Week 7:
General Feedback: Repetative pattern dont apply different colour, since the repetition pattern is already look loud.

Week 8:
General Feedback: This week we having online class.
Specific Feedback: I change the color palette and collaterals.




REFLECTION

Expereinces:

In Task 2, we need to create a Keyword that represent wordmark and used as an artwork that adorn collateral. This task gave me a lot of challenges, which I really feel confused and redesign many times.
One of the biggest difficulties was translating a personal concept as a cat lover into a proper wordmark that could stand as a brand identity. My initial idea is included too many cat elements, making the design feel more like a pet shop logo than a brand. After receiving feedback, I had to revise and simplify the design again and again until it look good. 

Additionally, experimenting with animation in Adobe After Effects helped my logo create a taper effect on it, make it look smooth and nice. My brand concept is to create objects that we can see and often use in our daily lives. So for the collateral, my initial idea was to make a batch of Tod's bags and cups, but after creating them, I felt that they were not suitable for my logo, then I change my collateral to luggage, label cards and candle.

Observation:

Throughout the project, I noticed how variations in font shape, line weight, and color could impact the overall brand. While experimenting with different visual effects like shadows, negative space, and 3D extrusions, I observed how each effect displayed a different feel. It became clear that， simplification was not meant to make the design boring, but to enhance clarity and professionalism. Repetition can become boring without careful attention to detail, especially when creating patterns. Moving from the initial collateral ideas to items like candles, label cards, and luggage made me realize that when a brand reflects an individual’s lifestyle, the merchandise can become more personal.

Findings:

This assignment taught me that successful logo design is about balancing concept with functionality. I learned that even a simple letter like the “Q” can be recognizable if carefully crafted. Through sketching, mood boards, digital color tests, and mock-up experiment, I discovered that every decision from the pattern design of the letters to the pairing of the pattern with the logo is crucial in brand communication. Research from Pinterest, Colour Hunt, and real packaging examples gave my a more understanding about how logo combined into a collateral to evaluate which designs would more work for print and digital applications. Overall, this assignment improved my attention to detail in type design and my ability to translate personal creativity into logo.



FUTHER READING

Figure 5.0,Carl Dair at Enschedé: The Last Days of Metal Type, week 8 (10/06/2025)
Carl Dair at Enschedé: The Last Days of Metal Type

This is a typographic memoir documenting Canadian designer Carl Dair’s apprenticeship at the Joh. Enschedé type foundry in the 1950s. The book captures the traditional craft of metal type makin,g such as punch cutting, matrix making, and casting during its final era before the rise of digital typography. Through personal reflections, visual documentation, and design philosophy, Carl Dair shares insights on balance, proportion, and typographic form. It serves as both a historical record and a tribute to the craftsmanship behind type.






Comments

Post a Comment