User Research / Website Redesign

Refreshing the SPC Hiring Experience

Refreshing the SPC Hiring Experience

Refreshing the SPC Hiring Experience

Student Price Card | Fall 2023

Context

Context

SPC is a student loyalty discount program in Canada that offers discounts and deals on items such as fashion, food, shoes, travel, and more. 


During my time there as a design intern, I owned the revamp of the company careers page.

Timeline

April - September 2023

(16 weeks)

Team

1 Product Designer (Me)

2 UX Researchers

1 Developer

Constraint

Limited development resources

What's the Problem?

SPC’s Careers page is outdated — falling behind newer, user-driven competitors like Student Beans and UniDays. SPC struggles with recruiting high-quality job candidates due to the confusing and poor UI, leading to low talent attraction and financial losses. 

Goal:

Revamp the Careers page to streamline talent hiring process, and showcase SPC’s fun work culture.

Key User Action:

Apply to Job openings

User Persona

User Persona

How might we…

Redesign a compelling, user-centred Careers page to attracts top talent?

UX Audit

UX Audit

I wanted to understand what SPC is lacking and what other companies in the industry are doing right. So I started off by doing a ux audit.

Inconsistent with the brand's visual identity

Inconsistent with the brand's visual identity

Company story is not appealing and unique to industry

Company story is not appealing and unique to industry

Lots of additional friction due to redirecting links

Lots of additional friction due to redirecting links

Competitor’s Analysis

I expanded my research beyond direct competitor sites to gain a broader perspective on industry best practices and to benchmark against leading talent attractors.

Direct Competitors

Direct Competitors

Takeaways
  1. Colourful, 3D elements attracting attention

  2. High usage of people imagery

  3. First-person, relatable tone of voice

Leaders across Industries

Leaders across Industries

Takeaways
  1. Quick links are accessible on hero section

  2. A quick overview of all the company benefits and perks

  3. Highlight industry-specific successes & testimonials

  4. Deliver valuable insights on their industry to build trust

Primary Reserach

A survey to 20 current job seekers told me their current frustrations and what they value:

  1. 3 users said that they like to find out about “the people who I will work with and the culture.”
  2. “Not knowing how long companies take to respond” is frustrating for 5 users.
  3. 67% of users rated "information on job openings" as the most important when visiting the Careers page, followed by "employee testimonials" ( 60%), and "company overview"(47%).
  1. 3 users said that they like to find out about “the people who I will work with and the culture.”
  2. “Not knowing how long companies take to respond” is frustrating for 5 users.
  3. 67% of users rated "information on job openings" as the most important when visiting the Careers page, followed by "employee testimonials" ( 60%), and "company overview"(47%).

Deciding on a Narrative Structure

Deciding on a Narrative Structure

A narrative structure is integral to telling a good brand story. The product owner provided a very specific narrative structure for the new webpage, but based on my research and UX best practices, I thought some adjustments could be made.

Narrative Structure Provided by Product Owner

I stuck to the conventions apparent on most careers pages. With students in mind though, I saw two main approaches for presenting our brand story and careers information.

Content Split

Content Split

Splitting information into 2 pages brings familiarity

Quicker access to job-related information

Removing nesting categories to reduce cognitive load

Long page scroll reduces scannability

Content in 1 Place

Content in 1 Place

One-stop shop of all company and job information

Optimized for info priority (based on survey)

'About Us' button not effectively used

Long page scroll reduces scannability

We decided on the Content Split approach because it maximizes the value of a careers page: a goal-driven approach to presenting information on a page that is digestible for the applicants.

Webpage Style

Webpage Style

The product owner also provided very specific wepage style inspiration.

The product owner also provided very specific wepage style inspiration.

Moodboard provided by Product Owner

Moodboard provided by Product Owner

  • flat colours

  • Sharp, clean lines and shapes

  • Professioal tone of voice

Examples of current website assets

Examples of current website assets

  • Colourful

  • Youthful and fun text and image treatments

  • Relatable tone of voice

This vastly differs from our current branding and themes of our direct competitors. I wanted to explore different themes and their impact to the SPC brand perception, from professional to illustrative:

This vastly differs from our current branding and themes of our direct competitors. I wanted to explore different themes and their impact to the SPC brand perception, from professional to illustrative:

Professional

Illustrative

Imagery-centric

Imagery-centric

Brand - Portrait imagery leans into being people-focused

Simplicity - Photo grid is easy to implement and resize

Brand - Missing the fun element of the brand

Clean illustrative

Clean illustrative

Brand - Team imagery invokes friendliness and warmth

Brand - Rounded button are approachable

Brand - Parallelogram isn’t a part of the current brand

Robustness - Decorative icon doesn’t reposition well for mobile

Illustration-centric

Illustration-centric

Brand - Rounded button are approachable

Brand - Lack of people imagery doesn’t create a sense of community

Robustness - Decorative elements don’t reposition well for mobile

We decided to move forward with a “clean illustrative” approach — the best of both worlds.

Design Decision

Presentation of open positions

Imagery

Imagery

Friendly, approachable imagery

Not robust -- difficult to translate to mobile responsively requires significant effort for each item

Cards

Cards

Easy to scale

Easy to manage collection lists

Ability to filter teams

No spotlight of culture & community

Design Decision

Design Decision

Presentation of testimonials

People-forward

People-forward

Expansive imagery is welcoming and authentic

Visually intersting

Images likely won't scale well without custom tweaking

Testimonial-forward

Testimonial-forward

Recycles similar layout in 'Company Value' components

Not scannable — difficult to digest all the text at one glance

Missing the relatable, friendly look and feel of the brand

Aligning with the Developers

Aligning with the Developers

This project wrapped up as my internship came to an end. I didn’t get a chance to oversee this project being sent off to developers, but I did meet with the team to get their opinion on feasibility. Their feedback influenced some final decisions:

This project wrapped up as my internship came to an end. I didn’t get a chance to oversee this project being sent off to developers, but I did meet with the team to get their opinion on feasibility. Their feedback influenced some final decisions:

  1. tone down on micro-animations
  2. Keep breakpoint optimization in mind on design

Presenting a vision – prioritizing efficiency and scalability over a one-hit-wonder

Presenting a vision – prioritizing efficiency and scalability over a one-hit-wonder

I presented to project to the product owner and senior management as a proof-of-concept for what the rest of the SPC website could look and feel like.

I presented to project to the product owner and senior management as a proof-of-concept for what the rest of the SPC website could look and feel like.

Before

Before

After

After

Reflection

Reflection

Validate Top-Down Requests (if possible)

Even if you’re handed really specific instructions from the top, it’s worth taking a second to validate them. You might end up spotting some unexpected opportunities or ways to make things even better than planned.

Present Options Wisely

It’s great to give people a few options to choose from, but try not to overdo it. Too many choices can lead to decision fatigue and end up stretching the project timeline longer than needed.