From the Type Up: Designing typefaces for EGD with graphic design undergraduates

September 20, 2019

From the Type Up: Designing typefaces for EGD with graphic design undergraduates
By Renée Alleyn, BDes, BA, MA
Professor, Sheridan College

Abstract

This paper presents the results from a curricular trial which saw the modification of an existing typeface design course—within an interdisciplinary undergraduate graphic design program—to cover principals of environmental graphic design (EGD). The modifications were undertaken by the author, with the course running twice during the 2018–19 academic year—first by myself in fall 2018 and second by my colleague Kevin King, MATD in winter 2019.

Using industry standard typeface design software, students in this course each designed a functioning typeface in one weight and style for a specific EGD purpose (real or imagined) of their choosing. Students undertook typefaces tailored for a range of EGD applications, including interior and exterior wayfinding systems, exhibition design, and place-making projects.

This paper focuses on the development and running of the course as well as showcasing the resulting student work. The curriculum, tools, technologies, and select teaching methods used—research-driven reflection, demonstrations, case studies, lectures, and critiques—are examined. Challenges—such as the short 12-week timeframe for the course and subsequently limited testing opportunities—are identified and discussed.

The course required students to deeply engage with the typographic issues and needs of EGD projects and demonstrate their knowledge through appropriate manipulation of typographic forms. By creating a typeface tailored for a site-specific human-centered purpose, students gained insight into the considerations necessary when choosing appropriate typefaces for EGD projects. I argue that by working from the type up, typeface design projects represent a promising avenue for the promotion of high typographic standards and best practices within the field.

Methodology

Typeface Design is a third-year elective practicum course offered in the interdisciplinary York University/Sheridan College Program in Design—a four-year bachelor degree program in Toronto, Canada. Its objective is to introduce students to contemporary industry methods for designing typefaces as well as the design decisions relevant to letterforms and spacing. Instruction occurs in a studio environment over a 12-week term with weekly four-hour classes. Class enrollment ranges from 15–20 students. The course is open to third- and fourth-year York University/Sheridan College Program in Design students with three core typography courses as prerequisites. Typeface Design is approached as an opportunity for graphic design students to take a closer look at the processes and components which lead to quality typefaces as well as gain a deeper understanding of what makes typefaces suited for specific jobs. This pedagogical approach is based on the principle that the same evaluative criteria used by type designers when designing a typeface apply when graphic designers assess the suitability of a given type for a given purpose (for a discussion of this see Unger 185–192). The goal is thus not to educate future typeface designers (though that sometimes does happen), but instead to make future graphic designers better type choosers and users. To this end, the course in structured to encourage students to see and think beyond what Paul Luna calls “the personality-value of typefaces” (Luna xv), towards looking at all typefaces as designed, within the conventions of language, for reading under differing and particular circumstances.

The two term trial modification of this course to cover principals of EGD came about as a means to meet growing student interest in EGD. Since fall 2013, the York University/Sheridan College Program in Design has offered a third-year elective course covering principles and practices of EGD—designed and taught by Angela Iarocci, BID, M.Arch. This course has helped to raise awareness of EGD among our students and has inspired many to pursue EGD projects in courses where project topics are self-directed.

Structure of the course

Central to the methodology of the Typeface Design course—and the goal of creating better type choosers and users—is the concept of typefaces having jobs. Gerard Unger offers, in Theory of Type Design, four criteria for evaluating new typeface designs: functionality, social quality, creative quality, and expression (185). He describes functionality as “the fitness [of a typeface] for a particular purpose or application” (Unger 185). While all four criteria are always in play in any type design, the course emphasizes the link between form and function. To facilitate this focus, all students in a given class are restricted to designing one kind (or genre) of typeface chosen by the professor—usually for a generally specified job, such as text faces. This approach is modeled by the five-week post-graduate certificate Type@Cooper program offered by Cooper Union. The key benefit is to better focus instruction on the forms and useful features connected with a particular function. Another benefit is that having students work on projects with similar goals promotes more peer-to-peer engagement and learning—both particularly helpful when dealing with condensed timeframes. This already established methodology made modifying the course to cover principals of EGD fairly simple. Substantial changes to the structure of the course were not necessary; only the genre of typeface and the supporting instruction plans and materials needed to be changed.

Typeface Design is rooted in project-based learning structured around one core project—the design of an original typeface in one weight and style (i.e. roman or italics), including both upper- and lower-case as well as punctuation. Non-alphabetic characters such as figures and diacritics are only designed if the student has time. It is worth noting that students in this course are not limited to designing a typeface for the Latin script; other scripts are permitted if the student is fluent. The core project is subdivided into four phases with deliverables: 1) design proposal, 2) initial character set, 3) full character set, 4) type specimen. Each is discussed in turn below, with comments on how principals of EGD were worked in.

