Optimising Job Search Platform for Mobile Devices

Job Search Platform of PENNY Career is a Job Marketplace with approximately 4200 Job Ads in PENNY Markt. It is also connected to REWE Group Job Ads that has more than 15k additional jobs. The Job Platform helps PENNY Markt to recruit new employers from different fields more efficiently, such as Retail, Logistic and Salesman.


Client
PENNY Markt Karriere

Roles
UX Design | Lead UI Design | UX Research | QA | CMS

Methods
Behavioral Analysis | Competitors Analysis | UX & UI Best Practices | Interface Design | Accessibility

Background

The 2021 PENNY Career relaunch was on tight budget and most of the it’s structure, search engine, layout was based on the REWE Career job platform (a partner of REWE Group) which was launched desktop first. Since the job search platform was developed desktop first, we were concerned with the usability on mobile devices.

The fact that PENNY project was on a tight budget, we didn’t have the possibility to do a thorough qualitative usability test before or after the relaunch, and therefore were not able to confirm if the REWE job search platform is working well for mobile devices.

PENNY & REWE Job Search Platforms

Strategy

I facilitated a workshop with stakeholders to define a new roadmap for the next couple of months. In this gathering we discuss the problems user might face, trends in the job and innovation market and brainstorm what we could do or improve in the future.

With the data collected from tracking after the relaunch, we learned that 80% user traffic came from mobile devices. Those numbers convinced stakeholders how important it is to optimise the platform for mobile devices. This task was chosen by all workshop participants and stakeholders as the priority one this year.

Goal

  • Reassure the efficiency of the current design for mobile devices.

  • Do research that will back up the efficiency of the current design.

  • Provide alternative solutions if needed.

  • Use methodologies and solutions that are cost effective.

Research 01

Since we already had heatmap tracking recordings from PENNY Career website, I use the quantitative data to analyze the platforms cost efficiently. I observed multiple recordings and learned user behaviors with Mouseflow. Mouseflow is a behavior analytics platform used to optimize website experiences towards improving conversions. I used it to draw conclusions and shared heatmaps and session recordings with stakeholders to add visual context to recommendations.

With Mouseflow I also collected following data:

  • Task success rate
    Times Users applied for jobs vs Number of attempt.

  • Time on task
    How much time it took them to apply for a job.

  • Use of search & filter
    Number of times the search and filter have been used until user applied for a job.

Behavioral Analysis

  • Difficulty in navigating between verticals. The search field and the search results were too far from each other.

  • Issues with discoverability.

  • Numerous clicks to achieve simple actions.

  • Users had a hard time finding the search results, after interaction with the filter. A significant number of users had to refresh their search result multiple times after using the filter, which affected the time to task and the drop off rate.

Research Findings

Research 02

Competitors Analytics & Best Practices

After learning about the struggles of our users, I decided to do benchmarking beyond the direct competitors - beyond the job platforms of discount retailers based in DACH region. I looked for search-filter-result features of well known platforms with big user traffic. I also did a research on best practices that are already well tested and have stated proves. In total I benchmarked 20 Websites for UX and UI practices with search-filter-result.

  • Best Practice: Filter showcased in form of Dropdowns, Flyouts and Overlays.

  • Best Practice: Filter positioned before or after SERP.

  • Best Practice: No confirmation CTA in the SERP.

  • Best Practice: Confirmation CTA in Filter

  • Most trending Form of Filters are Chips List and Slider Chips

  • A Search Result in a List is used primary, while Search Result in a Map secondary.

Research Findings

Competitors Features Comparison Table

Ideation

Since mobile devices have smaller screens, but should not have less information than on desktop devices, I gathered research and did quick ideation workshop involving open discussion with team members. We defined in the workshop our higher priority features and lower priority features.

Define

Filters and categories are a necessary standard that allows excluding unnecessary items from massive search results. That is why in status quo the filter was placed prominently after the search field and before the search result. The challenge is to present the most important information to the users clearly and coherently. We decided that options that allow users to personalize their search results should not interrupt the users from achieving their goal. The options of personalisation should be discreet but easily findable.

Solution

  • Search field, filter and search result should be showcased in the first viewport.

  • Any unnecessary image or decor elements will be removed to reduce distraction from search and search results.

  • Search results in a map should have a secondary function.

  • No confirmation of CTA in SERP.

  • Filter and sorter showcased together in a flyout.

  • Filter in Form of Chips List.

  • Confirmation CTA inside filter-sorter flyout includes responsive result numbers.

Layout Before & After Iteration

Interface Design

With the new UX solution we wanted to update the visual design of the job platform since it was adapted from the REWE launch in 2019. We proposed more fresh and young elements to the design guideline.

Design Before & After Iteration

Accessibility

We also paid attention to the European Accessibility Act (Directive 2019/882) which requires some everyday products and services to be accessible for persons with disabilities.

Accessible UI Elements States

To be continued…

The optimisation is in developement. Next step would be Quality Assurance to make sure all new features work smoothly on different browsers such as Safari, Chrome, Firefox in iOS and Android before getting it launched.

Plan after launching

Collect the same measures from Mouseflow and compare it with the previous data.

  • Task success rate
    Times Users applied for jobs vs Number of attempt.

  • Time on task
    How much time it took them to apply for a job.

  • Use of search & filter
    Number of times the search and filter have been used until user applied for a job.

Optional interview recruiters and costumer service to get feedback of changes before and after launching the optimisation. Compare application numbers, quality application and messages.