The client project at GA: Knowledge Officer, redesigning Skills Insights!

Our first client being UX Designers. The last challenge at GA. We were a group of four folks and a two weeks sprint.

Our client, Knowledge Officer, is an online platform that offers personalized career development programs to help the users to achieve their career goals. Our focus was “Skill Insights”, a new product they have recently launched, that allows professionals to understand their skills gap and which skills they should focus on to get employed in their desire tech career or up-skill, using Artificial Intelligence to analyze the user’s LinkedIn profile. Then, it will assess their skill-set against six tech careers. Providing the user with a free skills report, helping them to understand their skills gap.

We needed to jump to remote working due to COVID-19 on the first day. Having not worked remotely before, at this point we were really worried about how this would affect the outcome. We fought this predicament by working collaboratively, taking an equal part in each stage of the project, deploying good communication, and a bit of extra effort to get used to using the online tools. A project with big learning moments to take away: empathy can be channelled online too if you are committed to the users.

Our first approach with the product and as a group what quite interesting and we prepared the interview with the stakeholder, that got placed the last day that the school was opened before COVID-19, by videoconference with Ahmed, the CEO of the company. Almost one hour and a half of conversation, learning the keys of the product, to understand what makes Skills Insight an outstanding product.

The brief had three points to be focused on:

• Onboarding: how we present to the user what is the Skills Insights product and how does it work?
• How can we engage people with Knowledge Officer when they are waiting for the report?
• How can we enrich the insights in the report? What else is useful for the users and will make the report more attractive?

Our Success Criteria Knowledge Officer was and is to increase conversions across onboarding, signups, and report sharing. We are still waiting for implementation and metrics.

We followed the Double Diamond Design Process, here, below, you can see all the steps and task we work throw to get the outcome.

As the starting point, we needed to know what the users feel and think when using the current Skills Insights, we tested it with 12 users and found:

Current website.

• Not clear that you can scroll down to find ‘how it works’, Section at the bottom appears like the end of the page.
• “How do they know what my dream career is?” “What are they comparing my skills against?”
• Users left unsure as to what to expect, Users didn’t realize their data was going to be analyzed.

At the same time, we analyze our competitors, 10 of them, looking at onboarding, challenges/assessments, reports, and sign-ups.

Competitive Research: Identifying your competitors and evaluating their strengths and weaknesses relative to your product or service.

The key learnings:

• Make it personal
• The balance between professionalism & informative positive language
• Iconography needs to be playful but also needs a purpose
• Gamification/animation can serve to hold the user’s attention
• Inform users on the process (length, next steps, etc.)

Knowing this, we started the user research: first stop the screening survey: to start delimiting better the users we should interview deeper.

• 100% consider a career change
• 85% 26–40 years old people considered e-learning
• 25% would share a skills report

We conducted 16 interviews highlighting two user quotes that would help you to understand the users:

“The onboarding should show what you can expect.”

“A report is good if it is compact and tells you exactly what you need to do next to reach your goal.”

With all our research findings in mind, we did the Affinity Map to be able to group the findings, discover trends, and identify patterns regarding the learning online platforms, the upskills, and how to measure them. The conclusions:

Affinity Map: affinity diagrams are often used for analyzing and synthesizing user research findings by patterns and themes.

• Trust issues around the platform: needs real-life case studies; recommendations; evidence of AI working effectively
• Key desired insights to see in the report: salary; job listings; potential career path towards getting this job.
• Different sharing options: use as CV; share with professional community; current/future employer; sharing certificates
• Clear next steps to reach their goal.

To define the problem we started with the Experience Map,

An experience map, on the bottom, visually illustrates a customer’s processes, needs, and perceptions as they take steps to achieve their goals and satisfy their needs. It’s a strategic process of capturing and communicating the customer interactions and touchpoints that they experience in a larger context. On the top, the emotional journey: a visualization that maps and illustrates a user’s emotional experience through the experience of interacting with an organization, product, or brand.

This showed us that the pain points of our users were when they feel the frustration for their career progression and when they think and evaluate their skills insights against the market.

