Jost Huchuli - Detail in Typography

Key Information

• Modern typography is primarily based on theories from the 20s and 30s 
• Mallarme and Rimbaud in the 19th century and Apollinaire in the early 20th century that generated new ideas and understanding paving away creating new possibilities for typography to inherit.
• The gird is used as an ordering system 
• Constructive design is a capable analysis and reproduction that can influence the taste on society and how we conceive form and colour 
• Constructivist design means the conversion of design laws into practical solution. 
• Working with the grid system - submitting to laws of universal validity 
• All visual creative work is a manifestation of the character of the designer.
• The grid layout divides a two dimensional space into smaller fields or a three dimensional space. The fields may be the same or varying sizes.  However they must correspond in depth to a specific number of lines of text and width of the fields is identical with the width of columns.
• Depths and widths can be indicated in typographic measures e.g. by points 
• The grid is mainly used to determine the constant dimensions of space. 
• There are no limits to the number of grid divisions 
• The rule: “The fewer the differences in the size of illustrations, the quieter the impression created by the design. As a controlling system the grid makes it easier to give the surface or space rational organisation.”
• The grid system requires the designer to come to terms with the problem at hand and analyse it for solutions. 
• If text and imagery are laid out systematically the priorities stand out more clearly 
• Macrotypography - the typographic layout is concerned with the format of printed matter e.g. size and positions of columns of type and illustration 
• Detail typography - concerned with individual components e.g. letters and letter spacing.
• The reading process - we read with our eyes jerkily moving along lines through brief movements known as saccades, and alternate within fixed time periods lasting between 0.2-0.4 seconds. 
• A line can be read by a series of saccades followed by a large saccade as the eye jumps back to the start to read the next line. 
• A more experienced reader will have shorter fixed periods and bigger saccades.
• Visual and linguistic structure play a role in the eye’s movements during reading.
• Letters have grown over time adapting to writing techniques and tools such as production techniques and styles.
• Changes have mostly occurred over long periods of time unnoticed.
• Typography is seen in two ways the perceived succession of letters, or the  act of reading itself and as visual perception. 
• Typefaces must meet demands and fulfil functions, therefore a typeface can not be defined as good or bad and likewise useful or useless. 
• Some typefaces are used purely for decorative purposes however types that are more difficult to read can catch the attention of a reader or observer e.g to shock or provoke. 
• Typefaces with designs that are too extravagant may be easily forgotten like special types designed by German Type Artists before and after WW1
• The viewers eye must not be distracted by an unfamiliar for and the whole alphabet must have the same style but be clearly differentiated.
• Lower and Uppercase must combine to create harmonious type with dynamic characteristics such as the flow of handwritten forms.
• The right proportions of capital and lowercase also ensures legibility and they should not deviate far from their archetype.
• Type both lower and uppercase must have a good relationship between both size and weight.
• If legibility of a typeface was solely dependent on differentiation in design such as the upper half of an x height this would put most simple sans serif faces eg. ‘a’ at a disadvantage to other classic typefaces. 
• The basic structure of capitals is static and lapidary whereas lowercase letters are dynamic.
• If the upper half of an x height is removed it is difficult to read the text whereas if the lower half is removed it is slightly more legible even with parts of each character missing we can still translate or read text subconsciously.
• Upper halves of a, q and g of sans serif face (Futura Book) are identical this shows how letters cannot always be differentiated in the absence of lower halves of characters.
• Small type sizer need to be proportionally wider than larger sizes essential aspect for optimum legibility.
• Kerning can enable letters to be spaced more tightly or loosely.
• Italics obvious characteristic can be recognised at a glance the slight slope of the type. Italics need less space due to leaner proportions.
• A few sans serif fonts have ‘false’ italics  e.g. Linotype Univers 430.
• Text in capitals is actually more difficult to read and requires a large amount of space.
• Clear differentiate in design of ascenders and descenders is important.
• The positioning of a letter in its own space is known as fitting although some locations require more or less space than provided by standard setting.
• Rule for word spacing “as much as necessary as little as possible.” 
• Word spaces after abbreviations points generally appear too large whereas reduced spaces keep words better grouped.
• Colons between characters may appear too close if they are un-spaced.
• The hyphen (-) used to divide two broken words 
• Dash used to link phrases 
• En dash indicates spans of distance or time 
• x can also be recognised as a multiplication sign.
• Numeral - graphic sign that represents a number 
• “Typography can be defined as the art of rightly disposing printing material in accordance with specific purpose; arranging letters, distributing space and controlling type to aid the maximum of the reader’s comprehension of the text.”

