ADVANCED TYPOGRAPHY TASK 3: EXPLORATION & APPLICATION

17.06.2024 - 21.07.2024  / Week 9 - Week 14

Emily Goh Jin Yee / 0357722 / Bachelor of Design (Honours) in Creative Media 

Advanced Typography / GCD61004 / Section 03

Task 3: Task Exploration & Application


TABLE OF CONTENTS

1. LECTURES

2. INSTRUCTIONS

3. TASKS

4. FEEDBACK 

5. REFLECTION 

6. FURTHER READING


LECTURES


lectures are completed in Task 1 & Task 2.



INSTRUCTIONS



TASKS

TYPE EXPLORATION & APPLICATION


W9 What is expected in the next class (Week 10)?

1  Complete Task 2 eportfolio.
2  Update the Google Feedback Sheet with Week 9's feedback (general/specific)
3  T3: Complete all Uppercase letterforms (once designs are approved) at minimum (numerals, lowercase and punctuations left).
4  Use a grid to ensure consistency in weight (stroke thickness).
5  Update T3 eportfolio with research and process.


W10 What is expected in the next class (Week 11)?

 1  Update the Google Feedback Sheet with Week 10's feedback (general/specific)
2  Task 3: aim to complete all letterforms (numerals & punctuations as well).
3  Update Task 3 eportfolio with research and process


W11 What is expected in the next class (Week 12)?

1  Update the Google Feedback Sheet with Week 11's feedback (general/specific)
2  T3 complete all letterforms uppercase, lowercase, numerals (punctuations left), complete font generation from FontLab7 (use MacLab D7.04 for original software)
Note: When importing letterforms from Adobe Illustrator pay attention to these two points (see attached):
- Do not "Round", click on "Keep". 
- Ensure to set preferences ("keep strokes and colours... and Ai import original position...", see attached screen grab).
3  Download, analyse and plan how to create your font presentation
4  Plan your font applications.


W12 What is expected in the next class (Week 13)?

1   Update the Google Feedback Sheet with Week 12's feedback (general/specific)
2  T3 adjust side bearings for all letters & punctuations using the chart provided on week 11. Use MacLab D7.04 for original FontLab7 software (or FontForge). Generate font. 
3  Complete font presentations (5 artworks; 1024 x 1024 px, 300ppi). See sample below.
4  Complete font applications (5 artworks simulated; size subject to application but
    should not exceed 1024px in width or height. 300ppi).


W13 What is expected in the next class (Week 14)?

1  Update the Google Feedback Sheet with Week 13's feedback (general/specific)
2  Complete font presentations (5 artworks; 1024 x 1024 px, 300ppi). Download, sample font presentations here should not exceed 1024px in width or height).
A-Z; Numerals; Punctuation
Designed font link to your .ttf font. 
Font preview (optional)
3  Complete font applications (5 artworks; size subject to application but should not exceed 1024px in width or height at 300ppi). View Pentagram site for examples.
4 Submit Task 3 Eportfolio ( I will check this in the next class) and Final Compilation & Reflection in class.


W14 Deadline

Submission deadline for Task 3 including Final Compilation & Reflection post falls on 21st July, 11:59PM

 


TYPE EXPLORATION


Before we start the task, we have to create a proposal on either 

Creating a font that is intended to solve a larger problem or meant to be part of a solution in the area of our interest like graphic design, animation, new media or entertainment design or any other related area, not necessarily reflecting our specialisation.

or

Explore the use of an existing letterform in an area of interest, understand its existing relationship, identify areas that could be improved upon, explore possible solutions or combinations that may add value to the existing letterform / lettering. 

or

Experiment. For your idea to qualify as an experiment it must be novel and unique — working with material that might be 3-dimensional, digitally augmented, edible, unusual, typographic music video or fine art. 


To be effective you will need to study your selected area, look at how type is used in the area and identify potential weaknesses or possible areas of further exploration or experimentation. You can then attempt to provide a creative solution or add value to an existing use. The end outcome could be a designed font and its application in the form or format that it is intending to provide a solution to, or a designed font that adds value to an existing use, or an experimentative output that results in something novel and unique. The work can manifest into any kind of format related to the issue being solved or explored or experimented: animation, 3d, print, ambient, projection, movie title or game title, music video, use of different material etc.

 
Fig T3.1  Final Project Proposal in PDF, Week 10 (28/06/2024)

