Advanced Typography / Task 2: Key Artwork & Collateral

    


05.09.2022 - 05.23.2022 (Week 6 - Week 9)
Audrey Gracia Djohari / 0348120
Advanced Typography 
Bachelor of Design (Hons) in Creative Media / Taylor’s University
Task 2: Key Artwork & Collateral



JUMP LINKS



LECTURES

WEEK 6:

- AdTypo_3_Context&Creativity

Handwriting

Why is handwriting important in the study of type/typography?
  • We study handwriting because the first mechanically produced letterforms were designed to directly imitate handwriting. Handwriting would become the basis or standard for form, spacing and conventions mechanical type would try and mimic. 

The shape and line of hand-drawn letterforms are influenced by the tools and materials used to make them. Sharpened bones, charcoal sticks, plant stems, brushes, feathers, and steel pens all contributed to the unique characteristics of the letterform. 

Additional factors included the material upon which the forms were written: clay, papyrus, palm leaf, animal skins (vellum and parchment), and paper.

Figure 1.0.0: Evolution of the Latin Alphabet

Cuneiform
c. 3000 BCE
  • Cuneiform, the earliest system of actual writing was used in a number of languages between 34C BCE through the 1st century CE.
  • Its distinctive wedge form was the result of pressing the blunt end of a reed stylus into wet clay tablets.
Figure 1.0.1: Cuneiform
Hieroglyphics
2613-2160 BCE

  • The Egyptian writing system is fused with the art of relief carving. The system was a mixture of both rebus and phonetic characters- the first link to a future alphabetic system. 
Hieroglyphic images have the potential to be used in three different ways: 
  1. As ideograms, to represent the things they actually depict 
  2. As determinatives to show that the signs preceding are meant as phonograms and to indicate the general idea of the word 
  3. As phonograms to represent sounds that "spell out' individual words,
Figure 1.0.2: Ancient Egypt Hieroglyphics Charts

Early Greek
5th C. BCE
  • Built on the Egyptian logo-consonantal system, the Pheonicians developed a phoenetic alphabet consisting of 22 leters.
  • The Phoenicians system then was adopted by the Greeks who added the necessary vowels.
  • Greek was often read in a format known as boustrophedon or "as the ox plows". One row would read left to right and then switch from right to left.
  • These early Greek letters were drawn freehand, and they had no serifs.
  • In time the strokes of theseletter grew thicker, the aperture lessened, and serifs appeared.
  • The new forms, used of inscriptios throughout the Greek empire, served as models for formal lettering in Rome.
  • Roman inscriptional letters were written with flat brush, held at an ng;e like a broad nib pen, then carved into the stone with mallet and chisel.
Figure 1.0.3: Early Greek

Roman Uncials
4th C.
  • By the 4th century Roman letters were becoming more rounded, the curved form allowed for less strokes and could be written faster.
Figure 1.0.4: Roman Uncials

English Half Uncials
8th C.
  • In England, the uncial evolved into a more slanted and condensed form.
  • While English and irish uncials evolved, writing on the Europian continent devolved considerably. Luckily it came in the Carolingian Handwriting Reform.
Figure 1.0.5: English Half Uncials
Emperor Charlemagne
8 C. CE
  • After the fall of the Roman Empire, the end pf a central advanced culture resulted in general illiteracy and breakdown of handwriting into diverse regional styles. 
  • For 300 years the knowledge of writing was kept alive mainly in the remote outposts of relligious cloisters and retreats.
Figure 1.0.6: Emperor Charlemagne Era


Carolingian Minuscule

A court school was established under the direction of Alcuin of York. During Charlemagne's patronage book production increased and language was standardized--pronunciation and spelling as well as writing conventions capitals at the start of a sentence, spaces between words and punctuation. A new script emerged, the Carolingian minuscule. 

The Carolingian minuscule, was used for all legal and literary works to unify communication between the various regions of the expanding European empire 