Signs and Symbols: Their Design and Meaning - Adrien Frutiger

Signs & Symbols 

Content 

• The Elements of a Sign
• The Basic Signs 
• Joining Signs Together 
• The Sign in Ornaments 
• Signs of Dualism
• The Solid
• The Stimulation of Volume 
• The Diversity of Appearance 
• Attempt at a visual synthesis 
• Speech-Fixing Signs 
• From Thought to Picture
• Speech Fixing 
• The Graphic Wealth of Pictograms
• The  World’s Alphabets 
• The ABC of the Western World 
• Development of Form through Writing and Printing Techniques 
• Manipulated Letterforms 
• Text Type and it’s Legibility 
• Numerical Signs 
• Punctuation Signs 
• Sign, Symbol, Emblem, Signal 
• The Graphic Wealth of Figurative Symbols 
• Abstract Symbols 
• Signs of Pseudoscience and Magic 
• Signature Signs 
• Signs of Community 
• Trademarks 
• Technical and Scientific Signs

“Words or speech, written or spoken, do not appear to play any part

at all in the mechanism of my thought processes. The basic psychic

elements of thought are certain signs and more or less clear

pictures, which can be reproduced and combined "to order."

ALBERT EINSTEIN

Research Reading of Signs and Symbols: Their Design and Meaning - Adrien Frutiger 

Key Information