I chose the second idea which was to create a continuation and improve a better version of my typeface made for our Task 1 Exercise 2: Type & Play. I believe improvements can be done by making it more bold and thicker, to create an easy to see appearance and more like a usable typeface. This typeface will be cute and fun-looking, yet readable and unique. It will be usable for posters(for entertainment, fun events), books (can be elegant or cute), advertisements, personal use, etc.



INSPIRATIONS/REFERENCES

I found these fonts similar to the theme (bubble/water) I want for my own letterforms. They feature rounded, bold, uneven looking design. Mr Vinod suggested that I could check out font Tanker from font share, I decided to keep my font mainly inspired from that and use it as a reference.

Fig T3.2 Inspirations, Week 11 (01/07/2024)
Fig T3.3 Type reference-TANKER font, Week 11 (01/07/2024)


I name my font 'BubbleTide' due to its bubble-looking design.


TYPEFACE PROCESS 

ADOBE ILLUSTRATOR
I placed the typeface created previously and screengrab the letters of Tanker font as a reference. I started by placing letter A and began adjusting the thickness to be similar to Tanker's. However, mine features uneven circles to show the characteristics of bubbles.

Fig T3.4 Importing the images of Tanker font, Week 11 (01/07/2024)
 
Fig T3.5  letter A process, Week 11 (01/07/2024)

Fig T3.6 process screengrab, Week 11 (01/07/2024)

Fig T3.7 completed uppercase letterforms(attempt 1), Week 12 (09/07/2024)

After showing Mr Vinod on my completed uppercase letterforms, he said overall looks fine, just minor adjustments to be made. To continue, I made refinements on most letters and asked my friends to take a look at them, they gave some advice on making the overall letters more consistent by applying more curves at the edges and areas. 

Letter A: initial attempt was more rounded, however most of my letters were not as rounded and so it appeared a little different to the whole type family, so I tried to make it look more consistent. 
Fig T3.8 letter A process, Week 12 (10/07/2024)

Letter B: similar to letter A, the circles in the middle were very unbalanced for my liking.
Fig T3.9 letter B process, Week 12 (10/07/2024)

Letter C: on the left shows an experimental outcome to achieve a more curvy look and more similar to the type and play one, but it didn't seem to fit the other letters
Fig T3.9 letter C process, Week 12 (10/07/2024)

Letter E: initial attempt was too square-ish and uneven, which appeared messy.
Fig T3.10 letter E process, Week 12 (10/07/2024)

Letter F: similar to letter E.
Fig T3.11 letter F process, Week 12 (10/07/2024)

Letter G: initial attempt was not rounded enough.
Fig T3.12 letter G process, Week 12 (10/07/2024)

Letter H: initial attempt was too curvy, matched the first attempt of letter A, but too different compared to others.
Fig T3.13 letter H process, Week 12 (10/07/2024)

Letter K: this letter received many feedbacks due to it being to thin in the middle and quite uneven as well.
Fig T3.14 letter K process, Week 12 (10/07/2024)

Letter M: from a square and point edge to a more rounded and balanced letterform.
Fig T3.15 letter M process, Week 12 (10/07/2024)

Letter N: I just realised the 'improved' version turned out slightly thin..
Fig T3.16 letter N process, Week 12 (10/07/2024)

Letter Q: I was following how the Tanker's Q looks like, however, it was not really correct and weird. So, Mr Vinod asked me to change it and said it should be the same size as letter O.
Fig T3.17 letter Q process, Week 12 (10/07/2024)

During the process, I also turned on grids and used gridlines to make sure everything were tidy and on the baseline.

Fig T3.18 Digitizing letterforms in AI, Week 13 (15/07/2024)

Fig T3.19 Digitizing letterforms in AI, Week 13 (15/07/2024)

Fig T3.20 Final Digitized letterforms in AI, Week 13 (15/07/2024)


Before importing the letters to FontLab, I made sure each letter was grouped to avoid mistakes later on. After grouping, I also added 'outline stroke' in preferences>path. Then copied and paste to FontLab.

Fig T3.21 Grouping letters before importing, Week 13 (17/07/2024)



IMPORTING LETTERS INTO FONTLAB

