top of page

The Brief.

​

​

Sector:  Recruitment industry

​

Challenge: TH.0 – previously known as Talent Hack- is a recruitment company that organises online Hackathons in order to discover new talent for a wide variety of business. The mission was to do a rebranding of the company  and re design their user interface. This is real project and not a mock up.

​

My role: Marketing and UX  research, user interviews, branding, Interface design, Information Arquitecture.

​

Project time: 3 months

 

Here’s a preview of the final design. Please read further down the page about the creation process.

What I did.

​

Discovery research

​

For the generative research I focused on the competitor research on terms of services and UX design. I researched about the following companies that gave this key information regarding both services and design:

​

  • TaiKai

  • BeMyApp

  • Hackathons

​

I had very interesting insights about the websites:

​

  • The user interface could be improved in all of them. Taikai has the best interface compared to the rest but some developments could be  made.

  • Chat box has been implemented in almost all sites

  • Information is spread through the main site with no structure.

  • They were all have a minor presence in social media channels 

User surveys 

​

We did two  separate  surveys regarding TH.0 as we were looking to expand services and also improve design interface. We did the survey to 22 people and we gathered this relevant information:

 

Marketing:

  • 7 people out 10 knew what TH.0 offers

  • They knew about TH.0  through a job portal and LinkedIn

  • They rated 3 out of 5 regarding how informative the website was.

  • Regarding which Hackathons there were more interested in the following came up: Pride, International Women’s day and FinTech.

  • They wanted to improve their professional skills but they struggled to understand how a Hackathon could help them to achieve it.  

​

 UX:

  • They pointed out that the design was a poor and another type of interface would make the company more trustworthy and to them more likely to sign up for the services.

  • General feeling that is a random company and doesn’t stand out because of the poor  UI design.

  • They commented  Talent Hack needs to be easier to navigate.

  • Have more information about what a Hackathon is about.

  • Have more information about the benefits to join TH.0

  • After visiting the website 5 out the 22 still didn’t know what the website was about

  • More interactive layout.

  • Good feedback about contacting the company through Whatsapp or Telegram.

  • Ideal to have curated content.

  • Fast to download all the information.

  • If  you could read reviews from trustworthy sites like TrustPilot about Talent Hack would help them to sign up.

User persona 

​

In order to empathize with the key audience, I developed so-called proto-personas, which are based on observations and some assumptions. After interviewing few prospects I wrote down the key features for both sides. 1. Individual that would like to sign up for a particular Hackathon 2. Company that is interested to hire new talent in a non traditional way. 

TH.0 persona2.png
user persona TH.0.png

Information Architecture

​

Content audit

​

Following  Talent Hack brief we created a new sitemap with the new services that the company wanted to provide Workshops, mentoring, online academy, CV review, etc.

The new features were classified in different stages depending on urgency and time of development. Talent Hack CEO considered that unpaid features were more urgent that paid ones and that is were we focused our strategy.

​

​

WebFlow

​

A sitemap was created with all features and colour coded depending on the stage of development.

The whole website was redesigned in order to satisfy client requirements.  TH.0  clearly wanted to develop all the unpaid pages first and we focused to redesign all Hackathon pages – one for each month of the year – about us, contact us, FAQ’s and services

sitemapTH0.png

 

Design

​

Mid- fidelity prototype for early evaluation

​

The design team created low fidelity sketches for each Hackathon page and also for the main page.  Mid- fidelity prototypes were created straight after and this is the result of some of the Hackathon and main landing page that were re design on a later stage. 

Landing page

Landing page1.png

Hackathon page

Hackathon_–_2.png

About us page

About us.png

Contact us page

Contact us.png

Validation research

​

​

The main findings from the early validation research with mid- fidelity prototypes were:

​

  • Participants were pleasantly surprised about the main page. They described it asprofessional and engaging.

  • Participants were happy that the main homepage wasn’t cluttered with so many music options.

  • Participants really like the SuperHero idea and they found the main landing page very clean and easy to follow.

  • Regarding the Hackathon page they commented that they found it too colorful and it needs to have a more neat interface.

  • They commented that having "TrustPilot" reviews on the main page made the company more trustworthy and they would be more likely to sign up if the reviews were good. 

  • Comments regarding "About Us" page:  They would like to have more information about the company and they would like to be able to click on the 3 icons ( mission, vision and values) and get extra information about it. They suggested that there was too much white space and the images were standard ones. 

  • They gave  thumbs up  to the "Contact Us" and they suggested it will be nice to have a chat box or a quicker way to contact them rather than email or phone number.

Final (high fidelity) prototype

​

Building the final prototype, we changed some parts of the landing page. We added more information and that was relevant to the participants.  On Hackathon page we added a countdown clock for the next challenge and we made the page less colorful to make focus the attention on Hackathon boxes. Regarding About Us page, we changed the images and also delete that much white space. In Contact Us page the "leave a message" was moved all the way up and a chat box was approved for faster interaction.

​

TH.0 logo colors were taken as reference to design the new interface  and also the images were taken from the same stock file to keep a cohesive structure. 

​

New pages were approved for design such as Privacy Policy, Rules, FAQ,s, Services among others. The video below shows a XD file with all the pages that were created for this project.

Landing page

Landing_page_–_15.png

Hackathon page

Hackathon_–_2.png

About Us page

About us – 1.png

Contact Us page

Contact us.png

The result

​

By working on this project I learned to work closely on a big project with developers, project managers and marketers. 

​

It  was very important for me to understand what type of deliverables the Developers department need and meet with them on a daily basis to understand that it could be achieved for the website in terms of coding. 

Also communication with marketing department was key in order to produce social media content that followed the same style guide than the rest of the website. 

 

I have also learnt that is crucial to design artboards that could be responsive re size in order to facilitate the work of developers and to make it 

​

I have also learnt that is crucial to do UX Research when you design the low fidelity prototype in order to design the mid - final fidelity one with much more accuracy.

​

This has been so far the most challenging project of them all because of the size of the project and all the people involve on it. 

​

​

​

​

​

bottom of page