As part of a full website redesign for Hired, a closed job marketplace, I reimagined the jobseeker-facing web pages to improve candidates' interaction with the company and its content.
Spoiler Alert: After presenting the designs to leadership, they were approved to go live as part of Hired's site redesign!
collaborators
Content Strategy Lead, Creative Director, SVP Marketing responsibilities
UX Design
tools
Figma
timeline
3 months (50 hours)
For this project, I executed the UX process end-to-end but thoroughly enjoyed the UI/visual component in which I brought my vision to life through wireframes (more on the later!). Check it out the before and after, then get into the details.
the problem
Using a customized discussion guide, I interviewed users on their thoughts about the current Hired site and what their job search is like through specific and open-ended questions.
Jobseekers need a better way to access job search resources on the Hired site so that they can become top candidates and prepare for their next roles.
From the affinity mapping, I made conclusions that candidates don't feel confident using the site, the content architecture lacks organization, and when users do find a resource the accessibility and readability are low.
How might we balance these insights with business needs, emphasize Hired's value clearly, and increase engagement with resources to support candidates in the job search?
defining the user
Logically, I made a persona because I had not worked closely with a typical user and wanted a holistic understanding of who they are. With this, I then had an artifact embodying Hired users to reference for effective conversations about the project with stakeholders.
So, based on research results, who is the typical user (aka Ned)? Ned is an ambitious techie who's experienced and knows what he wants. But he needs a central place that makes his search easy and efficient. Ned could use a better way to access job search resources to be a top candidate (which will make his job search even easier).
Based on this persona and the customer journey, I prioritized web page features (using the MoSCoW method) based on top themes from affinity mapping and internal stakeholder feedback. I listed features related to organization and navigation as must-haves or should-haves, and more complex, interactive features as could haves or won't haves (for now).
sketches & wireframes
From there, sketched the first draft of the jobseeker resources page and blog. After thinking through my feature prioritization and affinity mapping, I translated the sketches into the initial wireframes in Figma. I included the "must have" and "should have" features. I also solved the content organization issues by including aspects like the blog tagging system and making clearer sections.
usability testing
From my first round of usability tests conducted via Zoom, I asked users to complete tasks like locating a blog on interview tips and bookmarking the post, which they did successfully. However, more than half of users hesitated (took some time to engage or expressed confusion) when tasked with locating the blog, initially missing the filter feature. As a potential solution to confusion, I focused on organization in the next iteration of the prototype. I removed CTAs (avoiding paradox of choice), reordered sections, and removed featured blogs on the blog homepage to bring prominence to the filter.
higher fidelity
I applied Hired’s existing branding to the new prototypes through colors and the use of details like the signature line illustrations. I did, however, make slight changes to improve accessibility. This includes page gradients fading to white from purple as opposed to vice versa. I also upgraded the body font to a sans serif, addressing user difficulties with reading the site’s original small serif font.
second usability testing
In the next round of usability tests, users successfully completed the same tasks I assigned in the first round. I made updates based on feedback to include a “back to top” button, make the blog sidebar sticky, and reformat the blog article hero to flow more seamlessly.
the final prototypes
See the prototypes in action below!
learnings & looking ahead
My designs received positive feedback from colleagues and leadership (including the SVP of Marketing and the Creative Director). They were approved to go live as part of our full site redesign! Before working with developers to launch the pages, I designed mobile versions to pair with the desktop designs. I hope to continue usability testing, applying SEO strategy to the copy, and assessing digital accessibility.
I anticipate more content clicks and downloads and am interested in measuring metrics like site traffic and the bounce rate to understand how users interact with the new pages. I'm also interested in studying how small animations (movement in the lines, for instance) impact site interactions and the overall design. Would users find it distracting or engaging?
With this project, I of course learned the ins and outs of UX Design. Most importantly, I understood the needs of the user to deliver work that would boost the impact of my company and how it engages with jobseekers. Reflecting on the process, I wish I had conducted more user interviews both initially and following each iteration. The more user insight the better!
continuing the redesign
After enough time passed, I reviewed analytics. This revealed the payoff of the redesign, especially the blog pages. Below are key results and samples of more pages I redesigned. I've continued to partner with developers to make them go live!
7 of 10
134%
15.4%
17%
29%
27%
top site pages by clicks are blogs
increase in employer blog clicks post-redesign
improvement in employer blog CTR post-redesign
increase in candidate blog clicks post-redesign
increase in blog homepage clicks post-redesign
improvement in blog homepage CTR post-redesign
© Meena Pyatt 2023