The Carolingian minuscule was as important a development as the standard Roman capital--for it was this style that became the pattern for the Humanistic writing of the fifteenth century; this latter, in turn was the basis of our lower-case roman type

Black Letter
12-15 C. CE
Figure 1.0.7: Blackletter (Gothic)
  • Gothic was the culminating artistic expression of the middle ages, occuring roghly from 1200–1500.
  • Blackletter is characterized by tight soacing and condensed lettering. Evenly spaced verticals dominated the letterform.

The Italian Renaissance
Figure 1.0.8: Renaissance Letterfoms
  • The renaissance embrace of ancient Greek and Roman culture spurred a creative wave trhough Italian art, architecture and letter form design.
  • Humanist named the newly rediscovered letterforms in Antica. The renaissance analysis of form that was being applied to art and architecture was directed toward letterform — resulting in a more perfect or rationalised letter.

Movable Type 
11 C-14C 

Printing (wood block) had already been practiced in China, Korea and Japan (Dharani Sutra, AD 750) Earliest known printed book (AD 868) is the Diamond Sutra: 16 scroll with the world's first printed illustration. China had attempted use movable type for printing but was unsuccessful due in part to the number of characters and clay) 

In late 14 C. several decades before the earliest printing in Europe, the Koreans establish a foundry to cast movable type in bronze- allowed the dismantling and resetting of text. 

With the creation of their new script Han gul, the Koreans would succeed where the Chinese failed.

To conclude, the introduction of moveable type was introduced in the 1000-1100 CE. This innovation was pioneered in China but achieved in Korea (Diamond Sutra). In the late 1300-1399 CE, several decades before the earliest printing in Europe (Guttenberg's bible 1439), the Koreans establish a foundry to cast movable type in bronze.

Figure 1.0.9: Moveable Type in Korea and China

Why do we talk about Greek influence on Rome, but not Egyptian or Near Eastern influence on Greece? 

Because in the 19th century and the rise of the modern British Empire, it became out of style to credit Africa or Africans with anything of value, and therefore Greece and Rome were elevated over much older, much more influential civilizations, specifically Ancient Egypt, but also less extensive or old civilizations like Mesopotamia, the Indus Valley, China, etc. 

An example of this insidiousness is how the European academic process worked to create the discipline of "Indology". Max Mueller who was central to this, never actually visited India. By viewing historical evidence through colonial lenses they ignorantly postulated ideas that were self serving, i.e. Aryan theory. 

And the same is true for: Classicism, Egyptology, Africanism, Indology and Orientalism

Figure 10.0.10: Middle Eastern Alphabets

Figure 1.0.11: Evolution of Chinese Script

Figure 1.0.12: Oldest Writing found in Indian subcontinent

Figure 1.0.13: Brahmi Script

Figure 1.0.14: Southeast Asia Scripts


"Looking behind gives you context. Looking forward gives you opportunities."
– Vinod J. Nair
WEEK 7:

- AdTypo_4_Designing Type

Why Design Another Typeface?

Xavier Dupré (2007) in the introduction of his typeface Malaga suggested two reasons for designing a typeface: 
  • type design carries a social responsibility so one must continue to improve its legibility. 
  • type design is a form of artistic expression. 
Let us explore the purpose and limitations behind some of the following typefaces.

1) Adrian Frutiger (Univers)

"Adrian Frutiger is a renowned twentieth century Swiss graphic designer. His forte was typeface designing and he is considered responsible for the advancement of typography into digital typography. His valued contribution to typography includes the typeface; Univers and Frutiger"

Figure 1.1.0: Univers & Frutiger by Adrian Frutiger