1) The design proposal:

At the beginning of the semester, students in the Typeface Design course are required to write a research-driven project brief detailing the chosen site and intended purpose of their proposed typeface. Students gather and critically analyze studies (primarily drawn from class lectures, case studies, and provided resources) and typefaces designed for similar purposes in order to establish design parameters for their own project. They are asked to define appropriate choices for their letterforms (such as quality of aperture, x-height, stroke-weight and contrast, counter size, etc.). In these proposals students defined the kind of reading for which the typeface will be optimized (for example, long-range, medium-range, short-range, etc.; for short bits of information or longer passages), the environment (including reading dynamics) and lighting conditions, and the medium (such as reflective or non-reflective, backlit, digital, etc.). Students are required to cite the sources of their research and, as a final stage, include a moodboard to visually communicate the desired expressive quality. These design proposals serve not only as a means for students to start their projects, but also perform an important pedagogical function, serving as a guide for reflection throughout the design process. Where possible informal exploratory site visits with photographic and notational documentation were encouraged as a means to experience the character of the site and the nature of any existing EGD. In cases where a physical visit was not practical or possible, students constructed a ‘virtual visit’ by way of combing the internet for images, maps, written descriptions, and other documentation. In the case that the site chosen was imagined by the student—and doesn’t exist—then exploration of analogous sites was recommended. Given time restraints and the focus on the designing of typefaces EGD—not on EGD itself—students were not required to perform formal analysis of their chosen site.

2) Initial character set:

For the Latin script, the initial set of characters students design are the 15 lower-case characters making up the nonsense word ‘hamburgefontsiv’. This nonsense word is often used in type design (and type specimen showings) because it features commonly used lower-case letters and contains the basic strokes—straight, curved, inflected, and angled (see Cheng 8–9). These 15 characters serve well as ‘DNA’ for the rest of the lowercase characters—for example the ‘o’ serves as a basis for the ‘c’, the ‘t’ for the ‘l’, and the ‘v’ for the ‘y’. In this way the 15 ‘hamburgefontsiv’ characters establish a set of control characters and allow students to work with a manageable number of characters as they are learning the technical skills to create form within type design software. During the trial, students submitted their initial character set printed large, in one line, on a tabloid-size paper. Submissions were collectively pinned on the wall in the classroom for group critique and discussion. A large showing like this is useful, when viewed up close, for examining detail, and when viewed from afar, while walking, or at an angle, for assessing function for EGD.

3) Full character set:

During the trial, students submitted their full character sets (for Latin this includes 52 characters plus punctuation) in large showings on multiple tabloid-sized sheets. Required showings include: all lower-case, all upper-case, lower- and upper case together, and multiple pages of sample words or short phrases. Showings with natural text were important at this stage, so the spacing of the font could be assessed. Harry Carter is quoted as saying that “it is difficult to appreciate without seeing a demonstration how completely a letter is altered by having more or less space about it” (Tracy 70). Spacing is as important to the function of a typeface as is form—as appropriate spacing varies according to function. In typefaces intended for EGD applications more generous spacing is generally preferable—as it aids in legibility at a distance and at acute angles (Calori and Vanden-Eynden138–141, 173). The method for spacing outlined by Walter Tracy is widely popular and useful as a guide to the process (Tracy 70–80; also see this method outlined in Cheng 118–227). As in the case of the initial character set, submissions were pinned up for critique and discussion.

4) Type specimen:

For their final submission students prepared a type specimen booklet displaying their typeface. Required content for this booklet was heavily prescribed, including a minimum of three mockups showing the font in its intended use—such as in signage or environmental graphics. Also among the required content was a spread highlighting the features of the letterforms with written explanation of how these impact the function of the typeface. Using their design proposals as reference, students were asked to write and include a written reflection on their design process.

Tools & technologies used

The Typeface Design course curriculum is made feasible by using software made specifically for designing typefaces. There are two industry-leading software programs for designing typefaces: Glyphs (glyphsapp.com) and FontLab (fontlab.com). Both are simple to learn, within the timeframe of a one-term course, without prior student exposure. Short professor-lead demonstrations, student access to resources and tutorials, and occasional one-on-one coaching facilitate students picking up either of these programs quickly. At Sheridan College we have adopted Glyphs, in part due to the extensive and comprehensive library of resources and documentation available on its website. Additionally, Charles Nix, a Type Director at Monotype, also has an excellent tutorial on designing typefaces in Glyphs available through Lynda.com(Nix). Type design software is preferable to Adobe Illustrator as it offers a specialized workspace with powerful and accurate control and manipulation of Bezier curves. Professional type design software considerably speeds up the process of designing characters and allows for building all the components of a typeface: horizontal and vertical metrics, spacing, kerning, naming, and mastering. Font files can be generated at the touch of a button for on-demand testing.