Firstly, I set the dimensions for the font according to the gridlines placed in Adobe Illustrator.

Fig T3.22 Settings of dimensions in FontLab, Week 13 (17/07/2024)

I started by placing letter H and letter O and set the kerning number to 25 for H and 23 for O. Referring to the table given to achieve a more accurate outcome.

Fig T3.23 Process in Fontlab-letter H, Week 13 (19/07/2024)

All the letters, numbers, and punctuations are shown here.
Fig T3.24 Process in Fontlab(table), Week 13 (20/07/2024)

After creating all the letters and kerning based on the given table, I began typing out the letters into phrases and random words to see its outcome.
Fig T3.25 Testing out the letterforms, Week 13 (20/07/2024)

 
Fig T3.26 Testing out the letterforms, Week 13 (20/07/2024)


I also realize certain letters needed further adjustments on the kerning since it appeared to be too close for some of them.
Fig T3.27 kerning some of the letters again, Week 13 (20/07/2024)

Fig T3.28 All letterforms, numbers and punctuations, Week 13 (20/07/2024)

Fig T3.29 Process of exporting the completed letterforms, numbers and punctuations, Week 13 (20/07/2024)



TYPE PRESENTATION & APPLICATION

FONT PRESENTATION (5 artworks)[1024 px; JPG 300 ppi]

To display BubbleTide font, I chose a summer/beach theme which matches the font's characteristics. 

Fig T3.30 Process of making the font presentation posters, Week 13 (20/07/2024)

T3.31 Font Presentation #1(before correction), Week 13 (20/07/2024)


Fig T3.32 Final Font Presentation #1(corrected), Week 14 (22/07/2024)

Fig T3.33 Final Font Presentation #2, Week 13 (20/07/2024)

Fig T3.34 Final Font Presentation #3, Week 13 (20/07/2024)

Fig T3.35 Final Font Presentation #4, Week 13 (20/07/2024)

Fig T3.36 Final Font Presentation #5, Week 13 (20/07/2024)

Fig T3.37 Final Font Presentation in PDF, Week 13 (20/07/2024)


FONT APPLICATION (5 artworks)[1024 px; JPG 300 ppi]

The images and designs were created in Adobe Illustrator and then transferred to Adobe Photoshop for further editing.

Final Font Application #1: This is a movie poster on a billboard. The color has been filtered to a more blue tone.

Fig T3.38 Final Font Application #1, Week 13 (21/07/2024)

Final Font Application #2: This is a coconut-scented candle. I believe the BubbleTide font could be applied to these types of scented items. I created this design because it relates to the sea and beach, and it matches the bubbly characteristics of the font.

Fig T3.39 Final Font Application #2, Week 13 (21/07/2024)

Final Font Application #3: This is a vinyl album that evokes a 'summer' feeling. The BubbleTide font complements this theme perfectly, adding a playful and dynamic touch that enhances the vibrant, warm visuals.

Fig T3.40 Final Font Application #3, Week 13 (21/07/2024)

Final Font Application #4: This is a poster for a party event. The 'summer' theme pairs well with the BubbleTide typeface, adding a lively and festive touch.

Fig Fig T3.41 Final Font Application #4, Week 13 (21/07/2024)

Final Font Application #5: Lastly, I applied the BubbleTide font to a book cover for kids. The font fits well, enhancing the playful and engaging design. This book cover features a jellyfish, tying into the sea theme perfectly.

Fig T3.42 Final Font Application #5, Week 13 (21/07/2024)

Fig T3.43 Final Font Applications in PDF, Week 13 (21/07/2024)


FINAL FONT DESIGN


Fig T3.44 Final outcome of BubbleTide, Week 13 (21/07/2024)

 Download BubbleTide font here !

Fig T3.45 Final outcome of BubbleTide, Week 13 (21/07/2024)


FONT TESTER

Try out BubbleTide by typing these:
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz
0123456789 ,.:;#"“”!?-[]()


Fig T3.46 Font Tester, Week 13 (21/07/2024)




FEEDBACK


WEEK 8 

ILW- online meet/recording

General Feedback 

  • if you find that you lack confidence or time and unable to complete the work in time (week 12) consider unicase as difficulty reduces
  • (could be applied to people that are going to do something similar) if you plan to design letterforms in Latin or using the runic style, there has to be some styles or textures