Frutiger is a sans serif typeface designed by the Swiss type designer Adrian Frutiger in 1968 specifically for the newly built Charles de Gaulle International Airport in France. A more detailed history can be found here.
  • Purpose: "The goal of this new typeface was create a clean, distinctive and legible typeface that is easy to see from both close up and far away. Extremely functional.”
  • Considerations/Limitations: letterforms need to be recognized even in poor light conditions or when the reader was moving quickly past the sign. He tested with unfocused letters to see which letterforms could still be identified
Figure 1.1.1: Adrian Frutiger at The National Institute of Design (NID), India 1964

Adrian Frutiger received many honors, at the university in the “holy city of India”, Varanasi, he felt he had received the highest of honors, without medals or certificates. He had designed a new Devanagari font for modern typesetting and printing processes at the request of the Indian Design Institute, His goal was to simplify the sacred characters, without compromising their ancient calligraphic expression. As Frutiger sat waiting on the cool floor of a high vaulted room in the university, surrounded by religious dignitaries in ceremonial regalia, a group of "wise men" contemplated and discussed his first draft for quite some time. Finally they spoke of their judgment: they "approved" his draft of the new Devanagari and saw no "desecration of something that was, for them, sacred".

2) Matthew Carter (Georgia & Verdana)

Matthew Carter is the son of Harry Carter, Royal Designer for Industry, contemporary British type designer and ultimate craftsman. Carter trained as a punchcutter at Enschedé by Paul Rädisch, responsible for Crosfield's typographic program in the early 1960s, Mergenthaler Linotype's house designer 1965-1981. Many of Carter's fonts were created to address specific technical challenges, for example those posed by early computers… 

Figure 1.1.2: Georgia & Verdana by Matthew Carter

  • Purpose: the font was tuned to be extremely legible even at very small sizes on the screen due in part to the popularity of the internet and electronic devices. 
  • Considerations/limitations: The Verdana fonts exhibit characteristics derived from the pixel rather than the pen, the brush or the chisel. Commonly confused characters, such as the lowercase i j l.
Off screen, Georgia & Verdana have also made appearances in print. In 2010, there was a lot of "frontoversy" when it was announced that IKEA would be changing from Futura to Verdana.  

Figure 1.1.3: Bell Centennial by Matthew Carter

In 1976, AT&T commissioned the design of a new typeface whose sole purpose would be for use in their telephone directories. The design had to solve multiple technical and visual problems related with the existing phonebook typeface, Bell Gothic. The solution, named in honour of the company's 100th anniversary, was Bell Centennial.

3) Edward Johnston (Johnston Sans)

Edward Johnston is the creator of the hugely influential London "Underground" typeface, which would later come to be knows as "Johnston Sans" (1916). He was asked to create a typeface with "bold simplicity" that was truly modern yet rooted in tradition. Johnston's design, completed in 1916, combined classical Roman proportions with humanist warmth. 
  • Purpose: London's Underground railway ordered a new typeface for its posters and signage from the calligrapher Edward Johnston. He handed over details and examples of letter shapes that would set the tone for printed text until the present day. 
  • Consideration/limitation: "Johnston's remit was to unite the London Underground Group, the different companies all using the same rails and tunnels.

Figure 1.1.4: Johnston Sans for London Undergournd Railway by Edward Johnston

*All the advertising, all the signage was all completely different there was this cacophony of letters. Johnston applied the proportions of Roman capital letters to his typeface, so it was rooted in history, rooted in traditional calligraphy. But it has an elegance and a simplicity that absolutely fitted the modern age

4) Eric Gill (Gill Sans)

His former student was perhaps driven by the guilt of seeing the success of his own typeface, Gill Sans, which he admitted had been heavily based on Johnston's work. "I hope you realise that I take every opportunity of proclaiming the fact that what the Monotype people call Gill Sans owes all its goodness to your Underground letter," Eric Gill

Figure 1.1.5: Eric Gill's comment on his typeface success.

General Process of Type Design:

    1. Research

