Scheme page redesding - Wellcome.org

 
 

Background

The scheme pages on wellcome.org allow users to see all schemes that are open and identify which schemes they are eligible for.

My role

As the lead designer, my responsibilities included research, workshop planning, workshop facilitation, prototyping, and handing over the final designs to the team's developers. I was part of a cross-functional product team, working alongside a product manager, user researcher, engineers, content designer, and agile coach.

The challenge

Wellcome offers many funding opportunities (schemes) across multiple research areas and career levels to which researchers can apply. The content hierarchy, page templates, and language used across the different scheme pages must be more consistent. Because of these inconsistencies, 12% of applications received by Wellcome are rejected due to the researcher being ineligible or their research being unsuitable to the scheme. And given that applications can take hundreds of hours across several months to complete, this presented a big problem we wanted to resolve.

Task

My job was to create a single template for all scheme pages with the following success metrics:

  • Users will be able to identify the eligibility requirements of a scheme correctly

  • Reduced queries to the help desk regarding eligibility

  • Reduced number of applications being rejected due to eligibility issues (currently 12%)

  • Increased traffic to the remit page (The remit pages are linked in the scheme pages and go into more detail about what Wellcome does and does not fund)

The process

I first needed to tackle the inconsistent content hierarchy across templates. I decided that the best way to achieve this would be to facilitate a workshop with key stakeholders.

The workshop

I planned and ran the workshop with the help of the content designer on my team.

I wanted to achieve two objectives with this workshop: first, I wanted the participants to make a group decision on what information the scheme pages should include, and second, I wanted everyone to agree on the hierarchy of information on the scheme pages.

The activities for the workshop were as follows:

  • Overview of users personas, their goals and pain points.

  • Empathy mapping

  • What users need to know and why

  • Dot voting

  • Content ordering

User personas, goals and pain points

Before going into the empathy mapping exercise, I wanted to give everyone an overview of the different personas we needed to think about, along with their goals and paint points.

Below are the paint points that users were facing, along with the detailed personas.

Paint points:

  • Users take time to read the content but struggle to understand eligibility, cycling between scheme pages to compare criteria. This behaviour occurs mainly between the discovery awards.

  • Users are struggling to understand the difference between eligibility and suitability

  • 12% of applications are being rejected on the grounds of being ineligible

  • A third of those rejected applications are coming from Lower middle-income countries

  • Some users do not understand that some of the schemes are recurring.

  • Some users don't understand what some language we're using means.

  • Some users are struggling to find essential information, such as career stage information.

Empathy mapping

Following the personas overview, the first group activity of the workshop was to do some empathy mapping to help everyone better understand our users and their needs.

What users need to know and why

With everyone in the workshop having a better idea of what users would be thinking and feeling when looking at the scheme pages, we moved on to the next activity, which was for everyone to write down all the different types of information users would be looking for when arriving on the scheme page. All ideas were affinity-mapped and given new labels.

These new group labels were to be used when going into the day's final activity.

Content ordering

The final activity of the workshop was for the group to agree on the desired order of the affinity-mapped groups. These would serve as the new order of sections on the scheme pages.

Improving the content

For this part of the task, I worked closely with the team's content designer to improve the content on the scheme pages. The content designer rewrote the content, but I identified the areas for improvement.

There were two areas I identified in which we could improve the content:

  • Removing content on the page that would make more sense elsewhere, such as how to fill out an application form

  • Using plainer English to make the content easier to understand for more users

Improving the UI

One of the biggest areas for improvement I identified with the scheme pages was the excessive use of accordions. While they do a good job of shortening the overall page lengths, they also hide key information, sometimes behind multiple levels, resulting in many users never finding the information. As a result, I decided to remove most accordions, making the information more visible. For the accordions that remained, I updated the component design to include a show/hide label next to the icon.

Old accordions on scheme page

New accordions

 

Another change I wanted to make to the UI was reducing the number of timelines shown on the page simultaneously. At Wellcome, some schemes are recurring, which means multiple timelines are displayed to users simultaneously. This can make it difficult for users to find the specific timeline they are looking for.

 

Final scheme page designs

The new template is still being rolled out across all scheme pages on wellcome.org. As things stand, it is still to early to tell if the changes made have had an improvement to applications being rejected based on eligibility. But early indications are positive, and there has been a rougly 400% increase in traffice from the scheme pages to the remit pages as a results of these changes.

 
Video Block
Double-click here to add a video by URL or embed code. Learn more