In the Cut

James Joyce is currently in his second year of studying graphic design, at George Brown College’s, School of Design. In his time studying there he has developed his skills in Corporate Branding, Advertising, and Web Design and Editorial Design.

In the Cut

What is Excellent Typography

My Relationship with Typography

Favourite Typefaces

Anatomy of Typography

Parts of My Character

What you Need to Know When Designing a Typeface

My Typeface

Announcement Cards

Typographic Grid Research

References

12

3 & 456789

11 & 1213

To the pursuit of perfection, and satisfaction

In the Cut / 1

• ?

In typography, we have rules and guidelines that have been set in place to create excellent typography. These rules ensure that as designers we can successfully produce typographic work that is legible, and visually appealing to the viewer. Excellent typography is ultimately about communication, meaning that a designers goal is to find a healthy balance of the two.

• Excellent typography adheres to typographic rules of legibility. For example, use only 8–11 point text in body copy.

• Excellent typography also depends on readability. Ensure proper tracking and kerning has been applied to your layout.

• Excellent typography is about making the viewer excited about type through creativity with letter-forms and layout.

• Excellent typography is like any other sort of design—you need to push the boundaries to create what has not been done.

• Excellent typography will make other designers analyze your work and strive to produce work as great as yours.

In the Cut / 2

• ?

When I first entered graphic design I did not like typography. I viewed programs like InDesign pointless, and too confusing for me to use. I wondered why things like kerning and tracking were not automatically set for you. I struggled with these concepts, as well as learning to use InDesign, and proper typographic layout. However, as time progressed and I learned more about how to execute proper typography successfully, I started to love it. I realized that you could create beautiful work with typography and layout design. Coupled with the positive influence of Nicole Dimson, I learned to love working with typography and layouts.

Typographic design is a way to take what is seamingly boring to most and make it interesting to the viewer. In its essence, it is the foundations of what graphic design is, communicating to

people in a interesting way. Using typography as a vessel to communicate has quickly become a great interest of mine. To the point where I often browse online for creative typographic treatments and layouts in my spare time. My relationship with typography is definitely growing, and it is growing in a positive direction. Working with layouts and typography has become my favourite kind of design work to explore in school. I am excited to continue building my skills in typography and always look forward to opportunities to work with typographic layouts.

In the Cut / 3

Claude Garamond was a 16th Century type cutter for the Parisian scholar-printer Robert Estienne. His roman fonts were based on the types created by Francesco Griffo for printer Aldus Manutius in 1495. Garamond took this typeface and refined his romans in later versions, adding his own concepts as he developed his skills as a punch cutter. In the centuries following Garamond’s development of his serif typeface, there was a revival in use of that style of serif. Because of this, there were many typefaces being created that were called Garamond. This created confusion as who actually originated the style. Adobe Garamond™ was designed by Robert Slimbach in 1989. The roman weights were based on the true Garamond, and the italics on those of punch cutter Robert Granjon. This font has been expanded to include small caps, titling caps, expert fonts, and swash caps, which were typical in the fifteenth and sixteenth centuries.

Garamond is still one of the most widely used serif typefaces because it even though it is very old, it has a slightly modern vibe to it. Some of the important characteristics of Garamond, are the downward sloping top serifs . The serifs also feature slightly cupped bases as well as rounded edges. Despite being a serif font, readability for use as body text is improved because of its higher x-height and large difference between cap and ascender.

“Garamond refined his romans in later versions, adding his own concepts as he developed his skills as a punch cutter.”

In the Cut / 4

Adrian Frutiger designed Avenir in 1988, after years of having an interest in sans-serif typefaces. He wanted to base his sans-serif on the stylistic advances at that time. The word Avenir means “future” in French and hints that the typeface owes some of its interpretation to Futura. Much like Futura, Avenir is also a very “open” type style with large bowl sizes and high x-heights. But unlike Futura , Avenir is not purely geometric; it has vertical strokes that are thicker than the horizontals, and shortened ascenders.