Also useful are two methods for sketching initial typeface concepts widely used by type designers and taught at leading typeface design programs such as the University of Reading and the KABK: the ‘wiggle’ method and the double pencil method (Henestrosa et al. 41–42). The wiggle method involves hatching left-to-right with a single pen or pencil at a natural writing angle. This allows students to manipulate stroke modulation (the distribution of thick and thin along a stroke) without being bound by the modulation created by any particular tool. The double pencil method involves drawing with two pencils attached together, simulating a broad-nib pen. This method shows how a tool produces modulation; but does so for a novice in a more forgiving manner than ink and broad-nib pen. These methods can be used together or one can be chosen over the other. Both methods naturally produce form and mass simultaneously—allowing students to quickly generate ideas and experiment with variations. Sketches produced with these methods can be refined by filling in detail or adding outlines and can be scanned or photographed and brought into type design software as templates (Scheichelbauer). For beginners these methods are superior to outline sketching because the designer need not have a clear idea of the proportions of a letter nor how to distribute mass along the stroke.

Select teaching methods

In addition to research-driven reflection and demonstrations of type making software and processes, several other teaching methods were employed to support student learning and success. These include case studies, lectures, guest lectures, and individual and group critiques. Each is discussed below with detail of EGD-specific content or processes used.

Case studies were immensely useful throughout the term, first as a means of introduction to the genre and range of EGD applications possible and later to look more closely at the technical specifics of successful EGD typefaces. All case studies focused on typefaces over the communication systems in which they are employed. Emphasis was placed on cases where a comparison between old or standard and EGD optimized typefaces is possible. Clearviewoffers a perhaps obvious, but very well-crafted and extensively documented example grounded in an immense amount of research (Yaffa; Caloriand Vanden-Eynden135–137)—making it an excellent introductory case. Additionally, Clearviewhas a local twist, as major highway arteries in the Greater Toronto Area use either Clearviewor Highway Gothic, depending on the municipality. Therefore students can compare their experiences with both typefaces. Other roadway signage typefaces such as Gerard Unger’s ANWBtypefaces for Dutch road signs and Meta Design’s FF Transit, originally designed for the public transit and airport in Düsseldorf, provide additional sans serif examples. James Montablano’s, NPS Rawlinsonfor the U.S. National Park Service, Matthew Carter’s Yale Streetfor Yale University, and Unger’s Capitolium for the city of Rome offer seriffed examples. A guest lecture by designer Russell McGorman explored his work overseeing the choice and customization of typefaces for the signage systems of two local transit networks: GO Transit, using a customized version of Galaxie Polarisby Chester Jenkins, and UP Express, using a customized version of Gibsonby Canada Type. McGorman’s case studies explored in detail the changes made to optimize out-of-the-box generalist typefaces for use in wayfinding. Even closer to home, Sheridan College recently installed a new wayfinding system on campus usingClassic Grotesque, designed byRod McDonald for Monotype. Students were brought out into the halls to observe and discuss how the typeface performed in this application. Highlighting branding and placemaking qualities is Matthew Carter’s Walker, re-engineered as Walker Expandedin Pentagram’s recent identity redesign for the Walker Arts Centre in Minneapolis (see Walker Art Centre). Monotype’s recent refresh of Johnstonfor the London Underground offers another case where the typeface is instrumental to placemaking (see Transport for London).

A lecture pertaining to principals and best practices for type in EGD applications was necessary to contextualize the reasoning behind the technical specifics of successful EGD typefaces. Topics included preferred typeface styles and weights, optimal sizing for viewing at a distance, and some basics regarding typographic treatment (spacing and title-case versus all caps, for examples). Chris Caloriand David Vanden-Eynden’s book provides succinct information in this regard (126–143; 166–169). The previously mentioned case studies provided illustrations and elaboration. High-contrast type is currently in fashion amongst students at Sheridan, so during my section of the course the unsuitability of this style had to be demonstrated using an ad-hoc side-by-side comparison erected in the hallway. Signage layout was not covered, so students who had previously taken the elective EGD course had an advantage. While the principle of accessibility was stressed throughout, the existence of accessibility standards (ADA in the U.S. and AODA in Ontario) was pointed to but covered only superficially, as pertaining to the topics above. Students seeking more information on accessibility were provided with the Nova Polymers ADA White Papers Typography Seriesand the SEGD 2012 ADA White Paper Update.

Throughout the semester, the majority of class time was devoted to individual and group critiques. Given the student’s unfamiliarity with the type design process, these sessions enabled student learning through formative assessment and hands-on problem solving. Group critiques, particularly at submission of Phase 2 & 3 deliverables (initial and full character sets) provided opportunities for peer feedback and informal self-assessment. Furthermore, group critiques provided an opportunity for students to test their typefaces. Demonstrating testing methods—such as printing out words and phrases at the approximate intended final size and setting up an Illustrator test file with Gaussian blurs applied—and carving out testing opportunities (however informal) was essential. Pinning up work on wall space in the classroom (or in a hallway) allowed students to view their work from a variety of distances and angles. Students generally needed initial encouragement to print out and look at their work outside of the software, but soon discovered the benefit.

Challenges

The primary challenges faced during this trial were due to the limited time available to cover the extensive amount of material from two distinct specializations: typeface design and EGD. For students to complete the course assignment successfully, as much available class time as possible had to be dedicated to facilitating student progress on their typefaces.Given that the course objective is to introduce students to the considerations and methods of typeface design, type design had to remain the primary focus. It was therefore not possible to cover EGD in any great detail beyond the demands EGD applications make on letterforms—this meant minimal coverage of signage layout and other design considerations. Limited time also meant that we did not conduct organized site-visits as a class nor require students to conduct their own. This shortcoming was addressed two-fold: first by encouraging students to incorporate information and images gathered from informal exploratory site visitsinto their design proposals; second by use of local case studies of which students were likely to have (ongoing) personal interaction. However, no class time was dedicated to instruction on how one might go about a site visit in a systematic manner. This gave students with prior knowledge of EGD concepts and practices an advantage in the execution of their design proposals and type specimen booklets. Their grasp of EGD concepts and execution at these stages often showed more sophistication. The results shown below demonstrate that widespread prior student knowledge of EGD is not necessary to run a course like this, but would certainly assist in the delivery of the curriculum.

Limited time also meant limited testing opportunities. As described in “Select teaching methods” above, testing was confined to the classroom and conducted informally. Testing as a group occurred only during the submission of phase 2 and 3 deliverables (initial and full character sets). Incorporating testing into the curriculum (and possibly the deliverables) in a more formalized way would likely dramatically increase the quality of results. Shortcomings evident in the student work shown—such as unresolved height-width ratios, stroke weight, and recognizability of characters—might be caught earlier and with more time to resolve them. If the trial’s modifications are adopted, testing will need to be more formally incorporated as possible within the class time available. This could be accomplished by scheduling a class for group testing between due-dates for phase 2 and 3 deliverables. Requiring students to document their testing process for inclusion in their type specimens is worth consideration. More convenient student access to affordable large-format printing would facilitate testing.

Contribution to the Field

Students designed typefaces tailored for a wide range of EGD applications. Among the work shown is Nivean Slaband Pathways,both designed for exterior wayfinding systems, Selwyn Condensed, designedfor interior wayfinding, Textafor exhibition design, and Jeonjoofor transit information panels. The quality of the work is high overall and during the trial students showed a higher than usual enthusiasm for the course. The course is challenging, regardless of the genre of typeface students are specified to design, and some students inevitably struggle. The course requires that students sustain effort and interest in one project for the duration of the term and calls on a different set of skills and sensibilities than graphic design. However, even struggling students engaged with the typographic issues and needs of EGD projects—issues such as optimal legibility and considerations of viewing distance and height, material, and reading conditions (bright snow, moving bus).

