UX Concept Project | 2 Weeks | 4 People

The below case study showcases my full UX process. For a summary of the project please click here.

The brief

We needed to expand Upwork’s offering to include a new volunteering feature, without confusing it with their core function of being a platform for paid work. The new feature would allow users to browse opportunities and apply for jobs directly on the platform.

We conducted user research through 32 surveys and 16 interviews to discover the experiences users had with volunteering, what aided their decision to volunteer, and the steps they took to make their decision

Before starting the user research to understand the best way to design this feature, we analysed Upwork’s current website and segmented the user base into two categories:

• Freelancers

• Anyone working in a business who might post a listing

The interviews proved more beneficial towards the design of the final prototype than the surveys, since a lot of interviewees showed their true emotions towards volunteering. This was evident through asking questions like “What instigated you to reject an opportunity?”. It allowed us to build empathy quicker than the surveys, and dig deeper into the root causes of rejection, which in turn enabled us to improve our design features. E.g. creating a feature to build rapport with previous volunteers.

We ran two rounds of surveys as the first version was too broad and didn’t focus on skill-based volunteering. After tweaking the specificity of the questions, we received more relevant data from slack communities and freelancers. It was a great lesson on testing surveys with a handful of respondents first!

Creating an affinity map allowed us to discover embedded patterns in the data and helped gather meaning from the research

In order to do this, we divided the responses into themes. The most common ones touched upon duration of volunteering, trust, improving one’s skillset and employers needing volunteers to fit the job role. It was important that the data from the survey and each interviewee were written on different colours to denote frequency.

The findings from the affinity map highlighted the importance of volunteering for a cause and building a design for responsive web, but in the essence of time we designed for a larger viewport as a majority of interviewed users apply to jobs through desktop

Competitor analysis highlighted how we needed to differentiate volunteer job postings from paid listings and what the hierarchy of page elements should look like

We compared recruitment companies and volunteering websites to uncover the similarities and differences. The analysis showed that volunteering websites tended to focus on specific causes, their organisation mission, and the skills you can provide with the time you have.

We defined our vision of the design through our persona, Erick, as a representation of our research findings and a typical user of our product. We also created a proto-persona which enabled us to view the design build from the employer’s point of view too.

Erick represented the volunteer, and a CEO represented the proto-persona - the employer posting the opportunity. The proto-persona was not our main focus, but from making this ad-hoc user we understood how the feature would be seen and used by both volunteers and employers to design it effectively. The proto-persona was a CEO who finds it difficult to find enthusiastic and dependable volunteers who care about the cause she works for.

The persona was humanised through a storyboard to outline Erick’s average day and when he would use the volunteering feature. This allowed us to create a design according to his habits and lifestyle.

The storyboard combined the emotions and actions from the empathy and experience map to summarise his daily routine. The empathy map was created off the back of the persona to externalise our knowledge of Erick and dive into what he would say, think, do and feel. This was followed by an experience map, which told a story of his typical day, the devices he would use, and the frustration of not finding skill-based volunteering work for his portfolio. Therefore, the problem statement created was: Erick needs a way to add side projects to his portfolio because he cannot find paid work that matches his skillset.

The 6 “how might we” questions were formed with an intent to bridge the gap between the research and design phase. We chose one specific question to solve for which incorporated the most voiced frustration - trust.

How might we help Erick find relevant volunteering opportunities that he trusts within graphic design for a worthwhile cause?

The design studio helped translate the “how might we” question into multiple ideas

The design studio I facilitated on Miro combined divergent and convergent thinking from research to ideation in 2 hours. We created 6-minute timed sketches of potential screens to build upon and used dot voting to pick the most important features and how best they could be laid out.

We had opposing views on whether the feature should be part of Upwork’s current website or a totally new website. We solved this by bridging the gap between the two - having a separate site which was linked to Upwork’s homepage and followed the same branding, but was different enough to distinguish it as a volunteering platform.

I also sketched out a feature whereby volunteers could contact previous volunteers for a specific job. This would be a novel addition to the website, which other competitors didn’t have and was centred around trust.

