The task at hand presented a UX challenge: designing an onboarding page for numerous new employees, each with varying job roles and locations around the world, while also collaborating with a team of stakeholders who are working on rethinking HR processes. I had to come up with a solution that is flexible and able to adjust to different needs.
The challenge was to design an effective onboarding page for hundreds of new employees every year from different parts of the world, and with various job roles. It was impossible to create a one-size-fits-all approach due to the diversity of employees and offices, so the solution had to be flexible and able to adapt to different situations. The solution had to be approved by a team of stakeholders tasked with rethinking HR processes, making it crucial to align the new page with the overall concept of the onboarding process.
Using the Design Thinking method, I came up with creating a template for the page - a structured yet flexible onboarding page.
The process below took ~1.5 months:
I worked as the UX designer for the project with another UI designer, and was responsible to propose the solution.
Stages: Empathize → Define & Ideate → Wireframe → Design
Empathize
My colleague and I created an interview protocol and proceeded to conduct interviews with 6 recently hired employees from various global branches. While we maintained a structured approach, we also allowed for unplanned questions on relevant topics that arose during the interviews. One participant, for instance, pointed out a notable difference between their unsatisfactory onboarding experience and their positive experiences in the actual workplace.
At the end of each interview, we conducted affinity mapping - we took all the sticky notes where we wrote all the themes that arose during the interview, and divided them into categories of recurring issues, pain points, and insights. We then gathered the most important ones in a new category called 'key points.'
Define & Ideate
As the UX designer for the project, I needed to find a solution to tackle this challenge. To do this, I organized a remote session using the IQI (Insights, Questions, Ideas) methodology with 4-6 fellow designers. During the 20-minute session, I provided a brief explanation of the issue I was facing and presented the board summarizing the main themes, pain points, and insights from all the interviews. I then asked the designers to generate as many insights, questions, and ideas as possible based on the information presented, in order to brainstorm and gain different perspectives on the matter.
Following the IQI session, it became clear that the main goal was to develop a dynamic solution that provided structure while allowing for flexibility in terms of adding links and categories based on individual needs. The employees required guidance but also the ability to adapt to their specific requirements, particularly during the pre-planning stage of the onboarding process.
Wireframe
After considering various options, I decided to divide the onboarding page into 6 distinct sections, each with its own structure. Some sections are more structured, but still allow for some flexibility, such as the hero section which can contain an image, video, or just text. Other sections, like the 'Useful Information' section, are highly flexible and can be customized to meet the specific needs of different departments or branches.
For instance, the 'Useful Information' section is divided into two parts, 'Important Support Topics' and 'IT Support Topics,' based on the research insights. However, it's important to note that this is just a suggestion and each department or branch can decide to reorder the categories or use completely different categories to better suit their needs.
The solution was presented to the stakeholders, and it was unanimously approved by all of them.
Design