CDF, Assignment 3: Type Specimen Poster (Univers)
Typographic Poster
Initial Research
Name of the typeface Univers
Name of typeface designer Adrian Johann Frutiger
Year it was designed 1957
1 or 2 paragraphs (no more than 100 words total) about the typeface and the purpose of its form. (You do not have to write this yourself, but it should come from a reputable website and accurately describe the history and form of the typeface.)
The typeface Univers is one of the greatest typographic achievements of the second half of the 20th century. The typeface has the advantage of having a variety of weights which even combined give an impression of steadiness and homogeneity. The clear, objective forms of Univers make this a legible font suitable for almost any typographic need.
(https://www.linotype.com/267/univers.html)
A very important aspect of the Univers family is its modularity. Frutiger wanted to create a series of related designs that were absolutely harmonious with each other. This could only be accomplished by determining the complete family range as part of the design process or by building the family within a strict modular framework. Frutiger did both.
(https://www.fonts.com/font/linotype/univers/story)
Full character set for the typeface (letters, numbers, punctuation)
A quote or tagline relevant to the typeface (optional)
“Think of it as a Swiss design with a French heart. As its weight increases, this personality becomes more apparent. The slight (but clearly visible) contrast in stroke weight, subtle angularity, and just the smallest hint of calligraphic brush stroke make Univers a typeface with a twinkle in its eye.”
— Allan HaleyHelvetica is the jeans, and Univers the dinner jacket.
— Adrian Frutigervisual sensitivity between thick and thin’ strokes, avoiding perfect geometry.
— Adrian Frutiger
Poster Sketches
Since Univers is a font described to be more formal and structured — described as “dinner jacket”, so I wanted to make the layout classic and more on the simplistic side. Nothing too out there, but with enough elements to express the “twinkle.”
Digitalize
Following my sketches, I tired to digitalize my ideas. However, I realized as I was digitalizing, many of my ideas relied on a certain proportion of the font that Univers did not have. So I made some changes to my designs as I was digitalizing them. Initially, I tried to fit the entire quote on the poster, however, I found it to look too chunky and more like a flashcard than a poster (third design). I tried both portrait and landscape posters. I ended liking my second and fourth design the best. In these designs I was trying to communicate the sleek and more “dinner jacket” feeling of the typeface, but still have character as the quote I chose suggests. I tried to make everything easily readable, but I still feel like something is missing…
During class I came up with a couple more designs and received some feedback:
- Play with font sizes more… textures would come through more if there were a bigger size difference
- Maybe play with color more (but I wanted to keep the designs simple/formal looking)
- Using characters as design elements
- Portrait posters help guide reader attention more than landscape
Taking the feedback I previously received, I made three more iterations of my poster. I made sure that the character set was also in the poster. However, I’m still not sure how the character set fits into the heirarchy…so I think it looks a bit forced into the poster. In all three posters, I’ve adhered to a pretty strict size hierarchy of information, with the font name (Univers) as the biggest element, with the date/typography following. In the leftmost iteration, although the size of “1957” is big, because of it is vertical it doesn’t detract from the title itself.
During class we printed out two designs and had crit. After printing my designs out, I realized I had a couple typos in my poster I had to fix. And during crit, the general consensus was that they liked the dragged out “U” and “r.” (The “U” may be distorting the font too much) My character set centered aligned may not be the best. The red pop of color was helpful. For the font on the diagonal “univers,” I could work on making the font bigger, more intentional. The rags on both my poster could be worked on. Futhermore, while looking at my fellow classmates’ posters, I began to have a couple ideas on how to work with the character set, which seems to me like such a disparate part of the the information presented. I could carve out a separate space to display them, so it still holds importance, but a clear space where it is independent from the text/date/typographer.
Back to Sketching
With this, I went back to my sketchbook, because I had a couple ideas of how I wanted to combine what worked the best/what I liked about the two posters. I felt like my first sketch looked a little too busy, while the second one looked too simple. But I decided to try quickly and roughly digitalizing a few more iterations – some with white backgrounds and some with a black background (maybe the darker background will help balance the simplicity).
Digitalize (again)
Looking through these iterations, I found that I liked the last one the best. It gave the poster a bit more personality with the angled title, but still maintained the typographic hierarchy. I wanted the title and the text to be seen together and the creation date, typographer, and character set to be grouped together, since they were all information about the font, but not in depth analysis. The colors helped achieve this. I also did not really like the 90 degree character set from the first two posters. So I took the last poster and cleaned it up.
Final Thoughts
All in all, I found the project to be very interesting, but also slightly frustrating. I had a very abstract idea of what I was trying to evoke, and although I think in the end, I was getting close, it took many iterations to get to this point. I enjoyed learning more about typography and what makes different fonts different, and I think I started to gain an appreciation for different fonts, the subtle differences.
Exercises
While exploring what typography can do, we were assigned to choose three words from a word bank and create designs that match the mood of the word. I chose ‘nervous’, ‘yoga’, and ‘simplicity’.
nervous
While deciding on a font for ‘nervous’, I wanted to choose one that had narrow characters, indicating the tension and stress while one is nervous. First, I chose Avenir Next Condensed and just placed it smack in the middle, as large as can be. This is because when one is nervous, it consumes their entire being, so I wanted to reflect that. Next, I tried to use Nueva Std Condensed, however, I felt like it was too stylized once I saw it in the grid. I originally thought that the varying weights of the characters would help express the erratic heartbeats one experience, but it turned out to feel snobbish. Afterwards, I decided to stick with Avenir Next Condensed and try a couple different designs. The third one had overlapping words on top of each other to express the shaking feeling. The last one, I tried to incorporate both the overwhelming feeling and erratic feeling with a smaller font size, but repeating words that seems forcibly bounded by the box.
From the previous word, I use Nueva Std, but it was too stylized. However, I think that for ‘yoga’, a more stylized option but simple is ideal. Yoga, to me, represents an act of self care that rolls meditation and exercise into one. I typically associated it with people who have their lives together. It’s a very human experience, so I tried using Bradley Hand Bold, to highlight the focus on people with a handwriting font. Hover I think it turned out to look a bit tacky. Then I tried a more classic font Georgia, and tried to arrange it in such a way that it shows the flexibility you gain in yoga. However I felt like i was trying too hard. Hence, I stuck with Nueva Std and italicized it and increased the font to highlight the space that yoga highlights with the white space, and the italics emphasizes the fluid nature of the act.
For ‘simplicity,’ I knew immediately that I wanted to use a classic font so I tried Times, Helvetica, and Minion Variable Concept. I found that Helvetica and Times worked the best, the ‘y’ in Minion Variable Concept seemed a bit more modern compared to the classic font it seems to be. Between the modern classic and the classic classic font, I went for the classic classic font — Times. This is because I think simplicity also implies a sense of timelessness. And although both fonts are timeless, Times has more of a history. Then for my last iteration, I made the font size 12, in reference to the most classic combination: 12 point Times. I only used one copy of the word to highlight the singularity and I wanted to enforce the idea where everything excess was stripped away.
Our next exercise involved exploring typography hierarchy, seeing how weights, spacing, and indentation can make a difference on readability of a document. We were given the following:
Linespacing
First, I explored how linespacing can make a difference. In my first exploration, I spaced every different element — title, header, each event, location/date, and price. In my second exploration I tried to group by type of information — institution, title, events, logistics. I found the first to be a lot easier to read. To be able to group each element, the reader’s eyes is drawn towards smaller clusters, so the information is much more digestible. Although in the second exploration, there is a clearer separation of hierarchy, what needs to be readable gets lost in a sea of text.
Typographic weights & linespacing
I first used bold and italics to construct this heirarchy. I bolded the headers/titles to emphasize the titles and free admissions, while leaving the white space to separate the elements. Next I used medium and condensed black. Here I bolded the titles of each element. Highlighting the events themselves rather than who was hosting. Condensed black actually works quite well in this layout since the information we are looking at is inline with regular medium text, so the contrast is not as high.
Horizontal shift & linespacing
With the linespacing, the readers can see how the elements are grouped, and with horizontal shifts, we can see the hierarchy within elements as well. However, I realized too much heirarchy can distract the reader as well. Sometimes it is clearer to allow for the reader to decipher the meaning themselves instead of forcing perspective.
Size change & typographic weight
Since I could change around the order of the information, I organized each of the seminar information a bit differently in order to highlight the heirarchy of information. The most important thing for readers to know is usually the title, then who is giving the seminar, and lastly the date. So I reorganized to reflect this. Bold/Condensed bold provides stronger contrast and has heavier weight so the reader is more drawn to this information. I used linespace to break up information.