When creating type, we should understand type history, type anatomy and type conventions. We should also know terminologies, side bearing, metrics, hinting It is then important to determine the type's purpose or what it would be used for, what different applications it will be used in such as whether the typeface is for school busses or airport signages, etc. We should also examine existing fonts that are presently being used for inspiration/ideas/reference/context/usage pattern/etc.

    2. Sketching

Some designers sketch their typeface using the traditional tool set (brushes/ pens, ink and paper) then scan them for the purpose of digitization. They are more confident with their hands and have better control using it. 

Some designers sketch their typeface using digital tool sets, such as Wacom directly into a font design software (much quicker, persistent, and consistent) but this can sometimes impede the natural movement of hand strokes. Both methods have their positives and negatives. 

    3. Digitization 

There are professional software that are used in the digitization of typefaces, amongst the leading software are: FontLab and Glyphs App There are designers that also use Adobe Illustrator to design or craft the letterforms and then introduce it into the specialized font apps. This however is frowned upon by the purist. Attention should not only be given to the whole form at this stage but also to the counter form. The readability of the typeface is heavily dependent on it. 

    4. Testing 

Testing is an important component in the design thinking process The results of the testing is part of the process of refining and correcting aspects of the typeface. Prototyping is also part of the testing process and leads to important feedback. Depending on the typeface category (display type/text typ) the readability and legibility of the the typeface becomes an important consideration. However it is not as crucial if the typeface is a display type, where expression of the form takes a little more precedence. 

    5. Deploy 

Even after deploying a completed typeface there are always teething problems that did not come to the fore during the prototyping and testing phases. Thus, the task of revision doesn't end upon deployment. The rigour of the testing is important so that the teething issue remains minor. 

Typeface Construction
Roman Capital: The grid consists of a square, and inside it a circle that just touches the lines of the square in four places. Within the square, there is also a rectangle. This rectangle is three quarters the size of the square and is positioned in the centre of the square. 
Thus, using grids (with circular forms) can facilitate the construction of a letterforms and is a possible method to build/create/design your letterform.

Figure 1.1.6: Construction grid for the Roman Capital using 8x8 cells

Figure 1.1.7: Construction and considerations


Many different forms and constructions must be taken into account when designing a new type. An important visual correction is the extrusion of curved (and protruding) forms past the baseline and cap line. This also applies to vertical alignment between curved and straight forms. 

A visual correction is also needed for the distance between letters. It is not possible to simply place letters next to each other with equal spacing between them. The letters must be altered to a uniform see. 'visual' white space. This means that the white space between the letters should appear the same. This is called ‘fitting' the type. 

The consideration when creating a typeface cannot be covered in its entirety in a single lecture or in a couple of slides. As such I would urge you to read more about it, when time permits or when the need arises here However take note that there are many approaches and considerations other than what has been provided in the link.

Most typefaces come about due to a need or demand. The need/motivation can be intrinsic and extrinsic Intrinsic can be best summed up this way, the designer has an inexplicable need driven by interest to design a typeface, and seeks out a form that comes close to fulfilling a desire. It is also possible that the designer identifies a gap/problem and thus endeavors to solve it through the design of the typeface.

Extrinsic can be summed up in this way the designer has been commissioned or the student-designer has a task to complete that involves designing a typeface.

For a design to be successful the designer needs to be invested in the idea and understand the requirement/limitations/use/stakeholder. Designing a typeface is a labour of love. Only the brave and foolish walk this path for the reward pale in comparison to the work.

"The mindset of a type designer–if clinically studied–might be construed as sick; plagued by an unusual obsession to detail."
– Vinod J. Nair


- AdTypo_5_PerceptionAndOrganisation


Perception is “the way in which something is regarded, understood, or interpreted”. So, is perception what you see—and therefore understand—or what you are manipulated into seeing and understanding?

Perception in typography deals with the visual navigation and interpretation of the reader via contrast, form and organisation of the content. Content can be textual, visual, graphical or in the form of colour. However our focus today is in typography.