Specific Feedback 

    • no specific feedback

    WEEK 9

    online meet/recording

    General Feedback 

    • most (past)e-portfolio submissions were not being done well, poorly formatted
    • must label and include dates and need process work
    • task 2 should be completed already

    Specific Feedback 

      • no comment given for previous tasks (no incomplete or anything)
      • if there's no remark, no issue with work

      WEEK 10

      online meet/recording

      General Feedback

      • complete our uppercase letterforms (once designs are approved) at minimum (numerals, lowercase and punctuations left)
      • use a grid to ensure consistency in weight (stroke thickness)
      • have baseline to ensure consistency
      • do not use someone's artwork to modify, start by your own (can refer only)
      • when creating sharp points, make wider top, you'll notice a difference in overall letter(better)
      • double click on edge to make rounded tip

      Specific Feedback 

        • proceed with Idea 2
        • explore more in the form of the letter
        • bubbles are all fine
        • look up font Tanker, a letterform that is somewhat condense but weighty and rounded that would suit well with the bubbles, at Fontshare site
        • refer to that and create your own letter form

          Fig F1.1 Feedback given, Week 10 (28/06/2024)

        WEEK 11

        General Feedback

        • complete all letterforms

        Specific Feedback 

          • catch up with progress
          • doing correctly, better letterform compared to the type and play letters
          • x-height only used in lowercase, currently don't need to use in uppercase
          • doing good for letter A and B, continue by referring to them since you already have a fixed form
          • don't need to refer to Tanker all the time because might end up having the same letterform but just with patterns added

          WEEK 12

          General Feedback

          • complete all letterforms and punctuation

          Specific Feedback 

            • overall letters looks fine
            • K is a little thin, Q should be the same size as O, refine L

            WEEK 13

            General Feedback

            • N/A

            WEEK 14

            General Feedback

            • N/A

            Specific Feedback 

              • completed 
              • need to add links to original tasks at the top and some minor amendments
              • for final compilation, instead of bringing viewers below to the tasks(in compilation), change it to bringing viewers to the previous tasks(place the blog links)
              • for font presentation #1, punctuations should be the same size as alphabets and numerals
              • highlight the font name 'TANKER'
              • show more progress on what were the changes made at the letterforms, place reference font beside



              REFLECTION

              Experience

              This task was quite challenging, especially when I first tried to come up with ideas for my proposal. I was lost at first, but then I found a previous letter design, which inspired me to explore further. The process was not really smooth; I often got stuck on how to start and continue, which delayed my progress. However, I just tried my best to keep going. I also learned more about using the tools in Illustrator. Photoshop was slightly more difficult since I had forgotten how to edit the images (masking, clipping mask). It took a lot of time to re-explore the tools, but in the end, I managed to create the font applications. After exporting the letters from FontLab, I noticed that certain letters did not require as many patterns and would look better with a simpler design. Nevertheless, everything was completed, and it was still not bad. At least I see myself improving, and it's all about learning!

              Observation

              I realize I really like things related to nature, especially since most of my work features elements like the ocean and beach. For this task, I became more observant and paid closer attention to small details while creating the letterforms. Every point and curve required multiple adjustments to achieve a neater and more consistent outcome. Compared to my previous digitization of letters, I can see my improvement. Through practice and numerous attempts, I have been able to create a better-looking typeface.

              Findings

              In the journey of Advanced Typography, we should often ask for feedbacks to improve our works and always remember learning is important than marks.



              FURTHER READING

              A few things ive learned about typeface design


              This blog was written by a tutor of Typography Design who shares personal opinions and observations. The author acknowledges that these insights are personal and that different people may have varying perspectives. The purpose of sharing these observations is to offer interesting and valuable information to those setting up and running new courses in typeface design, as well as to designers who are teaching themselves. These insights highlight the complex and nuanced nature of typeface design, emphasizing the importance of historical awareness, iterative refinement, scale adaptability, conceptual tool use, and multiscript proficiency​.





              QUICK LINKS




              Comments

              Popular posts from this blog

              APPLICATION DESIGN II TASK 1: APP DESIGN 1 SELF-EVALUATION & REFLECTION

              INFORMATION DESIGN EXERCISES

              APPLICATION DESIGN FINAL PROJECT & E-PORTFOLIO