Avenir is excellent for body text because of its easy readability at small font sizes. However, it is also excellent for display at large sizes. In fact, narrow sans-serif typefaces like Avenir are very popular for use in advertising. The larger bowls and counters, give Avenir a sense of openness that makes reading your work more pleasant. With thirteen weights including italics and obliques; Avenir is an easy go to for any graphic designer looking for a professional looking typeface.

“He wanted to base his sans-serif on the stylistic advances at that time.”

In the Cut / 5

Ascender HeightAscenders are parts of of characters that go above the cap height. This line shows where the ascenders of letters touch.Cap HeightThis marks the top of the capital letters.X-HeightThis shows the height of lowercase letters.BaselineThe line that your text sits on.Descender Line Descenders are the parts of characters that go below the baseline. This line shows where the bottoms of the decenders are.

Ascender Height

Cap Height

X-Height

Baseline

Descender Line

1. ApexThe point which touches the cap height2. SerifA projecting element off of the main stroke; found on serif typefaces3. BowlA curved stroke that encloses a space known as the counter4. FinialA curved serif that rests on the baseline5. DescenderThe downward portion of a lowercase character that reaches the descender line6. AscenderThe highest point of a lower case character that extends to the ascender line7. BarA flat portion of a character that runs across the cap height8. Open-CounterOpen portion of a character9. StemThe vertical stroke on a character10. LinkConnecting piece of a character that attaches to the loop11. LoopAn enclosed stroke that touches the descender line12. EarA curved projecting stroke that touches the x-height13. CounterAn enclosed section of a character14. ShoulderA curved stroke that connects two stems together15. TailA rounded piece connected to the descender that touches the descender line

1

2 3 4 5

6

In the Cut / 6

A. DedicatedB. DeterminedC. AmbitiousD. PersistentE. CooperativeF. CuriousG. Focused

7

8

910

11

12

13

14

15

In the Cut / 7

Know the RulesWhen working with typography there are rules and guidelines we as designers must follow in order to be successful. When creating a typeface, it is important to refer to diagrams that explain the parts of letter-forms. As well as, following the guidelines that describe where letter-forms and their components should be located on the overshoot guides.

Know Your LimitsIf you are just starting out as a graphic designer, it is important to remember the foundations of typography. As designers we have excellent taste, however we are still learning proper typography. With that in mind, your main focus should be to focus on creating a typeface that is technically proficient. That does not mean you cannot create something beautiful. It means that you should always keep the rules in mind and not try to produce work that is overly extravagant, but technically unsuccessful.

Focus on PrecisionCoinciding with knowing your limits is the need to focus on the precision of your typeface. Typography is very technical work that requires unity in heights, weights and widths among other aspects. Focusing on these simple components is crucial to overall success in creating an effective typeface.

It Takes TimeCreating a typeface is a long process that takes many revisions to produce something successful. You cannot expect to achieve this success on your first try. Having the patience to work many hours, paired with an open mind to constructive criticism from your peers is the key to success. Other people view your work from a different perspective from yourself, and they can make suggestions for revisions that you might not notice yourself. Putting in the time work on your typeface and only feel that its complete once your 100% satisfied is paramount to the succession of your typeface.

In the Cut / 8

In graphic design today, current trends favour the use of sans-serif fonts. It seems that every designers go to typeface is a sleek, thin, sans-serif. Not only for uses in body text; but for display and headers as well. With this in mind, I wanted to create a serif typeface that would be modern and highly appealing, to show that serif fonts are just as beautiful as san-serifs such as Helvetica.

The best typographic representations I found that related to my attribute list both possessed similar qualities. Although they were a mix of serif and sans-serif, they were both sleek, thin typefaces. I love the look of thin typefaces because to me they give the viewer a modern, or even futuristic feeling when viewing them, and I associate these qualities with excellent design. I knew I wanted my typeface to possess these qualities as well.

