Dillan Botha's profile

03 Typography - ISTD: Google Loves Green

03 Typography
Google Loves Green [An ISTD project]
This project passed the ISTD Student Assessment 2022. 
I was also welcomed as a new member of the International Society of Typographic Designers. 
Brief Summary

For this project, we were tasked to pick one of the five briefs from the 2022 ISTD Student Assessment scheme. The end product would be an effective and creative typographic solution of our choice. The five briefs were as follows: Lighthouses of the World, Agenda for Sustainability, Shaping The World, A Colourful Story, and Typographic Research Unit. 

The Brief I chose

This assignment offers a solution for ISTD 2022 Brief 4: A Colourful Story. 

The brief provided an opportunity to explore and express the use, meaning and significance of one particular colour in the culture of our choice or, say, to examine how that colour is perceived in different cultures and the impact that these factors may have in communication and cultural exchange. We were urged to examine the psychological effects of colour – which is widely documented – and consider a fresh, possibly impactful, expression of its use. Then we must experiment with those opportunities leveraged from our research to develop an appropriate format and creative typographic solution that effectively communicates our chosen message to our intended audience.

Project Deliverables

01| Process & Research document [Click here to view the full document]
02| Strategy & Specification document [Click here to view the full document]
03| Final deliverables [Which is The Google Doodle, The Green Hause website, and 5 editorial spreads]

Design Strategy

There is a lot to say about the colour green. It’s seemingly everywhere you look, whether it’s in rural nature, untouched by man, or on traffic lights across the globe in cities and towns alike. Greens’ impact on our day-to-day lives cannot be argued against. It’s a complex and unmissable colour that’s rich in stories, meanings, contradictions, connotations, and cultural nuances. The colour green is a phenomenon worthy of celebration.

Very conveniently, that’s exactly what this assignment sets out to achieve. This assignment offers a solution for ISTD 2022 Brief 4: A Colourful Story. A solution that is driven and inspired by innovative and exciting typography. 

Green, as previously stated, is a complex colour that has immense influence over our lives. Green has been associated with a myriad of things throughout history. These associations have either stayed consistent or evolved. These associations have influenced the way we perceive green and also what emotions are evoked in the presence of green. 

The concept for this assignment is rooted in the fact that green is the shadiest colour. Green is the colour that humans can see the most variety within. This means that green, to humans, has the most shades and tints available of all the colours. Thus, the solution focuses and draws a parallel between green having a lot of stories and green having a lot of shades and tints. Each of the greens’ many stories, in the context of this assignment, represents a different shade or tint of green. The stories regarding green that’ll be told throughout this solution doesn’t focus on one specific culture per se but rather on green as a symbol and communications device within different cultures. This is a fun and light-hearted assignment that doesn’t want to do anything else than celebrate the complexities and history of green. A unique, modern, and accessible solution that this assignment landed on was a promotional campaign that celebrates greens’ complex nature.

This campaign will use Google as a platform to promote itself. More specifically through the means of a Google Doodle and a complimentary webpage. A Google Doodle is when Google changes their logo to celebrate a holiday, a famous person, or an important day in history. In the context of this assignment, a google doodle will be designed to celebrate International Colour Day which is celebrated on the 21st of March. International Colour Day was established by the International Colour Association. This project thus focused on developing this solution from Google’s point of view. The International Colour Association and International Colour Day are used as a means to justify these solutions’ existence.

This promotional campaign will consist of 3 segments. Firstly, there’s the Google Doodle, which will be the “face” for this campaign and, when clicked on, that’ll transport people to a webpage. The second element of this campaign will be the complementary webpage that’ll feature a variety of tiles representing different shades and stories of green. Thirdly, there are the beautifully crafted editorial spreads, that’ll open up when a tile from the webpage is clicked on. All of these segments and elements will be unapologetically green as it’ll be the only colour we celebrate on this year’s International Colour Day.
Green Research
The day one journal

After committing to ISTD 2022 brief 4: A Colourful Story I decided to do some in-depth research on the colour green. The research I did lead me to interesting tidbits and stories about green. For example, one thing that stood out to me was that green is the shadiest colour. This means that green is the colour that humans can see the most variety within. This, paired with the fact that green has so many different cultural nuances around the globe, helped me to choose a concept. 

