Mana Habibian
granted logo.png

Tamwood-ui

 

Client Project

Tamwood Careers

Re-invent yourself

 
tamwood.png
 

Overview

Tamwood Careers is a part of Tamwood International College, which is a private post secondary college that offers vocational training programs in Canada, specifically 6 programs in hospitality, service and tourism.

The purpose of Tamwood is to provide students with opportunities to expand their horizons through the institutional and cooperative educational experiences designed to challenge and encourage personal and professional growth. They specifically target international students who want to gain experience working abroad.

We were given the opportunity to re-design the current Tamwood Careers website.

 

Project Deliverables

Design inception

Moodboard

Art direction

Style tile

Style guide

Hi-fidelity screens in sketch for web and mobile

 
 

The Challenge

Initially we were given complete creative freedom and the challenge was creating a cohesive brand guideline for Tamwood Careers that would separate it from its mother brand 'Tamwood College' but keep the entire brand feeling cohesive at the same time. 

However, during the second week of this three week sprint we were told that we had to use the existing brand guidelines in terms of colour, typography and logo. The change of direction posed another challenge all together. We had to find a way to use the colours given in a way that would create hierarchy and wouldn't clash together, to keep the brand feeling fresh and clean. 

 

The Solution

Colour coordination of the navigation bar allowed us to create hierarchy and reduce the clash within the brand colours. Each separate section of the website is using a specific colour and that helped create a pattern for the user. All programs are magenta, anything with regards to the school location and about the school is the 'Tamwood blue' and the student services is green. 

For typography, we used Fira Sans and Merriweather. Fira sans was used for all headers and sub-headers. It helped us create clear hierarchy of information, as it has a wide variety of styles and is very readable. 

Merriweather was used for the body text. We did so because the website is very content heavy and this font will make the user’s reading experience easier, as the serifs help guide the eye.

1_UFGx0qZvYGptKrZU7rn81Q.png
1_J05He2lo_0ApTZnqfed3eQ.png