Based on all the research findings + the experience map, we determined the persona, Mia, a representation of our typical user. We give to user users an identity, that helped us to understand who will be using the product and to capture their main motivations and frustrations.

“A persona is a user archetype you can use to help guide decisions about product features, navigation, interactions, and even visual design.” Kim Goodwin

After this, we were ready to start the design phase, but first to help the storytelling and to keep us in the way we decided the problem statement and the scenario over we were working on:

Problem Statement:

“Mia needs a way to find an overview of her skill-set and position within the job market because she doesn’t know how to make a career change.”

The scenario:

“Mia wants to apply for a job within her company that is in the product team, she wants to figure out how she can upskill to become a more considered candidate.”

As we didn´t have time to develop everything, we prioritized the features of the product, dividing them into 4 sections, following the metrics: essentials/nice to have in the Y-axis and high effort to low effort in the X-axis.

The Feature Prioritisation born for the sake of avoiding the Design Debt: The more features you have at launch, the harder it is to tell what works and what doesn’t.The more features you have at launch, the harder it is to tell what works and what doesn’t.

So we needed to focus the design attention in solving:

• On-Boarding: tone of voice, layout, and more information.
• Report: sharing features, insights: jobs, salaries…
• How to access the learning path
• Review copy: motivational tone of voice.

At this point in the project, we had a second meeting with our stakeholder, Ahmed, who took part in the virtual Design Studio. Zoom and Miro were our best partners. Here we sketched the first ideas about

• How Might We take Mia through how Skills Insights works?
• How Might We motivate Mia to share her report?
• How Might We enrich the insights within the report page?

Design Studio: is a type workshop that combines divergent and convergent thinking: it allows UX professionals to explore a wide set of ideas and also create a shared vision to move forward within a short amount of time. It incorporates brainstorming, critique, and prioritization into one condensed session.

It helped us to get a shared vision of the project that made them ready to jump to the prototyping phase. But for that, first, we needed to have a clear flow to develop so, here you have the happy path: what Mia will see and do in her screens once in Knowledge Office, Skills Insight.

User flow is the path taken by a prototypical user on a website or app to complete a task. The user flow takes them from their entry point through a set of steps towards a successful outcome and final action, such as purchasing a product.

The Paper Prototype:

Before the digital wireframes, we did an early version of the pages on paper.

Paper prototype.

We did 6 user testing in every step of the prototyping process: paper, low, mid, and high fidelity prototype. Most of our improvements were based on how and what information the users need to be convinced about the benefits of Skills Insight.

Low Fidelity Prototype

Mid Fidelity Prototype

We can categorize the changes in 5 topics:

Product Offering,

The first thing we changed was the product offering. We found from the users testing that they wanted to know exactly what was there & how they measure up against potential careers. We thought as KO only offered skills comparison against 6 careers, then it was important for this to be stated upfront.

Onboarding:

Users wanted more information about the skills insight product upfront, so we enhanced the copy to drive interest to read further down the page. In the third round of testing, we moved the ‘Get your free personalized skills report’ button down after how it works, as users tended to click on that button before reading.

Confirmatión page:

Users were requesting more information about how it works and how long it would take. Also, we used a copy that sounds more friendly.

The Report:

We designed an all-new report. In the beginning, we add, ed the sharing feature, as a client suggestion, but it went away after checking that users will not use it.

Before taking the prototype to High-fidelity, we checked the existing style guide regarding the accessibility standards, throw Stark, a Sketch plugin. It ensures colours, visuals, and typography work hand in hand, providing great readability, legibility, and contrast. Unfortunately, the current colours didn´t past the test so we played with the original tones to create new text colours. The typography remained the same. We adapted the iconography too.

Enjoy the video prototype we delivered to the client!

Final High Fidelity Prototype

Next steps,

• Work on the remaining pages of the report.
• Sign up process after the user clicks ‘Start my learning path’
• Create a seamless process for users to verify their skills
• Different viewports

Please, don´t hesitate to contact me if you have any suggestions or just want to say hello

mbelenrodriguezglez@gmail.com