Good Growth Hub X Local Champions: Intro To Freelance Quiz

Overview

I worked with Good Growth Hub and Local Champions to create key screens for a questionnaire that was to be embedded within the Good Growth Hub Website, and advertised via Instagram.

A Mobile first approach was used as the understanding that people would mostly access this questionnaire through their mobiles from instagram.

Working with key stakeholders to create a hi-fidelity prototype using the Good Growth Hub's design style guide, I was able to produce the below concept.

Client

Good Growth Hub & Local Champions

Purpose

Design of a web plugin to enable 100+ Junior freelancers to identify key areas for skill development through a questionnaire.

Role

UX/UI Designer

Tools

Figma

Prototype

Questionnaire Start and Demographics

I decided that including demographic questions, at the start of the questionnaire would be a better choice for our users. They may experience fatigue as the questionnaire goes on. Asking at the beginning of the questionnaire enables us to capture their information before they start, so that if they do not complete the questionnaire, we are still able to make contact with our freelancers based on the information they provided us with at the start.

Designing Question Types

I then decided to define question types to enable developers to understand what each question type would look like within the web plugin. We had around 30 questions to ask, all with different styles so defining these was important, however, it was not optimal to design each question type more than once. So I decided to define each question type and design one version to reflect the design of these questions so that the developers could move forward with their work.

I also decided once the questionnaire had started, to include a progress bar at the top of the questionnaire to enable users to see the progress they were making, alongside having a back and next buttons. These buttons became underlined once clicked and would remain until the previous or next set of questions were selected.

Questions would also become underlined when highlighted, as well as having the option shown as selected in the radio or checkbox area.

Below, we first have radio buttons to reflect singular-choice questions, then we have checkboxes to define multiple-choice questions. Finally, we have text boxes to display open-ended questions.

Scenario Questions

Alongside having single-choice, multiple choice and long-form questions. We also designed questions that were scenario-based. I decided to give the scenario a rectangle with a background to represent to the user that this was an uneditable aspect of the questionnaire, as opposed to the open-ended questions where the rectangle would be clear or white to show that user input is required.

Next Steps

Once the questionnaire was complete, users were presented with information about what would happen next. They were also given the opportunity to visit Good Growth Hub or Local Champions websites, as well as having the opportunity to join the Freelance Exchange whatsapp group.

All were provided as links at the bottom of the screen. Each link used the corresponding charities colours, to help users identify them through branding.

Results

The results would then be emailed to each freelancer after they were reviewed by a mentor. To represent the results to the freelancers, we decided to use a radar chart. This would enable the freelancers to see areas for improvement in their freelancing skills.

There is also a breakdown of each measure for the freelancer. Enabling them to understand where these summations are derived from. The results are also to be talked through with an advisor, so that any lower scores can be discussed with support.

The web plugin can be accessed here.