So how does contrast work? And what does form entail?

Contrast

Carl Dair on the other hand adds a two more principles into the mix; texture and direction “to make design work and meaning pop out — clearly and unambiguously, and with flair.” via the use of contrast in typography.

Dair posits 7 kinds of contrast (most of which has already been covered by Rudi Reugg albeit using different terms): 1. Size, 2. weight, 3. contrast of form, 4. contrast of structure, 5. contrast of texture, 6. contrast of colour and 7. contrast of direction.

    1) Contrast of Size

A contrast of size provides a point to which the reader’s attention is drawn. For example if you have a big letter and a small letter you will obviously see the big letter first before the small. The most common use of size is in making a title or heading noticeably bigger than the body text.

Figure 1.2.0: Contrast of Size

    2) Contrast of Weight

Weight describes how bold type can stand out in the middle of lighter type of the same style. Other than then using bold, using rules, spot, squares is also provide a “heavy area” for a powerful point of visual attraction or emphasis, therefore not only types of varying weight.

Figure 1.2.1: Contrast of Weight
    3) Contrast of Form

Contrast of form is the distinction between a capital letter and its lowercase equivalent, or a roman letter and its italic variant, condensed and expanded versions of typeface are also included under the contrast of form.

Figure 1.2.2: Contrast of Form


      4) Contrast of Structure

Structure means the different letterforms of different kinds of typefaces. For example, a monoline sans serif and a traditional serif, or an italic and a blackletter.
 
Figure 1.2.3: Contrast of Structure

    5) Contrast of Texture

By putting together the contrasts of size, weight, form, and structure, and applying them to a block of text on a page, you come to the contrast of texture. Texture refers to the way the lines of type look as a whole up close and from a distance. This depends partly on the letterforms themselves and partly on how they’re arranged. 

Figure 1.2.4: Contrast of Texture


    6) Contrast of Direction

Contrast of direction is the opposition between vertical and horizontal, and the angles in between. Turning one word on its side can have a dramatic effect on a layout. Text blocks also have their vertical or horizontal aspects of direction. Mixing wide blocks of long lines with tall columns of short line can also create a contrast.

Figure 1.2.5: Contrast of Direction

    7) Contrast of Colour

The use of color is suggested that a second color is often less emphatic in values than plain black on white. Therefore it is important to give thought to which element needs to be emphasized and to pay attention to the tonal values of the colors that are used.

Figure 1.2.6: Contrast of Colour

Form 

For refers to the overall look and feel of the elements that make up the typographic composition. It is the part that plays a role in visual impact and first impressions. A good form in typography tends to be visually intriguing to the eye; it leads the eye from point to point, it entertains the mind and is most often memorable.

Originating from the Greek words “typos” (form) and “graphis” (writing), typography means to write in accordance with form. Typography can be seen as having two functions:
  1. to represent a concept 
  2. to do so in a visual form. 
Displaying type as a form provides a sense of letterforms’ unique characteristics and abstract presentation.
Figure 1.2.7: Form

The interplay of meaning and form brings a balanced harmony both in terms of function and expression.

When a typeface is perceived as a form, it no longer reads as a letter because it has been manipulated by distortion, texture, enlargement, and has been extruded into a space.

Organisation (Gestalt) 

Gestalt is a german word meaning the way a thing has been “placed” or “put together”. Gestalt Psychology is an attempt to understand the laws behind the ability to acquire and maintain meaningful perceptions. 

The Gestalt psychologists, especially Max Wertheimer, developed a number of “laws” that predict how perceptual grouping occurs under a variety of circumstances (Wertheimer, 1923/1938). Technically, in sciences, laws are predictions that are true. In reality, these laws are better classified as principles

Gestalt theory emphasizes that the whole of anything is greater than its parts—this is based on the idea that we experience things as unified whole: Instead of breaking down thoughts and behavior to their smallest elements, the gestalt psychologists believed that you must look at the whole of experience.