I wanted to have a lighthearted approach to this concept. I wanted to create something that would compile all of green's many facets into one place. Initially, I thought about a coffee table book. But that went nowhere. I then did some research and came across the idea to do an online campaign through means of a Google doodle. I journaled all my research as documented by the photos below.
Google Doodling
Initial Sketches

All good ideas start with pencil and paper. I frequently visited my journal to sketch some ideas I had about the Google doodle and the crafted typography for the editorial spreads. It helped me to quickly express my ideas. The good, the bad, and the ugly; all of it was sketched down throughout this project. During the planning stages of this online campaign, I placed special emphasis on perfecting the Google Doodle as it is the face of this campaign. My Google doodle, once I finalised it, acted as a source of inspiration and guided the visual elements for the whole campaign. 
The Moodboard

The visuals for the Google loves Green online campaign were inspired by the images in the moodboard below. There is a rising trend in graphic design where vector illustrations embrace their flatness with minimal designs and monochromatic colour palettes. These illustrations are often paired with a slim black outline to help with shape and detail. I thought this style matched the essence of this online campaign. That is lighthearted, fun, and quite cheeky. This style, as simple as it is, packs quite the punch as it is effective in its presentation. It's clean, slick, and tailor-made for a web campaign. 

How Green Speaks
The Typography

Futura was used as the main font for almost every element of this campaign. Futura is an extremely neutral font that doesn't own itself to a specific culture or era. Therefore it was the perfect choice to represent green throughout all the phases of this campaign as green's meaning is also very ambiguous. Futura is also a web safe font, which is extremely important in the context of this campaign because it's an online campaign.

Each of the 3 phases of this online campaign makes use of their own rules concerning type rules. 
A Type Frankenstein

This campaign's Google Doodle is constructed using 2 two typefaces, Futura and Lato. All the letters are from the Futura typeface except for the lower case "g", which is from the Lato typeface. Futura is one of the typefaces that most closely resemble Google's original logo. As for Lato's lower case "g", it's more expressive, which fits the goal of the Google Doodle more. Lato's lower case "g" is more illustrative in the way it presents itself. 
50 Gradients of green
The colour palette

Considering the nature of this online campaign, celebrating green is the top priority. It only seemed fitting to make the colour palette of this campaign unapologetically green. Thus you'll find nothing less than 50 gradients of green throughout all phases of this campaign. Below you'll find the coordinates of some of the most reoccurring shades and tints of green. 

These few swatches may not look like a lot but believe me, they pack quite the punch. When it comes to making gradients, the possibilities are endless.
The green route
The grid system

The grids used to construct two elements of this campaign, the website and the editorial spreads, were constructed using the rule of two's. These grids consist of two columns and two rows. The borders, padding and gutters of these grid systems depend on the requirements of the respected elements.  

Concerning sizing: The Google Doodle is the only element of this campaign that didn't use a grid to construct. It also doesn't have a set size as it'll depend on the web user's own screen size.  

The Website's Grid

The Width is 1920px  
The Height is 1080px 
The grid system that the website follows has a 75-pixel margin all around. Some gutters are also present that are 27 pixels in size. The gutters assist the spacing between the tiles to remain consistent. Here is a sample that demonstrates just how the Green Hause website uses the grid system and how the tiles make use of the gutters.
The Spread's Grid

The Width is 1080px  
The Height is 720px 
The grid system that the editorial spreads follow has a 45-pixel margin all around. Some gutters are also present that are 27 pixels in size. The gutters assist the spacing between specific elements to remain consistent. Here is a sample that demonstrates just how the editorial spreads use the grid system.​​​​​​​
Greetings!