When starting to conceptualize my typeface, it was crucial for me to be able to control the precision of the typeface. With this intent I started with Adobe Garamond as a platform so I could dissect it and mould it into my vision. Garamond is a beautiful classic font, but it has its flaws. Since it is based on the original work that was created by hand. The precision of the serifs and weights in the strokes are lost in its execution. I wanted to achieve a precise modern typeface, that was very minimalist. In order to do this I had to remove any unnecessary components while still displaying a high level of readability.

One of the major characteristics of my typeface are the very sharp serifs. This was done not only for a modern aspect, but as a way to control precision and unity. Another aspect of my typeface that controls unity is making it in all capitals. The final major characteristic is the dissection of strokes. I removed as much of the strokes as I could, as well as making

strokes always come to a sharp point, to achieve the modern approach I desired. Throughout many revisions I was finally able to conceive my vision while still retaining legibility and unity.

Through out the process there was one name that seemed most fitting based on the nature of my design process.. Sliced typeface is a result of deconstructing the classic serif typeface; and making it more relevant for todays designer. Through unity, precision and modernization I have achieved this.

In the Cut / 9

In the Cut / 10

In the Cut / 11

The Swiss style was a typographic heavy design style that became prevalent during the 1950’s. Designers of this style chose to veer away from the ornate, and create a very structured industrial look. Their goal was to achieve minimalism in their layouts with not only type, but also the photographic elements, colour and shapes. They believed that less if more and to be successful as a designer you should strive to use as little elements as possible to create successful design work. In typography, they preferred a clean sans-serif set flush left, ragged right. The designers would use a mathematical based grid system to create a sense of visual unity in the composition. To enhance their works appeal, they would often angle their type to flow with the artwork. The Swiss style is so important even to this day, because it is the standard for creating clean and well organized typographic layout.

In the Cut / 12

The punk style of typography was conceived during the take off of punk music in the 1970’s. The ideals of punk bands of the time were those of no rules or structure. These ideals translated into the visual components of record cover designs, as well as magazine design focused on Punk music. The essence of Punk was to literally break all the rules and guidelines set in place by the creators of the Swiss style. Punk style would be based off a grid but would deviate so much from organization that you would not believe there was any sort of structure. Punk style would place text all over the page, sometimes even laid over top of images. Readability was not a priority for this particular style, as the layout was more art based than proper typographic function. The point of the style was to evoke the same chaotic emotions as the music visually. Although Punk style seamingly broke all the rules of type we as designers should adhere to, they were successful in creating art through typography. Which begs the question of whether proper layout, or art, is more important to the success of a design.

The use of a grid system for graphic designers, and especially for beginning graphic designers, is crucial to the development of proper typographic layout. Many designers are able to design creative layouts visually. However, to create successful work, you need a structured base to start your work from. Grids help us learn to layout our work effectively and attractively. Typographic grids are crucial for me when doing typographic work because I need that sense of structure to feel like my layout is organized and balanced.

All layouts stem from the foundations of either the single column grid, multicolumn grid, or the modular grid, (Modular meaning it features columns and rows in order to organize copy or images all over the page). The use of a grid does not mean that your structured layout will be boring. Rather, it will make your work look more professional to the viewer, and increase your understanding of proper typographic design. I chose to use a modular style for this typography book, because it works the best as a strong basis for structure. Especially when creating a layout with unconventional post modern design elements.

In the Cut / 13

Retrieved October 23, 2013 from http://guity-novin.blogspot.ca/2011/07/chapter-42-swiss-grade-style-and-dutch.html

Hollis, Richard. (2006) Swiss Graphic Design: The Origins and Growth of an International Style. Yale University Press.

Retrieved October 23, 2013 http://99designs.com/designer-blog/2013/09/30/11-techniques-for-breaking-the-typographic-grid/

Rabinowitz, Tora. (2006). Exploring Typography. Clifton Park: Thompson Delmar Learning

Retrieved November 15, 2013 from http://designinstruct.com/tools-basics/the-basics-of-typography/