Therefore in design (read: typographic layouts), the components/ elements that make up the design is only as good as its overall visual form. While each component may be functional at an elemental level, the sum of its parts is not greater than the whole or the overall form.
  • Gestalt: Perceptual Organisation / Groupings 
Law of Similarity
Law of Proximity
Law of Closure
Law of Continuation
Law of Symetry
Law of Simplicity (Praganz)

Figure 1.2.8: Gestalt Principles

  • The Law of Similarity is the gestalt grouping law that states that elements that are similar to each other tend to be perceived as a unified group. Similarity can refer to any number of features, including color, orientation, size, or indeed motion. 
  • The Law of Proximity is the gestalt grouping law that states elements that are close together tend to be perceived as a unified group. This straightforward law states that items close to each other tend to be grouped together, whereas items further apart are less likely to be grouped together.
  • The Law of Closure refers to the mind’s tendency to see complete figures or forms even if a picture is incomplete, partially hidden by other objects, or if part of the information needed to make a complete picture in our minds is missing 
  • Law of (Good) Continuation holds that humans tend to perceive each of two or more objects as different, singular, and uninterrupted object even when they intersect. The alignment of the objects or forms plays a major role for this principle to take effect
  • The Law of Symmetry & Law of Praganz. 

The organization of information  and how it is perceived should be considered by designers as a social responsibility — crucial for effective communication, transfer of knowledge and for under-standing to occur. 
— Vinod J. Nair


INSTRUCTION



TASK 2

- Task 2A: Key Artwork

Instruction

What is a Key Artwork? In the context of this task, the key artwork behaves like a logo but is also an artwork. As a logo, it is used to identify an event/person but it is also used as artwork, adorned on a poster (collateral) or disassembled into constituent shapes to form vibrant patterns that continue to maintain its visual identity and relationship with the key artwork from which it is derived from.

For this task, you can use the initial letters of your name or your full name, i.e., Onn Aditya Hussein, OAH, OA. Explore and compose as many permutations and combinations of these initials. The final key artwork must be an elegant solution, not complicated or confusing that leads to a functional and communicable key artwork. This key artwork will subsequently be used in Task 2(B) on various collateral. Task 2(A) and 2(B) will require you to explore the boundaries of communication using the knowledge gained from all modules notwithstanding this semester’s exercises of Typographic Systems and Type & Play. Synthesize the knowledge and create a key artwork that excites you and is memorable.


Visual Research

When I first saw this typography design on Instagram months ago, I immediately clicked 'Saved'. The design had me looking quite long, examining how the designer managed to create a well balanced and genius outcome. He managed to create 2 words in 1 logo and they use each others' strokes to create letters. I was really intrigued to try making my version.

Figure 2.0 & 2.1: Graphic design by @yvm_design


Ideation & Sketches

I came up with 6 sketches in total. My first sketch (sketch 1, 2, 3) is leaning more towards typeface design. It has a bold feature, dull and sharp edges and it covers most of the space. I feel like this style is unique and can drag viewers' eyes towards it. I wasn't very sure what occupation it represents. But when I stacked the 3 letters, I realized it looks like a coffee grinder.

Figure 2.3: Sketch #1

The second (sketch 4, 5) sketches were inspired by @yvm_design's typography design. I made my own version with the letters 'AGD' at the top and 'AGD' at the bottom. And these are my sketches. The main purpose is to be able to read the letters upside down.

When I look closely, it looks so much like pipes. So I decided to choose plumbing as the occupation for this key artwork.

Figure 2.4: Sketch #2

My third sketch (sketch 6) is an experiment where I put the 3 letters in a radial form. I noticed all of them have bowls and it might look cute when I position them like grapes.
Figure 2.5: Sketch #3


Digitalization

#1 Outcome
  • Occupation: Coffee Grinder & Doser
  • Letter: A G D