Hello and welcome to international colour day! This year we're planning quite the gala for green. This fabulous event consists of three phases. Firstly there's a Google Doodle that'll welcome you into the Green Hause, our promotional website that celebrates everything green. The Green Hause website is where all the shades of green accumulate for your convenience. Here you'll be able to read about and discover a myriad of stories concerning the colour green and believe us, these are some hot topics you'll want to familiarise yourself with. Green is a wonderfully complex and contradictory colour full of stories, meanings, connotations, and cultural nuances. It's an unmissable colour that saturates our world to a point where we take it for granted. Green is a phenomenon worthy of celebration, and that's exactly why this gala's in motion.

This assignment offers a solution for ISTD 2022 Brief 4: A Colourful Story.
An explanation you don’t need to google.

This Google Doodle will function as the "face" for the Google loves Green celebration. It'll be the first thing people see and interact with. The Google Doodle showcases some of the most popular and relevant green icons. You can see fresh on display, a dragon, a fairy, a green-eyed monster, a ufo, a traffic light, a circus tent, and a pair of four-leaf clovers. Some of these green icons may be, depending on the user, obscure or super obvious references to green. Something sweet to feast your eyes on before you CLICK and enter The Green Hause website.
The Green Hause

The Green Hause is a promotional website that celebrates the colour green for International Colour Day. It's the result when a user clicks on the google doodle. Here users will be greeted with a bunch of live tiles with short headings and subheadings describing a scenario regarding green. Some tiles also feature a matching illustration. All these tiles, when clicked upon will open an editorial spread with well-crafted typography that tells a story regarding green.
What green means​​​​​​​

The editorial spreads, without a doubt, are the stars of the show. They are fun, dynamic and unique from one another. As mentioned previously, these editorial spreads are a part of the third and final phase of the journey when a user clicks on a live tile from The Green Hause website. The editorial spreads are all uniquely designed to match the specific theme, culture, or era that their green story represents. They are all unique from one another and offer a different experiences. Some even have a green colour coordinate that's uniquely connected to the story being told.
Spread 1
Ghastly Goblins and Ghouls

The first editorial spread featured, titled Ghastly Goblins & Ghouls, explains greens’ connection to the supernatural. It's designed to reference old Hollywood horror tropes, as seen most clearly in the campy font. Nodding to classic cinema monsters that were green like Frankenstein and Elphaba, the Wicked Witch of the West.
Spread 2
Death by Paint

Editorial spread number two, titled Death by Paint, explains greens’ connection to poison and sickness. This editorial spread delves into the story of green poisonous paint pigments of the past like Scheele’s green and Paris Green. These green pigments were extremely poisonous and were rumoured to kill Napoleon Bonaparte, the French military leader. The editorial spread mimics classic French wallpaper with detailed patterning that can also be seen in the ornately decorated typography.
Spread 3
Married in Green Ashamed to be Seen

The third editorial spread titled, Married in Green Ashamed to be Seen, explains greens' connection to misfortune and bad luck. The story describes how ancient Irish and Scottish traditions forbade brides from wearing green at their weddings as it was considered bad luck. Why would that be considered bad luck? Because green was the Fairy's colour and fairies would resent and destroy humans who wear it. Thus the typography illustrates a magical garden with glowing type and bushy plants that covers the words.
Spread 4
The Hooker's Green Hat

Editorial spread number four, titled The Hooker’s Green Hat, explains greens’ meaning within Chinese Culture. The spread delves past the typical connotations that Chinese culture has with the colour green and focuses on a very unique story regarding green. The story is that of a green hat. More specifically how that green hat represents infidelity. The typography emulates Chinese culture through the use of a stamp and organic patterns that look like brush strokes. The typeface that was used is very geometric, paying homage to traditional Chinese hats which, from the front, look like a triangle.
Spread 5
The luck of the Irish

The fifth and final spread, titled The Luck of the Irish, focuses on green and its significance within Irish culture. Green is very intertwined with Irish culture. This editorial spread focuses on the Irish landscape, Saint Patrick, clovers, shamrocks and leprechauns. All of these have a connotation with green and helped to define green within certain contexts and associations. The typography for this spread is inspired by the old Celts. The typography evokes feelings of joy and giddiness whilst nodding to the rich Irish and Celtic history with the vintage texture. 
03 Typography - ISTD: Google Loves Green
Published:

03 Typography - ISTD: Google Loves Green

Published: