Using Research to Enhance Shared Lane's Digital Careers Toolkit
The Outcome
01 Reseach
Competitive analysis
UX/UI Audit
Interviews
Persona
Journey Map
02 Ideate
04 Final Thoughts
User Flow
Mid-fi frames
03 Design
Testing insights and iterations
User Testing
High-fidelity prototype
- Established visual identity and product style guides
- Led market & user research and usability testing efforts
- Delivered information architecture, user flows, use cases, wireframes, high-fidelity UI, prototypes, and more
- Worked with a team of three UX Designers from research, ideation, team formation, to completion
Shared Lane is a company founded by a lifelong educator to help today's youth in career readiness and post-secondary planning.
Shared Lane Toolkit is an online resource that specializes in primarily digital careers. It's a resource to help broaden the reach of career pathways and give the youth a better understanding of not only possible careers, but the tools they already have to thrive in them.
Shared Lane Toolkit is an online resource that specializes in primarily digital careers. It's a resource to help broaden the reach of career pathways and give the youth a better understanding of not only possible careers, but the tools they already have to thrive in them.
What I did
Summary
Shared Lane wants to redesign their Toolkit site to better serve both teachers and students. Existing websites has a lot of valuable information but it is not structured or personalized to user needs.
The Challenge
- A high-fidelity prototype that creates a seamless educational experience for both groups of users: students and teachers.
- New experience filter that helps users find information depending on who they are.
- Reworked visual identity and product style guides.
The Outcome
To create a service that will put a human experience in the center of all solutions, I started with research.
I made a list of features available across websites that help users to organize and personalize information. I pinpointed Ways to Donate, Login&Create profile and Filter Content as a possible area for better personalization and organization of the website.
This practice helped me find inspiration and highlight Shared Lane's lack of organization and separation between users. Shared Lane's problem is that the user doesn't have an understanding of what sections are made for teachers and what for students, together with confusion about a path to navigate through information on the site.
This practice helped me find inspiration and highlight Shared Lane's lack of organization and separation between users. Shared Lane's problem is that the user doesn't have an understanding of what sections are made for teachers and what for students, together with confusion about a path to navigate through information on the site.
Feature Benchmark
01 Research
I set up a competitive overview to understand Shared Lane position in the market of educational services. I identified four main direct and indirect competitors: Understood.org, The Marcy School, JFF, Get Schooled.
Competitive Overview
Current site UX/UI Audit
- Lack of style cohesiveness between pages
- Lack of emphasis of the Toolkit Learning Platform
- Overwhelming Information Architecture with dense menus
- Text heavy articles without visual rest
User Research Plan
My team planned 12 remote interviews with existing Toolkit customers, together with new users from teaching or student backgrounds to define the needs and frustrations of Shared Lane Toolkit users.
Our interviewees were: educators, students, curriculum writers, career readiness managers, UX designers.
Our interviewees were: educators, students, curriculum writers, career readiness managers, UX designers.
Insights after interview
We found out that the majority of existing and new users said similar things. We condensed all insights into three main I-statements to better demonstrate pain-points:
Persona
The research resulted in two distinct personas: one is a Teacher looking to learn about digital careers and present to her students and another is Student looking to learn about possible future career paths.
Journey Map
Scenario: Mary is preparing for presentation about career opportunities for her high school students. Mary's colleague shared with her a Shared Lane Digital Toolkit link. She is logging in for the first time to research information for her presentation.
To identify genuine emotions and frustrations of our users, I created a retrospective journey map of my primary persona Mary using Shared Lane Digital Toolkit.
I started to visualize different ways to structure information for different kinds of users.
Before sketching I identified main focus points:
Site Navigation and Personalization:
Before sketching I identified main focus points:
Site Navigation and Personalization:
- Interactive filter that sorts information depending on who you are and what are you looking.
- Prioritize frequented sections.
- Relabel menu items with industry terms.
- Add a section that prompts users to contribute or purchase, which addresses the business goal to monetize.
- Commonly used labels like "Your Resource Center" and "Workshops" help users understand and locate what's offered by Shared Lane.
- Consistent menus connecting both domains.
- Adding "Partner" gives a dedicated space for monetization opportunities.
- Divide information into two Portals: Educator and Student.
02 Ideate
User Flow
Click on mid-fi frames to zoom in
I created a mid-fidelity prototype around filtering the information depending on who you are and what you are looking for, continuing to a personalized portal where users can find a clear path of their learning journey.
Mid-fidelity Prototype
Usability Testing
I tested my design on 6 people to see how well they understood my design decisions.
Task: Select options on the journey filter exercise on the landing page. Then log on to your portal to find the full UX Designer Toolkit.
Task: Select options on the journey filter exercise on the landing page. Then log on to your portal to find the full UX Designer Toolkit.
Number of misclicks
Three of the six thought didn't find way to Toolkit right away. Also two users said that they would prefer to have filters higher up and more emphasized, because it brings clarity to the experience. Number of misclicks (diagram on the right) is pretty high. So let's continue to iterate!
Usability Testing Insights
03 Design
High-fidelity prototype
I iterated using user feedback and did two more rounds of testing.
I added experience filter higher up on the page because users found it useful to navigate.
I added more clear navigation
to better understanding where user is in the process.
to better understanding where user is in the process.
I added a clear navigation for UX Design Career Learning Portal.
More interactive information for students is at the top.
Shared Lane CEO's Review