Figure 2.6: #1 Outcome

Figure 2.7: #1 Outcome Exploration



#2 Outcome
  • Occupation: Pipe Shop (Plumber)
  • Letter: A G D
Figure 2.8: #2 Outcome, black & white

Figure 2.9: #2 Outcome, black & yellow

Figure 2.10: #2 Outcome, black & blue

Figure 2.11: #2 Outcome, 3D Side

Figure 2.12:  #2 Outcome, 3D Front

I choose light blue as the artwork's color because it symbolizes water which is the main thing pipes carry. Blue is also the color that plumbers often use.

After looking at the outcomes, I decided to use the #2 outcome as the key artwork. I feel like the plumber concept is more unique and the typo really suites the occupation. I also like the 3D effect I applied.


Task 2B: Collateral

Instruction

You are tasked to design a poster, an animated invite, and three other collateral items of your choosing, using the key artwork developed in Task 2(A). Students will work on the poster first and fine-tune the outcomes before going on to the animated invite and other collateral material. The graphic output must
result from in-depth exploration and must communicate both visually and textually the desired message and mood set by the key artwork and its function. 

Collateral: once the key artwork has been developed, the artwork is then expanded into several iterations that are then applied across the various collateral (applications/promotional material): Poster (Static 50 x 70cm), Animated Invite (800/1024 px, height, and width), and 3 relevant collateral of your choosing (T-Shirt, Sticker, Tote bag, etc.)

Poster

I used the same color palette as the key artwork for the poster. I wanted to emphasize the key artwork so I put it in the middle with the biggest size compared to other elements. 

Figure 3.0: Poster Editing Process in AI


Figure 3.1 - 3.3: Poster Exploration

  
Figure 3.4 - 3.6: Poster Exploration, 3D

However, after receiving feedbacks from Mr. Vinod, I realized that I can improve the backgrounf and the information placement. I reedit them and these are the revised versions:


Figure 3.7-3.9: Final Posters (REVISED), 30.05.2022

Animated Invite

Because this is a plumbing business, I had the idea of making the animated invite suits the theme. I wanted to animate water flowing into the tubes, and slowly when the water has filled the tubes, words and pieces of information started to be visible. This is the whole idea of the animation.

Figure 3.10: Process in After Effects
, 29.05.2022

It took me about 5 hours to animate this invite. And these are the tools I used:
  • Shape Layer
  • Trim Paths
  • Position
  • Scale
  • Rotation
  • Opacity

Figure 3.11: Final Animated Invite, GIF, 30.05.2022

Figure 3.12: Final Animated Invite, Youtube, 30.05.2022


Collaterals
Figure 3.13: Process in Adobe Photoshop, 30.05.2022

For the collaterals, I imagined things that will be needed in a Plumber Business. I decided to make 3 outcomes:
  1. Wall Sign
  2. Business Card
  3. T-Shirt
I used Adobe Photoshop to edit the collaterals to make them look realistic.

Figure 3.14: Wall Sign, 23.05.2022

Figure 3.15 - 3.15: Bussiness Card Design, 23.05.2022

Figure 3.16: Bussiness Card, 23.05.2022

Figure 3.17: T-shirt, 23.05.2022

Final Outcome

1) Key Artwork
Figure 4.0: Final Key Artwork B&W, 23.05.2022

Figure 4.1: Final Key Artwork Colored (REVISED), 23.05.2022

2) Animated Invite
Figure 4.2: Final Animated Invite, GIF, 30.05.2022

Figure 4.3: Final Animated Invite, Youtube, 30.05.2022

3) Poster

Figure 4.4: Final Posters (REVISED), 30.05.2022

4) Collaterals
Figure 4.5: T-shirt, 23.05.2022

Figure 4.6: Wall Sign, 23.05.2022

Figure 4.7 & 4.8: Bussiness Card  (REVISED), 30.05.2022

