Clue
employer
page

Clue is a menstrual cycle tracking app with over 12 million monthly active users.

Its website helloclue.com is an important resource for female health information for women around the world, with more than 3.5 million users each month.

Client

Clue
(while employed at Clue)

Role

Lead Product Designer

Platforms

Web

Time period

2018

The problem

Clue didn't have an employer branding page—a place where people could learn about the company culture, get a feel for day-to-day life at the company, and find out about open roles. So it was clear: we needed one!

The company was in active recruitment mode, and the end of the year was quickly approaching. We learned from research that people tend to look for jobs over the holidays. This was a great opportunity for us to get new talent on board—but we needed to do it fast.

This project had a fairly short turnaround time of only two weeks, as management was eager to get the page live before the end of the year.

So our approach was lean. A very small team—a full-stack developer, a product owner and myself—set a goal to deliver a strong page that wouldn't need much iteration after launch.

The approach

The process

The short timeframe of two weeks meant we cut a lot of corners and steps we’d take in a typical design process. We decided not to do any prototyping, and instead go straight into development.

I found that there are some great benefits to working under a tight deadline: the steps are very clear, everyone is focused, and there isn’t a long decision-making chain.

1

Research

linetoright

2

Wireframe

linetoleft

3

Design &
photography brief

linetoright

4

Implement

linetoleft

5

Design QA

linetoright

6

Ship & analyse

Research

Since time was too short to conduct extensive research, we limited ourselves to two methods:

icons-01

Stats analysis

We looked into the performance of existing Clue's jobs page and had an important finding: about 80% of the visitors came from desktop computers and not mobile phones. We decided to optimize for desktop, which was counterintuitive.

icons-03

Market research

We put ourselves into the shoes of job seekers and looked at employer pages of other companies. Which experiences resonated with us?

Wireframing

Based on our research, I designed some layout variations. We picked the version that was most suitable for the content and technically feasible.

wireframe1
wireframe2
wireframe3-1
wireframe4

Visual assets brief

Based on the wireframes, I briefed an external photographer and Clue's own illustrator on the visuals we were looking for.

In parallel, I synced with the content team to get started on the copy. The wireframes gave them an idea of the story we were trying to tell with the page.

Illustrations

Screen-Shot-2020-02-07-at-13.10.53
Screen-Shot-2020-02-07-at-13.10.46
Screen-Shot-2020-02-07-at-13.11.11
Screen-Shot-2020-02-07-at-13.11.14
Screen-Shot-2020-02-07-at-13.11.08
Screen-Shot-2020-02-07-at-13.11.00
Screen-Shot-2020-02-07-at-13.11.04
Screen-Shot-2020-02-07-at-13.10.56

Illustrations by Marta Pucci

Photography

jobs_page-hero-2
office-desklife2
office-meditation3
office-freya

Photography by Franz Grünewald

We wanted to make sure potential candidates actually saw the page. While finishing the design, we generated some solutions to increase the visibility of the page on the site.

We landed on a contrasting banner on the homepage that linked directly to the jobs page. To save screen space and not be too intrusive, we displayed the banner only on the homepage and not on article pages.

Since we had learned that most people were looking for this page on desktop, we kept the design subtle for mobile devices and placed the link in the hamburger menu.

Optimising the funnel

snackbar_desktop

Desktop

snackbar_mobile

Hamburger menu on mobile web

The finished page

1-1
3
5
2
4

Conclusion

conclusion-icon

The page was a success: Page views went up by a multiple in comparison to the external job opening page we had used before. There was also a big sense of accomplishment for Clue since now there was a page to refer to when talking about company culture.

The biggest challenge was the short timeframe and pulling the content together. Since employer branding was a topic that hadn't been touched before by the company, we had to confront questions about how we want to portray Clue—and answer them with our gut feelings. But this in turn made the content genuine and straightforward.

More?

Clue app onboardingUX // UI // mobile

Etsy AwardsUI // web // branding

Interaction spaceUI // mobile

Clue employer pageUX // UI // web

Helloclue.comUX // UI // web

You made it to down here! Might as well say hi :)
hello@susivetter.com

Copyright © 2020 Susi Vetter