• The production. Of an ordered form is easier than making a disorder or non-form, due to our sub-conscious
• Memory creates a pictorial impression
• Recognition is spontaneous and displacement causes involuntary frustration to a viewer.
• Light is recognisable only with shadow
• The dot is an abstract concept, seldom appears as an individual element generally taking meaning from a relationship with another sign for example the dot on an ‘I’ 
• A viewer draws an imaginary line from one dot to another 
• The line is a linear expression 
• As humans move on a horizontal plane - their optical capacity is mainly directly laterally
• Horizontal and vertical movements can produce different subconscious reactions
• Contrasting certainty and precision is recognised with a vertical line
• Oblique line, cannot be grasped with certainty except maybe in a 45 degree angle that can be judged by eye as through precision as it is exactly halfway between a horizontal and vertical line.
• A circle gives the feeling of precision and presence of an invisible centre. 
• Vertical - Drawn top to bottom 
• Horizontal - Drawn left to right 
• Two parallel lines don’t make a sign but express order of counting. 
• Signs or elements close to each other are seen together as a whole, in contrast to wider spaces that are seen as separate
• Equal intervals in a row of vertical lines allows the space between ‘bars’ to be seen as a continuous background but as soon as one of the lines becomes closer the uniformity disappears 
• Within a space viewers will regard themselves as inside or outside  
• In modern typeface production the outlines of type are digital meaning the form Is divided into coordination points 
• Feelings are addressed in a stronger way in circles over other forms such as triangle square or cross
• An arrow or when two oblique lines come together to create an angle the expression of direction or movement is produced in some shape or form.
• The cross is most abstract and invisible but precise at the same time so it has a wide usage so much so that mathematicians, architects, geographers and geologists make constant use of it as it is a good way to indicate an exact point 
• Combing signs creates mental, philosophical or ‘alchemical’ impression this is apart from a a signs graphical aspects
• The space between signs is an important aspect of typeface quality
• Space must be specified so that reading can proceed undisturbed in a printed word or sentence.
• Crossovers of shapes can create new geometric forms 
• A lower shape within a shape gives the impression of point of rest 
• Clear associations between different forms immediately stimulate create creative impulse 
• The power of expression can divide a shape into sections with different meanings for example geographical 
• With some signs overlapping they can also become more recognisable while the association changes meaning 
• By limitation and strict stylisation by a basic figure the concept of ‘seeking a form’ already exists in the subconscious is further strengthened.
• Double meaning awakens interest
• The sign in its capacity as a ‘single statement’ forms the basis of a pattern remains present and recognisable within it 
• The sign assembled to make an ornament hides itself as a unit and becomes part of a structure.
• The individual sign is often hardly recognisable but the mysterious presence encourages a search for meaning or its statement 
• Dualism - the platonic myth of androgyne suggests each of us is the complementary half of being that has been separated into two halves. 
• In two dimensional creation of graphic forms the line represents the simplest and purest means of expression but at the same time the most mobile and versatile.
• You can create a solid by developing a line by the dimension and width 
• When structure of alignment gets lost in a solid area the latter becomes condensed, fully covering the surface of a background 
• A simple line is enough to illustrate defining lengths of stroke and achieving a uniform proportion of length or thickness. 
• We can describe a thin line as a thread - a stroke of schematic character where we do not take thickness into account.
• Second degree thickness - a bar, rod or stem meaning a stroke is no longer an abstract expression but can be seen as a slender body 
• A black and white contrast appears between black framework and white interior 
• Third degree stroke - a beam known as the normal thickness for printing characters we have become accustomed to the proportional relation with intervening white space 
• Strokes one degree thicker are known as ‘trunk’ 
• Pillar can be defined as an expression of massive, supporting elements, corresponding to the thickness of bold printing types 
• Asymmetrically swelling or shrinking a line can lead to endless variations within form
• The thickness of a bar can also make the interior of a shape appear brighter than the whiteness of the paper on the exterior of the sign 
• Any for of positive sign set on a white background has more independent expression than that would appear on a negative or black background
• An outer shape makes a different statement in comparison to the inner one 
• Another way of expressing a sign in negative form includes using a second positive 
• Displacement where thicknesses differ can produce a relief effect 
• Varying the brightness of an interior shape weakens the contrast 
• Kippfigur (oscillating figure) in gestalt psychology involves the change from one representation to another but is dependant on these  viewers power of imagination
• Chessboard pattern - catches the eye strongly. Black and white are opposing on neutral territory structurally and procedurally arranged. Through viewing we can sense a graphic vibration caused by the constantly alternating black and white elements.  Noticing crossing points I.e. black points meet but after long observation and contemplation this meeting of points can cause optical fatigue. This very aggressive visual effect of visual phenomenon is often used in present or everyday graphics. Used in the right context in small amounts however can provide visual stimulus but using in excess can become ‘indigestible’        
• People firstly react to positioning on horizontal-vertical axis but need to overcome resistance before taking into account oblique positioning 
• Interlacing band is an important element in ornamental painting and sculpture 
• “Gordian knot” is a form of expression found in runic inscriptions, on the capitals of Roman columns and in Oriental painting
• Any two elements line or solid can be joined together in either of two ways, by means of clear junction or by ‘welding’ this includes with the aid of simulated connection which is only apparent. 
• Latter type is purely optical and relies on proximity which consists of juxtaposition of two elements with a minimum white space separating them 
• This arrangement can highlight how a figure assembled can easily be broken down into basic elements and also that the gaps in strokes mainly at crossover points can make one stroke pass over the other in v viewer’s imagination
• Perspective - the nature of sign is two dimensional, lacking a concept of ‘volume’ Pictograms are almost always drawn as silhouettes and the effect of volume is an exception 
• New possibilities given by perspective extension of a linear expression
• Perspective easily leads to the use of black-white contrast to emphasise the effect of a strong relief 
• Orientation allows the view to imagine direction 
• Illumination vertically from below gives an surreal or theatrically effect and is often seen to be used in film production. 
• Projecting a thrown shadow onto an imaginary background can also be used which takes on perspective form
• Sometimes unusual perspectives or tricks are used to irritate viewers 
• The human eye cannot grasp a figure a purely objective or purely geometric 
• The evolution of signs show how they have undergone many changes, stylizations and simplifications over time 
• The materials used determine the production of suitable tools to enable a formation to be drawn and recorded
• In ancient Egypt hieroglyphics were chiseled into stone and later written in Papyrus. In Mesopotamia signs were stamped into clay tablets whereas in south eastern regions writing was scratched onto long, dry palm leaves.
• Engraving allowed signs o be perceived not just optically but also by touching with the hand 
• Drawing on a surface in two dimensions or painting on lighter materials such as leaves extended and sped up the possibilities of expression. Determining the growth of communication
• Techniques for electronic recording have developed so much that a graphic artist can now directly work out a design on screen 
• Handicrafts also come into play in the expression of sign
• Strengthening stroke endings are used to enrich expression of sign bearing unique symbolism often shown through an array of cross forms  
• The letters of the alphabet are placed on a baseline, like a floor giving them horizontal endings at their base similar to feet although on letterforms are known as serifs 
• Opposing, in India scripts of the Sanskrit language have characters hanging above as though from a line 
• Three factors influenced and determine pictorial expression, the right choice of tool, available materials and the limitations of time 
• The image of a picture comes from the contrast between drawing and background 
• Black and white is the most impressive two dimensional contrast. The dividing line between two elements produces a sharp edge giving the form of absolute expression
• The greatest antithesis between background and sign can be achieved by the use of complementary colours 
• Half tones - produced by screening can be seen as an assembly of many dots making the eye see any area of grey making it possible to reproduce grey-tone pictures using all shades of modelling and create the effect of depth and tone 
• Contrast can also be created by alterations in the structure of surfaces 
• Picture quality is determined by the demands a picture must fulfil with regard to a reader or viewer or may be aimed to stimulate contemplations or directly aesthetic criteria 
• Drawing and reproduction of graphic statements takes great care as they are direct means of communication to object and create understanding 

