Chu-Ting Fan © 2019

  • email
  • LinkedIn
  • Twitter
  • medium
  • dribbble

Rethink Cyberbullying


Rethink Cyberbullying is an RPG mobile app for educating middle school and high school students on cyberbullying. 

With the evolution of technology and in particular the emergence of social media, cyberbullying increasingly becomes a concerning form of bullying. Rethink Cyberbullying simulates the sexting story, which is the most common and serious scenario in cyberbullying. In this app, users can take on one of five characters that play different perspectives in a bullying scenario.


The primary goal of Rethink Cyberbullying is to help build empathy and help students foresee the consequences of one character’s actions on the other character in an effort to make them think twice before taking part in any such scenario in the future.​


Sep. 2017 - Jan. 2018 | Austin


Mural, Sketch, InVision, 

After Effect

My Contribution

Product Concept


UX Research

Interaction Design

2nd version of High-fi Prototype

Usability Testing

Poster Sketch

Video production



How we do

The design process of this project can be illustrated in the following graph. We started the process from learning what our users and previous research can show and tell us, defining what these mean to us, and finally ideating our product concepts and iterating 2 rounds of prototype design. We also made a final presentation to our stakeholders, who are youth leader educators and school counselors.



Our project stakeholder is a local non-profit organization called SAFE, an organization promotes safe and healthy relationships and increases the abuse prevention in Central Texas. One of their ongoing programs is Expect Respect, which is aiming to engage youth, parents, schools, and communities in building healthy relationships and preventing violence and abuse. We worked with the program director and youth leader educators to get a clearer picture of their current situation.

The serious problem our stakeholder faced was "how to educate middle school students and high school students the right way to deal with cyberbullying."


With the evolution of technology and in particular the emergence of social media, cyberbullying increasingly becomes a concerning form of bullying. These days, when facing cyberbullying, kids tend to commit suicide or respond with some extreme behaviors.


Our goals for this project focus on two directions: the first one is to help educators to lead the cyberbullying workshop easier and bring up discussions among students. The second goal is to teach students to deal with cyberbullying in easier, right ways and understand how to protect themselves in the future.

User Research


Step 1. Literature Review

 To better understand bullying and cyberbullying, the first research step we did was to go out into the field and understand our users and current situations. We approached the problem with an open and listening mind, we checked our assumptions about the problem and cast them aside. The three guiding directions we navigate through our journey were:


  • Global -- The current research shows that over 13 million American kids are being bullied either at school or online. Due to the fact that technology has been involved in our life, cyberbullying has increased significantly over the past 3 years. Research shows 70% of young people between the ages of 13 and 22 have been victims of cyberbullying. Moreover, it is especially serious among teenager, 1 out of 6 high school students (grade 9-12) has been electronically bullied in the past years.


  • Austin -- In Austin, several high school students committed suicide because of bullying and cyberbullying. At the beginning of this year five high school students at Leander ISD high school committed suicide. And this June, Texas signed Senate Bill 179, also known as David's Law, into law, which aims at combating and preventing cyberbullying. It was named after a 16- year-old Alamo Heights High School student enduring relentless cyberbullying.


  • Focus -- Cyberbullying is a serious problem in the U.S., researches and incidents that happened in different places both show that how serious the current problem is, suggesting schools and the society need assistance on fixing and preventing cyberbullying. Based on the research, we sought to find a solution focusing on cyberbullying issue, especially with students in middle school and high school from grade 8-12. 

Step 2. Competitive Evaluation

Cyberbullying has been a growing problem for years, but there has yet to be an effective solution developed to decrease the epidemic. In order to figure out why there isn't an effective solution, we conducted the competitive evaluation on how current solutions deal with cyberbullying. Our research includes different forms of solutions, from education programs, mobile apps, to social media websites, all of which focus on different roles to deal with cyberbullying.


From the competitive Evaluation, we found out that the overlap target audience is students. We then categorized people that interact with the students into three groups, which are school, parents, and students themselves or peers. The difficulties in addressing cyberbullying with these current solutions are many apps and programs focus on the bullied and bystanders when cyberbullying is happening or after it has happened, while the bully and the prevention phase are a potential place we can focus on. There are also insufficient parts in some of the solution that we should avoid, for example, possible false report for the bully playing with the anonymous reporting systems, and the bystander doing nothing because of the fear of becoming the next target.

Step 3. Focus Group

In order to understand more from students’ perspectives on cyberbullying, we cooperated with the Expect Respect program in SAFE, and conducted a focus group with students from Clint Middle School. The focus group was led by the youth leader educator, utilizing a test script we created, who does workshops with them from the Expect Respect program. Our main goals are discovering the students’ perspectives and experiences on cyberbullying, their habits and motivations on using technology and social media, and lastly, the common scenarios of cyberbullying they’ve seen or heard of in the past and what is their reaction was. 


There are three insights we found in this research:

  • The top 2 social media applications that these middle school students use are Snapchat and Instagram, which match the research numbers. The reasons why they are always on social media are because they want to stay connected, get attention, and keep updated.

  • Kids don’t think they would report any incidents by using the anonymous system and would definitely refuse to be monitored by their parents.


  • When witnessing cyberbullying, more than half of the students said they did nothing or did not know the bullying happened, and only 1⁄3 of those students either stood up for the victims or comforted the victims.

Step 4. Expert Interviews