Students engaged with these issues in a hands-on manner by appropriately manipulating typographic forms. For example Carolyne Gogota, with her typeface Nivean Slab—intended for a ski resort’s wayfinding system—hypothesized that serifs might aid in character recognition under weather conditions such as blowing snow or sun glare by adding distinction between characters. However serifs (particularly chunky slabs) can close up all-important open counter spaces, so for characters such as ‘n’ and ‘m’ she was able to maintain openness by removing the left-hand serif. Chayoung Lee, with the Hangul typeface Jeonjoosought to create easier character recognition than offered by the typeface used on existing Seoulbus information panels. She did so by reducing the stroke weight to help maximize counter space within constructed syllables. She also introducing an angle or ‘tilt’ to straight-stroked consonants such as giyeok (ㄱ), nieun (ㄴ), and tigwt (ㄷ). These tilts establish flow between characters and syllables and help to create more consistent counter space. With TextaKathy Wang was determined to make a ‘pixel font’ evoking the woven rugs and fabrics for a local museum of textiles. Envisioning that Textawould work in a display role within exhibits in conjunction with a more standard typeface, she gained leeway to experiment with form. Nonetheless she worked through and tested multiple forms (often dozens) for each character—seeking the most recognizable forms and consistent weight. To keep forms open she also devised two kinds of serifs for the lowercase: a simplified one-step serif along the x-height and a more complex two-step serif for along the baseline. This reduces clutter along the x-height—thus improving legibility—while visually knitting the baseline together. Taryn Jacobs’sSelwyn Condensedand Kristin DiBello’s gently extendedPathwaysboth explore the limits of height-width ratios within EGD. In the case of Selwyn Condensed, the student incorporated a large x-height and open apertures to maximize counter spaces. The inter-character spacing was optimized for large sizes and is not shown off to best advantage in the type specimen. At smaller sizes it has taken on the ‘picket-fence’ appearance which can afflict condensed lowercase characters. Pathwayspushes the height-width ratio in the opposite direction, gently extending the letterforms in an effort to produce a more relaxed effect. In both cases, more systematic testing (using simulated signage layouts) would have aided the students in arriving at just the right ratio to balance legibility (in the case of the condensed face) and layout fit (in the case of the extended face).

In each of the cases discussed above students learned through creating and experimenting with letterforms which structures and features provided optimal legibility for their chosen application. A far cry from choosing type as a distracted afterthought, students gained a deeper understanding through making of the various requirements of typefaces used in EGD applications. The students can use this more intimate knowledge of letterforms when evaluating existing typefaces for use in projects, EGD or otherwise, particularly when legibility is paramount. Through the design process, features of typefaces and criteria for evaluating them become more familiar, and type begins to lose its intimidation factor. In this way, typeface design serves as a valuable education in typography. By having worked from the type up, the students are far more likely to practice high typographic standards and best practices in their future professional capacities.

Implications

It is my hope that this paper presents a utility/function-focused course in type design as an efficacious and feasible approach to typographic education—particularly in cases where achieving maximum legibility and accessibility with type is a core professional competency. The resources included in this paper can be used by instructors without prior type design experience to incorporate the practice into their teaching. Function-focused type design is pedagogically useful training for type users and choosers—pushing as it does beyond the personality value of typefaces. Furthermore, by introducing students to the practice it also prepares future designers for work and collaboration with type designers. This trial was structured to fit within curriculum at the York University/Sheridan College Program in Design, however its methodologies can be applied in a variety of contexts. For example, with modifications, this approach could be pursued as an independent study, a capstone project, or in a simplified form as a component of other practicum courses in EGD. For incorporation as a module in a non-type design course, the required character set could be reduced—to as low as one word (say “Welcome” or “Information”). Also outside the context of a type design course, Unger’s four criteria for evaluating typefaces are promising as the basis for type selection exercises which can be incorporated into the workflow of design projects.

Citations

Beier, Sofie. Reading Letters: Designing for Legibility, BIS, 2012.

Calori,Chris, and DavidVanden-Eynden. Signage and Wayfinding Design. Wiley, 2015.

Cheng, Karen. Designing Type. Yale University Press, 2006.

Henestrosa, Cristóbal, et al. How to Create Typefaces: From Sketch to Screen. Tipo e, 2017.

“Johnston 100.” YouTube, uploaded by Transport for London, 11 Jul. 2016,

www.youtube.com/watch?v=BKd-SZl5hl0

Luna, Paul. Typography: A Vary Short Introduction. Oxford University Press, 2018.

Nix, Charles. “Glyphs App Essential Training.” Lynda.com, released 12 Sept. 2016,

https://www.lynda.com/Glyphs-App-tutorials/Glyphs-App-Essential-Training/486041-2.html

Scheichelbauer, Rainer E. “Sketching.” Glyphs, 2014, glyphsapp.com/tutorials/sketching

“Signage Requirements in the 2010 Standards for Accessible Design.”SEGD 2012 ADA White Paper Update.

Society for Environmental Graphic Design, 2012, segd.org/2012-ada-white-paper-update

“The ADA and Typography (Parts 1–3).” ADA White Paper Series. Nova Polymers,

www.novapolymers.com/resources/white-papers/

Tracy, Walter. Letters of Credit: A View of Type Design. Godine, 1986.

Unger, Gerard. Theory of Type Design. nai101, 2018.

“Walker Expanded.”YouTube, uploaded by Walker Art Centre, 10 Oct. 2011,

www.youtube.com/watch?v=PzmaYWtYTYM

Yaffa, Joshua. “The Road to Clarity.” The New York Times, 12 Aug. 2007,