“ O mon ame! le poeme n'est point fait de ces lettres que je plante comme des clous, mais du blanc qui reste sur le papier.” 

“ Oh my soul! The poem is not made of these letters which I set in like nails, but of the white which is left on the paper.”

PAUL CLAUDEL

• Prototypes are a development of intelligence, subject of research and exercise fascination 
• Before writing there was speech a system of communication that continues to develop over everlasting years 
• Original language did not only consist of sounds but also many gestures, contacts etc. even perhaps body language 
• The development of “graphic” recording of expressed though lies within a two track development of spoken sound and descriptive gestures 
• In early times with the aid of signs known as pictograms people made schematic representations of objects dates and actions. However writing in the proper sense did not exist until the movement of arranging signs horizontally and vertically in rows. Showing how alignments started to appear and through repeated use were soon developed into script cultures.
• Pictorial signs were the origin of all scripts in existence through natural development, with two categories scripts remaining pictorial and alphabetical scripts.
• Remaining pictorial defines all scripts which have undergone no revolutionary change even over years but kept their pictorial stage even though stylised.
• Alphabetical scripts includes original scripts whose original picture has been changed over time to phonetic signs reducing strokes to extreme simplification.
• Certain figures may be within our subconscious, from birth or inherited “archetypes” or common symbolic interpretation
• Pictogram’s can be changed into an ideogram through development 
• Important rules or main processes and developments can be defined as determinatives 
• Phonogram a picture of a bee and a leaf to spell ‘belief’ so syllable signs are made from a picture and idea signs. Pronunciation was permanently fixed for writing.
• Sumerian Pictograms are strongly stylised drawings that represent complete objects or parts shown in detail.
• Fascinated by the power of nature Egyptians tried to conjure them by the use of signs such as cult of the sun and death the richer people became the treasury of hiero-glyphs or sacred carvings.
• Egyptian script is seen as the most important basis of the Western alphabet. 
• In Cretan inscriptions ideograms and symbolic signs could be both used on the same line explaining why definitive deciphering has not yet been achieved. 
• Cretan script radiates mental power to the uninitiated to leave no doubt about island cultural value in relation to the mainland.
• Pictograms were adapted for the fixing of syllables and single letters but there was no simplification to ease writing whereas other scripts produced alphabetical characters 
• Inscriptional use of Hethitic died out around 700B.C.
• Runic scripts were formed some time during the first millennium substantially formed by basic material such as wood. They consist mainly of cross-grain vertical and oblique strokes. 
• Chinese scripts, the I-ching can be expressed with eight basic trigrams pairing them to make hexagrams or six-line signs. This produces sixty four signs of wisdom.
• The Aztecs used object like signs as simple pictograms or in rebus like combinations. The rebus assumes a knowledge of the Aztec language 
• Phoenician consonantal signs are today recognised as prototypes of all alphabetically scripts existing around the turn of the first millenium 
• Scripts are always among the most important carriers of culture, trade, law, science and religion the main user of script and priests have monopolised the art of writing as a sacred activity meaning corresponding religion can be broadly associated with script culture. 
• Developments of speech fixing took place in Western Europe with the formation of Latin and Greek alphabets.
• Capitals to small letters the main transition was from the straight lines in capitals to curves in lowercase e.g. A to a E to e.
• Appearance of letters has transformed in printing and writing from stiff roman capitals to a flowing minuscule.
• In the 15th and 16th century calligraphy yielded a huge part of its influence on letter formation to Gutenberg’s newly invented technique of printing. 
• Letterpress is the technique of raised printing surface invented by Gutenberg were letterforms are cut in relief on the polished end of a steel punch.
• Gravure or intaglio printing uses the technique of copperplate engraving 
• Lithography also uses engraving on a polished slab of limestone.
• The structural comparison of architecture and script makes illustrating the mentality of an era possible clearer and experiences more intensive spatial terms.
• From architecture we learn graphic expression can be composed from two elements the material and the spacial element.
• With greater imagination a comparison of concave letter strokes brings convex “feminine” forms into appearance between “masculine” elements 
• The normal visual impression of a script appear like sculptural figures with character determining rhythm and style. 
• Script or typeface does not consist primarily of individual forms but a combination of signs 
• Uniformity is created by using grids 
• Designing an alphabet - degree of relationship between letter signs must be clearly defined.
• A good text or type face lies in fine coordination of letters to form a community rich in contrast while retaining family likeness 
• Variations and extensions include a letterform remaining recognisable and only the dimensions of a character altered or manipulated. E.g. proportions
• Deviation is the process of decoration or transformation of letters into pictorial form
• Width - defines definite proportions 
• Weight - defines the stroke width 
• Slope - the static expression or linear assembly of lines
• These are three possible means of expression within typographic form.
• Modern typography is no longer dedicated to the domestic book and reaches out into all fields of human activity 
• Antiques - “old-fashioned” has seen an appreciation throughout typography and history.
• Figurative alphabets have impacted many other aspects of design such as illustration
• Environmental inscription - no longer just printed matter but typefaces have also become part of the general environment 
• Expression of type can be found at the boundary of legibility
• Abbreviations - using initial letters or word groupings as a linguistic summary
• Type is a worldwide medium of communication due to a greater spread of knowledge
• Letters of the alphabet are only building blocks of language
• Letterforms are continuously shaped and refined 
• Roman numerals also rely on signs of the alphabet 
• Punctuation signs and symbols also work in accordance to a typeface 
• Currency signs must also be created to match a type style 
• Directional signs are sufficient with usage allowing a required destination to be met 
• Pictures and stylised symbols can be recognised on a worldwide scale by many cultures.
• A diagram enables us to visually break down or analyse an object or subject.
• Symbolic - the viewer infers an underlying meaning and looks for interpretation.
• Parts of the human body can have deep symbolic content 
• The cross can be represented as the symbol of the Christian faith.
• The symmetry of a shape such as the cross allows many styles for ornamentation
• The day star or sun has symbolic representation for many cultures 
• Star signs are described as mysterious mediators from distant worlds 
• Geometrical figures often have coded symbolism
• Chemical processes and procedures can be translated into symbols 
• Some modern logotypes are based on concrete and abstract figures 
• Letters are also elements that can be a base of a logotype.
• Pure abstraction can lead to unwanted similarities in logotypes. 

