UX Design:

Redesigning the Hopper Careers Portal

How do you make it easy for job candidates to find positions relevant to their skills when you have over 150 active job postings? I redesigned the Hopper Careers portal to better organize our job listings in preparation for massive personnel growth.




Stéphanie Filion: Executive Program Manager

Thomas Fitzpatrick: Illustrator

Narative: Development

Landing page for the locations funnel. I opted to use the city illustrations our illustrator, Thomas Fitzpatrick, created to provide visual consistency with the rest of the illustrations across the site, and add a bit of fun!
View full image.

List of jobs sorted by location. I copied over the UI from the Interviewing at Hopper project to provide consistency and allowed further filtering by teams and categories.
View full image.

Landing page for job categories. The carrot "emojis" were placeholders for custom emojis our illustrator, Thomas Fitzpatrick, would make for the site.
View full image.

Before the redesign.

When job candidates landed on our careers portal, they were faced with a long list of over 150 job postings. We were expecting to experience a lot of growth, and therefor hire a lot of new Hopper humans, so we knew it would be necessary to make it easier for candidates to find relevant job postings.

In addition to preparing for a hiring spree, Hopper had recently revamped their entire internal structure into new verticals, departments, and teams. We wanted to educate prospective candidates of our new organizational structure.

A better, more organized solution.

After going through multiple formats, I landed on one that simplified the process and would help to educate prospective candidates on our new organizational structure. I removed the filters from before and opted for a simple search bar, so if users wanted to search by teams, business units (later renamed to job categories), or locations, they could enter that specific funnel and learn more about that part of the company.

I was working on this project while simultaneously designing and building the Interviewing at Hopper Guide (check out my case study!), so I also included a module underneath our job search funnels to encourage people to read it even before applying.

Hopper had also recently solidified all of their new culture material and we wanted to showcase all of the work our CEO had done to foster the culture of growth, curiosity, and support that eventually developed. By letting prospective candidates read about our culture before applying, we also gave them a chance to figure out if we would be a good culture fit for them before filling out an application. For this reason, I also sourced testimonials from multiple employees in multiple languages from all of our office locations so every user could read what it was like to work at Hopper, ideally in their native language.

Last but not least, we had to showcase the benefits that came with working at Hopper! I followed the previous design of these modules as they were present on multiple pages of the hopper.com website, so I wanted this new redesign to seamlessly flow with the rest of the site.

A helpful dead-end.

Before the redesign, if a user made a search with no job results, they would just receive the message "no positions found matching your search". Not very helpful, eh?

I designed a dead end that was friendly and helpful, suggesting some of our most commonly searched positions, or to search by location, team, or job category instead. This was intended to cover the case if there was a position open that did match their desired job but our nomenclature just didn't match their search query.

Invision Prototypes

The final site.

*Due to COVID and the subsequent hiring freeze placed at Hopper, this project was put on pause and is not currently live on the hopper.com website, but will be one day!