JobAdder Navigation Redesign
JobAdder is a global recruitment platform built for staffing agency and in-house corporate recruiters. Used by over 10,000 people every day, we empower recruiters all over the world to recruit smarter and simpler.
The previous navigation was a full width, persistent and took up 1/4 of the screen at all times. Users had always made comments and complaints about not being able to use the full height of the screen to view jobs, job ads and candidates.
Starting with mapping the information architecture of the JobAdder suite of products with the aim to iterate and streamline the complex world of JobAdder.
I researched equally complex SaaS products to explore how others solved the same problem. Using them as inspiration to help evolve potential options.
I created wireframe upon wireframe with no fear of failure, just aiming to throw as many ideas at the wall to see what sticks.
A small sample
Once I'd found and got sign off on a solution that covered all business and user goals I moved onto high fidelity designs using the Venom color palette and giving focus to accessibility.
Then moving from Sketch to code, I created a prototype to explore the interactions and animations.
Working closely with the developer, Alex Periphanos, the navigation was implemented so we were able to test it with out users.
Learnings and iteration
The average JobAdder user isn't overly tech savvy so I chose to limit breaking mental modals where possible. Instead of restructuring the information architecture, I left that to a future version.
Another important choice was to default to the navigation being expanded. Initially having the labels visible will allow the users to easily navigate and when comfortable, collapse the nav to utilize more of the screen.
The navigation launched mid-December, after a small group of users got access to it with positive feedback. Once globally live, the feedback too was overwhelmingly positive.
We've moved (to the left) 👈🏼 Say hello to our new side navigation bar! Visit any JobAdder page with a single click and leave space for the important stuff with minimised & expandable view options. pic.twitter.com/crp84KLGqV— JobAdder (@JobAdder) December 12, 2018
Redesign & Design System
After multiple UI design explorations, I started defining patterns, documenting & building out the Sketch component library.
Base design elements
Main table view before and after
Candidate details before & after