A career quiz just as radical as the company.

Main-cover-Updated-Final

RadicalX Career Quiz

Designed for the RadicalX platform, the RadicalX Career Quiz will find the best fit for you. After selecting your best fit, the career quiz will match you to an available RadicalX internship, to get you some experience in your new career. 

Background.

This was a project for the Product Design Internship by RadicalX. RadicalX placed us into teams, and with those teams we had to design a career quiz for their platfrom, end to end (including the questions). The career quiz was intended to be used by students and early career professionals in the tech industry. While we were instructed to use their evolving design system, the overall design was designed by me.

Duration: 4 months (August - November)

Year: 2022

Methods: Wireframes, Prototyping, Usability Testing, User Research, Competitive Analysis, User Personas, Storyboarding, Affinity Mapping, Empathy Mapping, Journey Mapping, Site Mapping, Design System, Agile Methodology

Tools: Miro, Figma

Responsibilities: Wireframes, Prototypes, Design System, User Research, Competitive Analysis, Site Map, Journey Maps, User Flows, Site Map, Overall Design Language

Categories: Product Design, Research, Web, Team Project

Mission.

RadicalX was looking to add a career quiz to their platform. A career quiz that would be designed for students and early career professionals in the tech industry. Their career quiz would be different because it would allow you to find and sign up for internships based upon the career of your choosing.

Teams were given open ended instructions to design a career quiz from the UI all the way to the questions. We were told to incorporate their evolving design system, and to conduct user and competitive research in order to get an idea on how best to execute the quiz.

The goal was to create quiz that was very intutive, unwordy, modern, and a touch of playfulness. I had a very diverse team, some good at research, some good at UI, and others every thing in between.

When our individuality came together, we made magic.

 

Mission-Pic

Process.

Research
Got to know the user. Developed questions that needed to be answered about the user. Came up with a research plan to conduct primary research on the user base, secondary research on career quizzes, and competitive analyses on UI and UX. Once it was done, I had a better understanding of our users.
Define
Defined the project to get the specifications for the project. Those being, the target audience and scope. Then, crafted the user problem statement.
Ideate
Brainstormed an infinite number of ways to solve the user problem.
Prototype
Crafted low fidelity designs, after review and approval, I then proceeded to make high fidelity versions of those designs. Various team members created different versions of the designs to maximize our options. Often, I combined the designs, taking the best parts of our designs and incorporating it into one cohesive design.
Iterate
I took feedback from Project Leaders and updates to RadicalX's design system and incorporated these elements into my designs. After making more adjustments, it was time to put my designs to the real test. We all conducted usability testing on about 10 people and documented our results. Afterwards, I implemented the sugguestions and fixed any issues found from our usability testing to finalize our project.

Research.

All great research starts with a plan.

1Bckgrnd
2Goals
3Quest
4Teams
5Interview
6Compile

Before we began our research, we knew that we needed to find the solutions to these three user problems:

What career path to choose?

What skills are required for that career?

What internship to pick based on that career?

With those problems in mind, along with our goals and questions, we started our research. There were 4 teams, and I was apart of the UI/UX research team, which meant that I conducted competitve analyses in terms of the interface and the user experience.

We conducted competitive analyses on 9 different career and personality websites.

Test-logos

Although a lot of them were very good, with great UI, there were still some UX issues. Let's see what we found:

Paywall-1
Distract-5
Clutter-1
Inconst-5

Afterwards, we conducted user interviews. Each group member interviewed at least 2 people, for a total of 8 interviews. We learned the following about users:

Many have not taken a career test, out of choice, before.

Most, at least, have an idea of what kind of career they want.

They wished that current career quizzes gave more acurate information about the career. Such as salary and requirements.

They wished for a more concrete way to get on their career path.

And we delivered.

Through our research, I was able to create three user personas:

Ruth
Jake
Camille

Here are their User Stories:

Here are their Empathy Maps:

Here are their Journey Maps:

Based on our user interviews and user personas, we put together an Affinity Map:

Affinity-Map

Define.

Early career professionals not only need a way to find a new career in tech, but also a way to get experience in that career, so that they aren't left feeling discouraged and overwhelmed.

Ideate.

There's no storm quite like a brainstorm.

BST

Anybody got time for a storyboard?

image-3
image-2

Need directions? Here's a sitemap.

Prototype.

Gotta go low before you can go high.

Let's go higher.

But, we were told we had to switch directions.

RadicalX was going through a bunch of changes, and as a result their design system was constantly being updated, so it was like designing for a moving target. Regardless, we had to update our designs to align with their new design system and platform. I came up with a bunch of new designs and this is the direction we settled on.

Simple is best.

Landing-Page

Now, let's see the end result.

Result.

Landing

This would be the landing page for the RadicalX Career Quiz.

Available in both light and dark modes, with the tap of a button.

Landing-Light Landing-Dark
About-Light-1 About-Dark-2

About

All the information you need before you start.

Multiple Choice

Multi-FINAL-Light MULTI-Final-Dark
Arrange-Light Arrange-Dark

Arrange by Preference

Choose an Option

Pic-Light Pic-dark
Multi-Scale-Light Multi-Scale-Dark

Multi Scale

Single Scale

Scale-Light Scale-Dark-1
Drag-and-drop-Light Drag-and-Drop-Dark

Drag and Drop

Results

Results-FInall Results-Finall-Dark
Recc-Final-Lightt Recc-FD

Recommendations

See more

See-more-Final-Light See-more-FD
Review-light Review-Dark

Reviews

Remember, it's all in the details.

Insights.

This was my first project for a company. I was very nervous and excited to start my internship, but once I got started, everything fell into place. This project had a lot of ups and downs. The design system and the stakeholder's vision of the project were constantly changing. At times it seemed as though we were chasing a moving target. Nevertheless, we were able to adjust, and readjust again and again.

In a sense, I ended up being the main designer over the UI of the project, while I enjoyed having my designs chosen, it also meant that my designs were now in the spotlight. I gained so much insight from our research and it was refreshing to hear other's opinions, both from usability testing and stakeholder feedback, because it forced me to grow and adapt.

I grew and adapted in so many areas, such as learning how to create Journey Maps and participating in Design Sprints. Ultimately, I was glad I was able to finally learn the proper way to do things and put my skills to the test.

Overall, I am very happy with the way the project turned out. There are some elements of the design that I wish I could've done better and or differently if I had the time to do so. I hadn't used Figma until I started this project, so I believe I did amazingly well figuring out most of the functions and executing my designs.

Lessons learned.

Never get too attached to a design.

Fully understand all stakeholders needs and wants.

Research is key.

Design for the masses, not just you.

If we could've continued.

Linear ombre with photo for landing page

Accessibility modes for color blind and physically disabled/limited people

Selected Works

CONTACT

Email: brandondbanner@gmail.com

80719_Brandon-D-Banner_J_05-copy-2

UX/UI Designer

© Brandon D. Banner 2023