Cohort — A UX Case Study

Dallin Hughes
Dallin Hughes
Published in
5 min readMay 9, 2019
explore page

90% of students in grades 4–12 have reported to have been bullied either verbally or physically. Social media is making it easier than ever to bully without consequence.

The Goal: to design a website that would contribute to solving this epidemic.

Research

Interviews & Insights

To begin the research process, we studied out the problem by reading articles and participating in online forums so we wouldn’t be out in the dark while interviewing. Our team then sent out a survey that confirmed our prior online research on the subject.

86% of participants surveyed had been bullied

Less than 30% took action and told someone

The majority of the bullying took place online

I then personally interviewed parents, teachers, and students to better assess the problem. Each interview was unique since experiences varied, but when my team and I shared our interview experiences we found two disconnects:

  • students didn’t feel like they could reach out to their parents since their parents weren’t familiar with the social media world.
  • parents were completely surprised at the ways and various platforms that students were being bullied on.

With these key insights, we came to the conclusion that informing the parent about cyberbullying and how they can support their children would be very helpful.

“I couldn’t talk with my mom about what was happening. She didn’t use instagram and couldn’t understand what was happening.”

Persona

Through interviews and survey results we created our persona to better empathize with our user and customize this experience to him/her. Mckenzie is a 38-year-old mother of four, who lives in American Fork, Utah. Her high school aged daughter is being bullied through Instagram and Mckenzie doesn’t understand how this is possible. She also wants to connect with other parents and see how they responded to similar situations.

meet mckenzie

User Story Mapping & the Architecture

The days we spent user story mapping were crucial to the success of our design. We realized after individually mapping out our idea of the site and its services that we were all on different pages. We spent hours understanding each other's ideas and perspectives. Then we spent even more time creating a succinct narrative for our persona.

user story map

The user story mapping ultimately helped us conclude that the website would be best divided into three parts to help educate our persona.

  1. The Content Library — This would help parents learn what their children are going through and how they can help
  2. The Community Forum — A place where parents could reach out to others who have been through similar experiences.
  3. Find a Therapist Page — A portion of the website purely dedicated to making therapy more accessible.

Sketching for the Simplest Design

I went through a series of wireframe sketches before coming up with my simplest and final design. Since our persona, McKenzie, is a 38-year-old mother with limited technological experience, I prioritized simple navigation over aesthetic design in hopes to create the simplest experience for her.

a few wireframes

Usability Testing

After prototyping all my wireframes into Invision I had users test them to find problems and get a brand new perspective. Most of the feedback was centered around the information architecture.

  • What would happen when I clicked on the empower, explore, and empower tabs?
  • How were they different?
  • Why did they all start with the letter E?

Initially, I thought that the three words created some sense of connectivity, but after several user tests, I realized they created confusion more than anything else. So in hopes of helping our user, I changed the information architecture a little and made all action buttons a much more transparent.

before and after

Designing the Interface

After creating a rather simple style guide, I decided to simplify the design even more. After more testing, our team decided to draw more attention to our “call to action” buttons. We simplified our Find a Therapist section to ensure the user had an approachable and quick experience without having to give unnecessary information.

cohort in action

Onboarding

I designed this landing page that features a short onboarding video. The last thing I wanted was the user to be confused when they visited the site. The second last thing I wanted was for the user to be bombarded with walkthroughs each and every time they visited. This landing page became my solution. A returning visitor can easily navigate off of the “landing page” by simply scrolling down to see the latest content or by clicking through the nav bar. While a new visitor can explore the site by first watching the welcome video then clicking on the tabs.

landing page animation

Final Solution

1. Content Library

This page is the heart of the website. It provides videos and articles related to bullying; from articles about “how bullying can be perceived yet not intended” to videos on “breathing exercises for lowering anxiety”. This is the place a parent and child could explore together to help build healthy habits and shared understanding.

2. Community Forum

With hopes that parents could reach out to others to solve personalized problems. I strived to create a safe place for parents to share their concern or situations and ask for help from others who had already endured similar situations.

3. Finding a Therapist

I wanted to devote an entire section of the website to making therapy accessible and familiar. Our team recognized that most visitors on the site wouldn’t need the extra help that therapy provides but deemed it MVP to provide for the few serious cases who would consider it and the benefits it ensures.

Conclusion

Things I learned again & again

  1. User story mapping is your key to getting on the same page and communicating ideas.
  2. Really getting to know your persona makes all the difference when it comes to designing for your persona vs. designing for yourself.
  3. A 0.38 muji pen and piece of paper are your best friend when it comes to brainstorming solutions.
  4. Communicate, communicate, communicate.
  5. Cyberbullying is more vicious and evil than I could’ve imagined, we need to talk and learn about it in order to solve it.

--

--