Figure 4.9: Final Outcome in PDF  (REVISED), 30.05.2022



FEEDBACK

WEEK 6:

*Raya Holiday*

WEEK 7:

Specific Feedback
(Key Artwork) The letter D on the 1st sketch doesn't look like it, it could be better. The first sketch reminds mr. Vinod of an anime typeface. Mr. Vinod said my second sketch has a balanced form and it's up to me whether to use the second or first sketch.

General Feedback
Think about the occupations you want to represent. Do not use yellow because it won’t stand out on white background. The choice of color must be solid and stand on a white background. Do not use too many colors. Task 2A & 2B must be posted in the same blog.

WEEK 8:

*Independent Learning Week*

WEEK 9:

Specific Feedback
(Key Artwork) Mr. Vinod suggested I change the background color of the poster so the tubes don't look like they're floating in space. He also said better not to put the information on the tubes.

General Feedback
(Key Artwork) Do not crop the key artwork. Use the key artwork as the center piece of the poster, then design the poster around the key artwork.


REFLECTION


Experience
I enjoyed the process of Task 2A and 2B. I like designing logos and the experimentation I did was fun. I feel like I got out of my comfort zone and managed to design a logo in a way I never did before. I also experimented with 3D tool in AI which was so cool. However, I got quite exhausted when designing the poster. It took me some time to figure out the ideas but I still feel something isn't right. But I like the other collateral outcomes, especially the animated invite.

Observation
I observed that choosing the right color for typography is not easy at all. I struggled choosing the background color for the poster. I eventually used a color palette app to help me find a suitable scheme.  I also observed that all this time I never designed a logo without graphical elements, this is my first time relying solely to type. It was fun though, and I think I managed to do it.

Findings
I found that collaterals are refreshing. I was quites stressful designing something from nothing, so when I did the collaterals with all the color palettes and design elements ready, It was quite enjoyable (except for the poster because I had difficulties arranging the elements). Creating mock-ups for the t-shirt, wall sign and business card was cool.



FURTHER READING

- Typography Essentials (2019)

Figure 5.0: Typography Essentials by Ina Saltz

Reference:
Saltz, I (2019). Typography Essentials Revised and Updated :
100 Design Principles for Working with Type. Edition: Revised
and updated. Beverly, MA: Rockport Publishers.

Chapter 1: Using Letter As Form

A shape that may serve as an illustration, as an icon, as a vessel, or as a graphic focal point, apart from its meaning as an alphabet­ic unit. Especially when used at very large sizes, the extreme proportions ofletterforms can have exceptional impact-this technique has been exploited very effectively by many suc­cessful designers. 

Letters can be expressive when used alone, as a simple silhouette, as an outline, or as a container for image, texture, or pattern. The beauty and power of the individual form may also be used partially: or a shape that is sliced and diced, cropped, or reversed horizontally or vertically. Because it is a letterform, it has a built-in relationship with any typeface that accompanies it. Its inherent integration unifies the design of the whole piece. 

Figure 5.1: Chapter 1

Figure 5.2: Chapter 1


Chapter 11: Considering The Background Contrast

The difference between foreground and background totality is a key factor in legibility. The highest degree of contrast exists between black and white. Studies have shown that, while black type on a white back­ground is highly legible, the same quantity of white type on a black background is harder to read. In large quanti­ties, especially at text type sizes, there is a kind of "halo" or sparkle effect that impedes legibility and is actually uncomfortable to the eye. 

As type color and background color come closer together in hue, saturation, and density, legibility is reduced. At a certain point where there is not enough contrast (and this point is a moving target, because it depends on many other factors, including letter weight, set width, stroke width, slope, and point size), legibility may be significantly im­paired. The amount of text is a factor (a few lines might be less of a problem), the length of the lines or "measure" may be a factor, and the light conditions and paper surface may also be factors.

Figure 5.3: Chapter 11



Comments