Further Research - Modular Typography Muir McNeil & Roman Numerals

Modular typography 

I researched modular typography as it is similar to the concept or rule behind my typeface. My typeface followed the rule of only using 5 shapes to create the form of each letter. Modular typography can be defined as an alphabet constructed from a limited number of shapes. 

Muir McNeil 

A Graphic Design studio founded in 2010 Muirs' Activities focused on exploring parameters design systems generating visual communication solutions. Paul McNeil is an experienced designer, with knowledge and experience in broth brand and corporate communications. Alongside currently working as a Senior lecturer in Typography. 

Roman numerals 

Represents the numeric system which originates from Ancient Rome. Remaining the way of writing numbers throughout Europe for a vast amount of time or into the late Middle Ages. The numbers are made from a combining letters from the Latin alphabet. The numerals are used even still today and are commonly also seen on modern day products and or technology such as watches. There is a basic pattern with numerals the symbols, I, V and X are used to represent the numbers 1, 5, and 10 as tally marks or scores. In context Roman numerals also have specific disciplines giving the numerals further context and meaning. For example in chemistry the Roman numerals often are used to denote groups of the periodic table or naming phases of polymorphic crystals I.e. ice. In computing numerals are also used in identifiers that are limited to alphabetic characters by constraints of a programming language. Numerals can also be seen in military unit designation, and often used to distinguish between units and different levels without confusion. 

