School to Prison Pipeline Journey Map
What is a journey map?
A journey map is UX tool for designing, where you create a map of the site that you are creating. This way you have a visual map for how the user will interact with the site, which allows you to figure out some paint points and how the site should work before you have it tested.
Step 1: Open
Obviously you start by opening the site. When you are on the homepage of the site, you’ll see an introduction explaining the purpose and how to use the site. You will also see the people whose stories you can listen to and interact with.
What does the user see?
- Header, with navigation and site name/logo
- Into/about the website
- Basic information about what the school to prison pipeline is
- Image of the school to prison pipeline
- Grid of people
Happy path
The user reads the how to use the site and the what is the school to prison pipeline section, then scrolls down to the storyteller section and picks a storyteller.
Pain Points
- The user doesn’t read the intro/how to use the site
- The links on the site dont work
Opportunities
- Make multiple ways to get to the same page
Step 2: Selection
The next thing that the user would do is pick a person’s story to hear. There would be many different people, and stories to pick from, to listen to. Each storying giving you different a different experience and interactions.
What do they see?
- A grid of people
- Profile picture
- Name
- Intro to story
Happy path
The user reads the introductions to the stories and listens to the story.
Pain Points
- There are not enough storytellers
- The user doesn’t know to click on the storytellers for more information
Opportunities
- Ensure that there are a lot of different storytellers
- Have a hover for the storytellers so the user knows that they are links to more information.
Step 3: Introduction
This is the introduction where you meet the person via pre-recorded video. Each person would take somewhere between 10 and 15 minutes to listen to there story and interact with.
What do they see?
- Storyteller picture and name
- Story introduction
- Video player
- Previous, home, and next buttons
- Interaction map
Happy path
The user plays the video and listens to the story.
Pain Points
- the video doesn’t work
- the user doesn’t know its a video
Opportunities
- clearly label the video
Step 4: Interaction
This section is the interactions, where periodically through the story the person will give you a chance to interact with them. You’ll be able to ask questions, or make comments on there story via the text field. The amount of interaction you have will vary depending on who the person telling the story is, as will the way in which you interact with them. Sometimes it’ll be them asking you a question and other times you be able to ask them questions.
What do they see?
- A map next to the video
- Pop-up from bubbles
- video, text field, and transcription of the interaction video
- Bubbles that show where in the video the interactions are
Happy path
The user gets to the interaction and the interaction window pops up. The user then would type their answer to the storytellers question, or type a question themself. The interaction video would then respond to the users answer or question, and then close and the story would continue.
Pain Points
- The user asks an unexpected question
- The response doesn’t make sense or creates more questions
- The user could ask something that is answered later in the story
Opportunities
- If there isn’t an answer to the question then the site could email the user at a later date if they would like with an answer to their question
- There could be a “do you have more questions box before the interaction closes
- The storyteller responds with “that question will be answered later” so the user isn’t skipping around in the story
Step 5: Feedback
After your interaction with the person, they will then respond in some way to either your question or to your answer to their question. Then their story will continue.
What do they see?
- A new video based on their input into the text field
- A box for further questions
- A done button to continue with the story
Happy path
The user gets a response to there question or answer and goes back to the story and interacts with the storyteller again later in the story.
Pain Points
- There isn’t a response for the question that the user asked
Opportunities
- The storyteller responds with “that question will be answered later” so the user isn’t skipping around in the story
Step 6: Repeat
After all your interactions and their story is over, the user is prompted to reuten to the home page, where the stories that you have hear already will have a colored background to indicate you already did that one.
- how do they get back
- how do they know who they've done and haven't done
- The how do they know they need to do everyone
What do they see?
- a home button to be taken back to the home page
- A change in color to the stories that have been listened to already
- Into/about the website
- Basic information about what the school to prison pipeline is
- Image of the school to prison pipeline
- Grid of people
Happy path
The user finishes the story and goes back to the homepage, and listens to the rest of the stories until they are all a different color.
Pain Points
- The color change isn’t noticed
- The user wants to listen to a story more than once
- The user can’t find the home button
Opportunities
- Make the color change have enough contrast with the rest of the site
- Allow the stories to be repeated, via a repeat button
- Have multiple ways to go back to the home page.
This concludes my journey map, hopefully it was clear and explains what the school to prison pipeline story site would look like. As well as how the site would work, and allow the user to interact with it.