Features were prioritised through an impact vs. effort matrix so we could focus on designing those which had the highest impact but took the least amount of effort

The fundamental components were all labelled as high impact and low effort in the “do it now” section, with the unique feature to contact previous employers requiring higher effort if an additional page needed to be created. At this point we revisited the brief to ensure we were answering it correctly with our ideas.

Now we knew the main components of the volunteering website, building the site map helped to create the structure and user flow

The primary navigation of the site map mirrored Upwork’s main categories of skills as it was still part of their organisation. In some respect, this removed the urgent need for card sorting, although it would have still been useful if we had more time. We chose five of the main categories from Upwork’s website to start with. The user would sign up using their existing Upwork account, click on “Design & Creative” and then “Graphics & Design”.

We found it more useful to carry out users tests with the low fidelity digital wireframes rather than sketches as they contained more detailed labelling we wanted to test

The user feedback from the low fidelity usability tests drastically changed our mid fidelity prototype. The most hard hitting one was — “It has no soul.” While the labelling was clear to users, we made the pages more visual, introduced the sign-up option later in the process, created another user flow, and I developed a feature which allowed a jobseeker to contact a previous volunteer. It made the website stand out, and built upon the research findings of creating trust between the employer and volunteer.

We iterated to mid fidelity while incorporating user feedback into our designs. This allowed us to test more functionalities, navigation elements and labelling of the website.

The test results highlighted that 6/8 users clicked on a cause rather than selecting graphics & design from the main navigation. In light of this, we developed an additional user flow that would allow the user to choose a job by cause.

Users demonstrated positivity when shown a novel feature on the job description page that generated trust, but it was ignored by 5/6 users when they landed on the page

As trust was paramount from the research, I developed a feature that allows job seekers to get in touch with previous volunteers to have an honest and open conversation about the company and role. The actual implementation of such a feature in the real world would require marketing support and GDPR compliance.

To ascertain whether users would use the feature without being prompted to, I gave them a general task of applying for a job, but to keep trust in mind. 5/6 users got to the end of the task without addressing the feature. As users initially showed an overwhelmingly positive response to the functionality of it, more testing would need to be done to analyse whether it needs to sit more prominently on the page for users to actually notice it.

The high fidelity prototype incorporated changes from previous iterations and most issues from the user feedback

The user research and competitor analysis was crucial in uncovering ideas for the key features that led into the final design solution. The prototype below is a demo walkthrough of the website, which demonstrates the two flows we created:

1. The user journey of the volunteer searching by cause.

2. The user journey of the volunteer searching by skill.

To differentiate the website as a volunteering website we gave it a fresh look while still adhering to Upwork’s branding

We opted for a lighter shade of green for the accent colours compared to Upwork’s darker shade. As the website was still part of Upwork’s brand, we followed through with the dark blue but added a lighter shade of blue for contrast.

How would I measure impact?

If this new volunteering website was launched, it would be measured through new sign ups, the volume of companies signing up and the customer retention rate over a 6 month period initially. The website would be monitored on an ongoing basis for improvement, with any large dips in usage optimised through A/B testing and research.

Next steps

The next step of this project would be to test the high fidelity prototype and add features we didn’t have time to develop. The first being a soft skills quiz at the end of the application for aspiring employees to include on their profile for their future jobs. The second idea would be to introduce mentorship collaboration to strengthen the employee’s skills within their chosen industry. That being said, as this project is part of Upwork’s main offering, I truly believe it would be beneficial to release this sister site as early as possible to its user base in its functional form, before adding in more features.

Reflection

Our team had a retrospective which I believe was invaluable to the progression of the project to outline what we should start, stop and continue doing. Voicing our opinions enabled us to move from designing a feature within the constraints of Upwork’s current framework, to creating another website which was still consistent with the core offering, but fostered creativity. As a team, we bounced off each others strengths, provided constructive feedback and looked at our work with a critical eye, which I believe is invaluable for any project.