Advanced Typography Task 3: Type Exploration and Application
19.6.2024 - 23.7.2024 ( Week9 - Week 14)
Lew Guo Ying / 0365721 /
Bachelor of Design in Creative Media
Advanced Typography
Task 3:
Type Exploration and Application
Jump Link
1.
Instructions
1.1
Submission
2.
Feedback
3. Reflections
Instructions
MIB for Advanced Typography
Using the knowledge and experience gained from various exercises, lectures, and personal reading, along with proficiency in the software tools covered in the program, you are tasked with synthesizing and applying this learning to create a font that addresses a larger problem or serves as part of a solution in your area of interest, such as graphic design, animation, new media, or entertainment design. The final output should be a complete generated font (.ttf) with applications. Alternatively, you can explore and enhance an existing letterform, identifying and improving areas to add value, resulting in a complete font (.ttf) with applications. Another option is to conduct a unique and novel experiment involving 3-dimensional materials, digital augmentation, or other unusual approaches, with the final outcome defined by you. Study your chosen area, examine how type is used, identify weaknesses or areas for further exploration, and provide a creative solution or add value. The final output can manifest in any format related to the issue, such as animation, 3D, print, projection, movie or game titles, or music videos.
Proposal for Final Task , week 10 (26.6.24)
For this final task, we are required to create a proposal and present it to Mr. Vinod to get approval for our project. In this task, we need to observe letterforms, identify issues, and provide solutions, ensuring the final font can be applied effectively.
My first idea is inspired by posters and drawings, using wires to create the
font. The second idea comes from noticing that the shapes of M&M's
chocolates are not uniform, and I want to standardize them. The third idea is
based on classic fonts used in movie posters, which look sophisticated and
elegant but are difficult to write and have poor readability. I plan to
simplify these fonts while maintaining their shapes to preserve their classic
and elegant feel. Lastly, I considered continuing the musical font I
previously worked on in typography, but I abandoned this idea due to its
limited application scenarios.
In this week's feedback session, I presented my proposal to Mr. Vinod. He rejected the second idea, but the first and third ideas are feasible. However, he wants me to show some preliminary work to ensure that my skills are adequate to complete the project.
In this week's feedback session, I presented my proposal to Mr. Vinod. He rejected the second idea, but the first and third ideas are feasible. However, he wants me to show some preliminary work to ensure that my skills are adequate to complete the project.
|
|
| Fig1.1 Wire Showcase, Week11(3.7.24) |
|
|
| Fig1.2 Wire Showcase, Week11(3.7.24) |
|
|
| Fig1.3 Simplify Old School Font, Week11(3.7.24) |
I will create some samples to show Mr. Vinod to get approval for my proposal and start the project. I'll make examples for the first idea using wire and the third idea of simplifying classic fonts to demonstrate my capability.
Mr. Vinod suggested that I use a variety of wires, such as different thicknesses and colors, to enrich the connections between them, making the design more interesting. Additionally, incorporating motion, such as making the font move or change trajectory, can give it a dynamic feel.
He also advised that while experimenting, I can focus on a single letter
first. Once that letter is perfected or proven feasible, I can efficiently
apply the same approach to the other letters.
Mr. Vinod also recommended preparing a black background to avoid reflections during photography. Additionally, I should consider using a glue gun or pushpins to secure the wires in place.
To achieve a sense of motion, I bought more wires of different colors and
thicknesses. I am photographing on black cardstock, but although I feel
well-prepared in many aspects, I found that the glue gun doesn't work for
sticking the wires because they are made of rubber plastic and lack
adhesion. Moreover, the glue damages the background, ruining the appearance
of the black cardstock.
I combined all the letters into phrases and included animations, so the entire project is consolidated. I created GIFs for all the combinations and combined them for easier viewing.
Submission
Mr. Vinod also recommended preparing a black background to avoid reflections during photography. Additionally, I should consider using a glue gun or pushpins to secure the wires in place.
|
|
| Fig1.4 Stop Motion Photo, Week 12(10.7.24) |
Fig1.5Stop Motion, Week 12(10.7.24)
The sense of motion I want to achieve is through stop motion; otherwise, it
would involve the wires deforming and then returning to shape when
released.
Mr. Vinod said that what I've done so far is good and can be submitted. However, I don't think it's adequate as it is too rough and incomplete. He also suggested that I could create physical models or use Adobe Illustrator. Initially, I planned to photograph the models and then refine them in Photoshop and Adobe Illustrator. So, he demonstrated how to use Illustrator for this purpose.
He used a 100pt square and added stripes, then combined them into a brush to simulate wire. Using this technique, I drew several types of wire with different colors and stripes. I also added exposed wire ends to enhance the visual effect of wires.
Mr. Vinod said that what I've done so far is good and can be submitted. However, I don't think it's adequate as it is too rough and incomplete. He also suggested that I could create physical models or use Adobe Illustrator. Initially, I planned to photograph the models and then refine them in Photoshop and Adobe Illustrator. So, he demonstrated how to use Illustrator for this purpose.
|
|
| Fig1.6 Brush, Week 12(10.7.24) |
He used a 100pt square and added stripes, then combined them into a brush to simulate wire. Using this technique, I drew several types of wire with different colors and stripes. I also added exposed wire ends to enhance the visual effect of wires.
|
|
| Fig1.7 A to Z, Week 12(10.7.24) |
|
|
| Fig1.8 A to Z Frame, Week12(10.7.24) |
I created a GIF with 24 frames per second for each letter to demonstrate
motion, making a total of 624 frames. After complete all A to Z, I combine
all the GIF into one video.
I used Photoshop to create frame animations for each letter from A to Z, set
at 24 frames per second, and exported them as GIFs using the "Save for Web"
option.
|
|
| Fig1.9 AZ, Week12(10.7.24) |
|
|
|
Fig1.10 Animation,Week 12(10.7.24) |
Fig1.11 GIF Combination Version 1, Week 12 (10.7.24)
After seeking Mr. Vinod’s feedback, he noted that the background graphics in
my animations were too heavy. I made changes by reducing some of the graphic
elements.
Fig1.12 Final GIF Combination, Week 13 (17.7.24)
|
|
| Fig1.13 Word Combination, Week13(17.7.24) |
|
|
| Fig1.14 Word Combination, Week 13(17.7.24) |
I combined all the letters into phrases and included animations, so the entire project is consolidated. I created GIFs for all the combinations and combined them for easier viewing.
Submission
Fig1.18 Final Word combination
YouTube Link: https://youtu.be/zhbuEhTyU6Y?si=MOYPDhIFav5xcaEP
Feedback
Week 13
General Feedback: Ensure all tasks are completed by Week 14, including the
presentation and the 5 artworks (1024 x 1024 px, 300 ppi). This should
include A-Z, numerals, and punctuation. Link the designed font to your .ttf
font. Font preview is optional.
Specific Feedback: The completion is good, but there is too much graphic in
the latter part; reduce it to avoid distracting from the background.
Week 12
General Feedback: Pay attention to font presentation; you can showcase it in
various ways, but only use a limited color palette. Use FontLab to create
all fonts, including numbers and symbols. Avoid excessive complexity and
ensure the font has distinct characteristics.
Week 11
General Feedback: Use FontLab 7 to create the font. To maintain font
consistency, you can use a grid to keep the font balanced and structured.
Keep the font dimensions within 1024pt in width and height.
Spefic Feedback:
Vinod was stunned as if he had discovered a new continent when he found out.
He thinks I'm a wire expert. Now, I know what to do and can choose to create
with actual wire or use Adobe Illustrator.
Week 10
General Feedback: Avoid using italic fonts in the design. Using a grid is
important as it ensures the characters are uniform in size and neatly
arranged. The voting result is that the air conditioning hasn't been fixed,
but we will have in-person classes next week. After completing the uppercase
letters, continue with the lowercase letters and numbers.
Specific Feedback: Using wire is a feasible solution, but it may be too
monotonous, so it should be combined with colored or different thickness
wires. The background should be a solid color to avoid glare. Adding motion
is a great way to illustrate the design.
Week 9
General Feedback: When creating the fonts, you can use references, but you
cannot modify existing fonts. Use a grid to ensure consistency in weight.
The fonts must also be balanced; they should not be unbalanced or have too
much spacing. Before proposing an idea, conduct research and provide some
examples to determine if it is feasible to create the final product.
Specific Feedback: Idea 2 doesn't seem very feasible. Ideas 1 and 3 sound
possible, but you must provide some examples for me to approve them.
Reflection
Experience
It is rare to have the opportunity to design an entire set of fonts. This is a
unique and valuable experience, as creating fonts that are refreshing and
innovative is challenging due to the plethora of existing fonts. Unless one
has highly imaginative or unique ideas, the fonts are bound to bear
similarities to existing ones.
My choice to use wire for this idea was inspired by a poster and a lion made
of electric wires, and I felt it was feasible. Initially, I planned to
photograph the wire and then make adjustments in Photoshop and Illustrator
because physical wires are too difficult to control. I didn’t intend to create
the physical wires, and coincidentally, Mr. Vinod agreed, suggesting we could
go digital. The most challenging part was incorporating motion, as each GIF
required 24 frames, resulting in a total of 624 frames.
Observation
At certain moments, I experienced bursts of inspiration, creating some highly
imaginative designs. This might be due to the nature of the letters, which
have similar shapes, or other factors. This made the animations between them
less monotonous. However, in the latter part, I incorporated a lot of graphics
into some letters. Mr. Vinod suggested reducing these graphics to highlight
the fonts rather than letting the background draw the focus. Exporting frame
animations in Photoshop is quite cumbersome, sometimes requiring a long
waiting time. It would be great if this process could be optimized.
Findings
Overall, I am quite satisfied with the final product. The outcome aligns with
my expectations and is much more interesting than the initial simple version,
especially with the addition of colors. Of course, there is room for
improvement if more time were available. The digital version offers high
controllability and simplicity, making it a good choice for creating
animations.
Further Reading
|
|
| Fig3.1 Appropriateness |
- Defined by understanding the roots and specifics of the design problem.
- Prevents wrong directions and solutions.
- Guides choice of media, materials, scale, expression, color, and texture.
- Gains client approval by solving their problem effectively.
- Transcends style; the solution must be appropriate regardless of style.
- Requires listening to the nature of the design rather than forcing arbitrary constraints.
- Sometimes other rules must be followed for continuity.
- Fundamental principle of design.
- In post-modern times, "appropriation" means borrowing and transforming elements by placing them in different contexts.
|
|
| Fig3.2 Ambiguity |
- Seen as a plurality of meanings, not vagueness.
- Allows designs to be interpreted in multiple, complementary ways.
- Enhances expression and adds depth to the design.
- Valued for enriching the subject.
Caution with Ambiguity
- Must be well-measured to avoid negative outcomes.
- Contradiction can sometimes enhance ambiguity but often indicates lack of control.
- Both ambiguity and contradiction can either enrich or harm a project.
- Use with great caution.
|
|
| Fig3.3 Design is One |
Early Experience
- First worked at Castiglioni Architects in Milano at age 16 as a draftsman.
- The office was involved in diverse design and architecture projects.
- Adolph Loos's dictum: an Architect should design everything "from the spoon to the city."
- Iconic radio, silver flatware, camping furniture, witty stools, industrial bookshelves, houses, museum.
- Later, designed restaurants, trade shows, exhibitions, furniture, and more. Icons of Italian Design.
- Importance of mastering design discipline to design anything.
- Design is a unified discipline applicable to many subjects, beyond any specific style.
- Design requires discipline to be expressed correctly.
- Diversified design practice across various materials and fields.
- Continuous pursuit of opportunities to test interaction between intuition, knowledge, passion, curiosity, desire, and success.

.png)
Comments
Post a Comment