Tungsten — Designing a Typeface Specimen Landing Page
Summary
There was a very challenging first project: design a landing page for a typeface, concretely for Tungsten and encouraging the niche to try and purchase this type specimen. Also, the real challenge was how to implement the typeface personality in every single pixel of the page and trying not to die in the attempt.
Why Tungsten? Why not?
When we had to choose a typeface, my feelings led me to Tungsten. Among the whole typefaces list which drew my attention was this one especially because it was really different from the rest of typefaces. A minimum of two or three type specimens in the list was similar but this one, in particular, was peculiar, mysterious and suitable for my first project. Then, while I was finishing my landing page I realized that it was the best option despite struggling me at the beginning, during the research process.
Creative exploration is all you need
Let’s start with the most important part of the project: the creative process or how to come up with a great idea from nowhere. First of all, quick research about Tungsten, its origins, the author, etc. and… Ops! It seems that Tungsten is a sans-serif designed by Hoefler and Co. who created every typeface that you can remember.
So, keeping up with these factors is mandatory! Tungsten was created in 2009 but it has a typical sexy-oldie and charming style from the time period between the 20s and 40s and also, it was influenced by Modern Pipe and propaganda from WPA and USSR Constructivism.
Keeping all this information in mind, I continued my research analyzing several type specimen websites in order to make the structure clear and understand the reason why these typefaces were like this. In addition, I determined the style of my project by my mood board.
This mood board is the essence of what it is Tungsten. I gathered some pictures about USSR constructivism and WPA propaganda, mingled with factories, modern pipe style and old photographs reminding its origins. As a result of this compilation, Tungsten is industrial, modern but oldie, is trendy, nostalgic, powerful and clean and also, illustrative, it adds the greatness with it and seriousness without being frightening.
Having all these clear concepts, defying the sections of my inception sheet wasn’t complicated.
With regards to visual space, its space is compact and close but balanced and clean. The color is sober, not bright, with noisy details, using strong colors such as red or blue that contrast between them and between other secondary colors like beige or yellow. The movement is linear, horizontal and stuck. The shape is regular, geometric concretely square and linear.
The mood is more complicated because a typeface is something not tangible but I defined it as elegant, serious, persuasive, strong, versatile for its different fonts available, powerful and confident, stylish in detail, nostalgic for its origins and consistent. Finally, the reason why was making a tribute and help our target to learn more about Tungsten. Also, how to implement it in the design field properly.
So, the final creative direction was to honor the origins of this type specimen by designing a landing page based on posters and propaganda style that were a trend during the period of time between the 20s and 40s and preserving all the essence compiled on my inception sheet and mood board.
For this reason, the cover should be a summary of the essence of this typeface and the best representative example is what I made. Then, I designed every section based on the style of the posters but while I was designing each section there were some designs that don’t fit well for me so, I changed it.
First, I struggle with the cover section because it has to draw the attention of everybody who is on the landing page. For this reason, the final cover is the third tried that I made trying to be impressive. However, I didn’t want to throw away all these versions and I tried to keep it or the style in other sections such as creators’ and the footer. In the final cover, the headings are as geometrical as the typical style of USSR constructivism, regular shapes and some pipes with red noise reminds old factories and its fumes. The collage with the planes represents the arms race of USSR and also the defense industry.
The final landing page design was the following one:
The bands with the headings indicate that a new section is coming. In the description section, regular shapes continue and highlighted the main adjectives of Tungsten following the typographical 20s and 30s style in capital letters.
The creators’ section reminds to WPA propaganda related to good behavior with blue backgrounds a square-illustrative part in white and headings up and down. In one of the headings of this section, there is common slang of this time of period which makes Tungsten not as serious as is suppose to be but also more close-knit. This slang continues in the next sections, concretely in the analysis of the main characteristics, using as an example ‘cute as a bug ear’ and also in font pairings in which the design is a composition of three sentences placed imitating a poster.
Analyzing the font, I wanted to emphasize the different weights of Tungsten by making bigger the word weights and making the section very visual by organizing the different fonts in groups. The samples used for this landing page were from the different kind of arts such as music, art or movies because during the time of period of its origins art had a key role in people’s life.
The final section should be special and I finish with the same background photo as in the cover: a group of workers from the 20s. In this section, there is a 30-day trial four Call To Action that has a 20s style with regular and geometric shapes.
Finally, the footer has another geometrical composition that I designed at the beginning with reminds to some USSR posters. This composition plays with the noise and the perspective as well as the cover trying to make my own version of this style.
Tools
Photoshop | Invision | Medium