Except for the thoughts from students, we further reached out to expert reviews with a youth leader educator and a school counselor from Expect Respect program to understand the perspectives on educating and helping students on cyberbullying issue. Their input gave us a good background on the core problem of cyberbullying and collect various opinions on how to stop cyberbullying.

  • We tend to ask the bullied to fight back and bystander to stand up, which it is really difficult for them.


  • The key problem is relationships with others, such as family relationship, friendship, or love relationship.


  • Students cannot foresee the potential consequences of their behavior because people cannot do full capacity before the age of 25, they don’t have fully functioning of front rowing the brain.

  • ​A common type of cyberbullying is a girl sent a new photo to a boy and then he tweeted it, then there come so many following things to the girls. Any kind of sexting incidents that happened a lot on Snapchat.

  • The TV series “13 Reasons Why” has brought up a lot of discussions and helped kids understand that what they do and what they say have consequences. On the other hand, it also makes them believe that the best way to take revenge on someone is to kill themselves. Committing suicide is also the best way to let others remember a person. This TV series could be powerful and harmful at the same time.


Step 1. Research Insights

Now that we were armed with a wealth of data -- previous research, focus group, interviews, notes, photos, recordings, and memories -- it was time for us to make sense of what we learned. We regrouped and transformed our raw data into useful knowledge. We first developed insights from our data by creating a list of important pain points and insights. 

Step 2. Turning Points

Before our research, we thought probably we could design a plugin app for the current social media to filter sentences and words. In this way, we assumed kids could avoid seeing those negative information. However, we realized even if we designed a plugin in one of the most popular social media kids use every day and it's perfectly hit the spot. The cyberbullying issue isn't solved because kids could just switch to another social media. We can't solve the problem at the root by using this solution.


In addition, from the competitive evaluation we noticed a big focus on the individual being bullied, but not on the bully. But the fact is currently these solutions don't work so well. From the focus group and expert interviews, we also found that it would be much better for teenagers to prevent the incidents from happening rather than recovering them after the damage has been done. In addition, law enforcement or counselor would often intervene after cyberbullying has happened. Therefore, the second turning point for us is we decided to find the opportunity or action to take to change the bully journey.

Step 3. User Journey Map

We created the journey map empathizing the viewpoint of the bully. The map illustrates the three phases of cyberbullying, before, during, and after the incidents with what the bully would do, think, feel and the painpoints, opportunities, context.

The Solution


Step 1. Concept Generation

After the above "Learn" and "Define" phase, it was time to ask ourselves the question: What can we do for our user? We regrouped to come up with solutions for our users. During the concept generation brainstorming session, we worked hard to be open-minded to ideate possible solutions. Finally, three points were concluded that help us focus on our solution.


Understanding there are always consequences.


Building the empathy with the power of story.


Helping educators to initiate the discussion.

Step 2. Concept Evaluation & Storyline

After deciding the spirit of our design, we used Mural to collaborate and create a storyline which is about a sexting cyberbullying incidents happening in a high school. We choose to adopt the most common and most serious scenario that could possibly cause more damage so that students can experience all aspects of a cyberbullying scenario. To evaluate our concept, we brought the storyline to our stakeholders and got strong feedback that matches kids' real experiences.

Step 2. Required Features

By synthesizing our research insights and stakeholders' feedback that can inform our design, we went through a convergent process to define the required features we should definitely have in our final product:

Iteration Design Prototype


We named our design as Rethink Cyberbullying, which is an RPG that allows students to play with and learn from, to minimize the possibility of getting hurt from cyberbullying, and most importantly, to give the educators a tool that can easily start the conversation with students. We may not be able to stop cyberbullying while it is happening, but we can try to minimize the threat and damage or even prevent it from happening, by having them understanding the consequences and giving them the opportunity to experience it.


In sum, we totally conducted 3 versions of prototypes based on usability testing feedback and conducted 2 rounds of iteration design processes

1st round High-Fi Prototype

2nd round High-Fi Prototype

3rd round High-Fi Prototype

Final Prototype

User Testing Evaluation

In order to avoid the design myth of assuming what users will do and holding onto our idea of what we think they want. We conducted two rounds of usability testing with design professionals and the real users who are the middle school students. We got the evaluations as following and some quotes generated by the kids:


  • The Rethink Cyberbullying RPG easily initiated the discussion around the story, and the students loved the game. They also quickly came up with a lot more scenarios that could be added as branches into the story for more complexity and playability.


  • Most of them stated they liked the game because it was built in the interface of Snapchat and thus they felt even more realistic. Most importantly, they have really learned from the game.

The Result

What I learned

Project Feedback

For this project, we attended the CHI 2018 Student Design Competition and got feedback from the reviews.


"The design intervention certainly addresses an important need. I think this is a very necessary and useful application area and I applaud the authors for exploring work in this space."


"The authors have engaged a variety of stakeholders at multiple important points during the design stage, in "fact their engagement of stakeholders is thorough and extensive.


"I am impressed by the author’s creativity with the solution that they describe and the level of detail that went into describing their solution. The solution was well crafted and presented with a high quality of visual design."


In addition to attending the design competition, we presented our project to our stakeholders, the staff of Expect Respect program. They told us this was the first time they reached technology solutions to help their education and they strongly hope this app could actually be developed and become a useful tool to use in class.

Lesson Learned

Going through the whole process, though at first our goal was to attend design competition and strengthen our skills, finally, we found out the most important thing is not getting an award but actually designing something that helps our stakeholders and even influences those kids on cyberbullying issues. When we conducted the focus group evaluation, kids told us they learned from this story and understood there were consequences, which is what we tried so hard to convey to our users. It is so meaningful to us.


One of the main challenges we faced during the project was we planned to have an in-depth interview with middle school and high school students, but since cyberbullying is a sensitive topic and we can't work with kids under 18, we had to conduct focus group instead. The problem was within a group environment, we can't collect personal experiences on cyberbullying. However, we changed our research questions and left more questions for the expert interviews because we knew the school counselor is the person who interacts directly with kids and deeply understands their feelings.