The number 5 is represented by the ‘V’ Roman numeral.  

Roman numerals 1-10 shown below

I, II, III, IIII, V, VI, VII, VIII, VIIII, X

Quintuplicate Critique

Development of Ideas Post Critique

 

Following the feedback received I identified the best idea for further development. This also helped me to see which of my designs worked best both as a typeface and in context relating to the word. The concept or rule behind this typeface is you may only use five squares (shapes) in the construction of each letter. 

For further development I experimented with weighting, fill and negative space, shapes and sizes alone and within grid form (within the square.)  The varied weightings design goes from 0.5 - 4 stroke size. I wanted each square to have increased weighting in a basic order i.e. 1,2,3,4. The second shows how the typeface would work with a fill although it is block colour, I actually think it is more difficult to read as well as taking away from the overall aesthetics of the design. The next design shows the first stage of the design before development. The following shows my experiment of shapes within a 'grid' or the square shape that creates the letterform. I really like the bolder impact this gave to the design. Finally the last design shows how the same idea can be created using different shapes e.g. circles. The other design shows before and after I altered the shapes to decrease or increase in size which also works well but becomes slightly more difficult to read. 

Using Adobe Illustrator CC

Differences in Photoshop & Illustrator 

Adobe Illustrator 

Vector Shapes 
Resolution Independent 
Infinitely Scalable 

Adobe Photoshop 

Pixel based 
Resolution Dependent 
Size must be specified 

- In Illustrator vector files maintain crisp look and edge during resizing 
- Vectors can be resized without losing quality 
- Made of vectors and anchors 

Appropriate Resolution

300ppi for design for print & 72ppi design for screen 

Creating an art board allows you to create a document to size. 

Basic Shapes  

- Use the shapes tool - click and draw to size, can be sized by width and height by clicking on the shape

- Holding down shift the shape contains its original shape without shift the shape becomes distorted. 

- Using the pen tool and filling in anchor points also enables you to create shapes 

- If you don't want to complete a path press 'esc' this ends the path. 

To place a Photoshop file in Illustrator - click File Place
Cmd and 'R" - show rulers shortcut  

Click Layers option making the first image a template layer then work on Layer 2.
Pencil tool traces fine details. 
Smooth tool creates smoother edges to a shape.

Skills used in "Totoro" Exercise 
- Placing Photoshop Image 
- Using Template Layers
- Using Guides 
- Using Layers ( new layers, moving objects to different layers, arranging objects - front->back)
- Using the Reflect tool 
- Joining Anchor Points  
- Duplicating using Alt & Drag 
- Using the pencil tool
- Grouping Objects 
- Using the Space bar to reposition an object and anchor point
- Using an Anchor Point to set centre of transformation
- Applying variable width to strokes (using presets and manually using variable width tool)
- Expanding appearance
- Setting Path and corner options 


Example image I created in Illustrator :

Quintuplicate Initial Ideas

Initial Ideas

I designed my own letterforms to create my own unique typefaces. I then formed an alphabet using tools in Adobe Illustrator CC. Afterwards I used the letterforms I created to spell out the word "quintuplicate" again the meaning behind this is multiply by 5. 

Further Development