Using user centered design to design a product that enables people with mental disorders to access Internet freely

Safesurf is a project that I worked on with three other classmates from my INFO 200 class. During that class, we learned about the process of designing a product. From brainstorming ideas to doing user research, from making wireframe to making a presentable final prototype, we worked on Safesurf and made it into a prototype design for an app. During that process, I was in charge of design. So I used my previous skill in designing apps, as well as some YouTube videos that hardens my skills, to create the final product.


1. Identify the problem and narrow down the audience


The first step of the design was to identify the problem and narrow down the audience. The problem we identified was that a lot of people with mental disorders (like PTSD) are sometimes afraid to surf the internet because they are worried that they might see words that will trigger their emotional response. We believe everybody deserves the opportunity to access information on the internet, and we believe the people should not be punished by certain condition they might have that might hinder them from accessing those information. Therefore, we narrowed down our target user as people who want to feel safe while browsing online.

The target audience for this project is those who want to feel safe while browsing online, more specifically, those with any mental illness that hinders them from seeking information without the risk of coming across content that can be potentially drastic to their mental state. We are looking to serve people, regardless of age, race, or gender, who have been through any type of traumatic incident that could possibly encounter a trigger while browsing the internet. Mental illness does not discriminate, and neither should the possibility of a safer and inviolable internet to those who need it. - Project Problem Written Statements


2. Identify stakeholders, do user research and create user personas


The second step of the design was to find out who are the stakeholders. For any given problem, there will likely be a few different social groups that have a “stake” in any solution you might design. After that, we will do some user research on those stakeholders. We will use different methods, but mainly interviews of people who suffer from those conditions, to find out what they really want in a product. After that, we will write up a anonymous report for each interviewees and create a personas for them. We will then decide how our software would benefit each of them, and keep them in mind throughout the entire design process.

When posed with the choice, McDonald opted for color coding and offering synonyms/references to the words, whereas Cooper would rather the words be blocked out altogether. Both appreciate the purpose and goals of SafeSurf and would use it dependent on severity of mood. The next step in this would be designing SafeSurf in a way that fits the needs of all potential users. - User Research

Though there is counseling and support groups to help them with Forest's (alias, in order to protect interviewee privacy) traumas, it can only be the slightest thing that can set him off, a word, a phrase, a sound, or even a picture. - User Personas


3. Create wireframe/draft design


The third step would be to create a wireframe, and coming up with a draft design. During this step, we kept what we learnt in mind and make sure we design our product based on the user’s needs. We created a wireframe that explains roughly how the product is going to look like and how it will function, including different settings that we have and how some of our features, like exposure therapy would work. After our work, we made sure that our product will benefit our user personas.


4. Create high fidelity prototype

The fourth step would be to use Sketch to create a high fidelity prototype based on the wireframe. I also did some research on what color to use for my design, and decided on using blue as the main color, for it gives the user a cool and calming feel. After that, I used InVision to create a prototype that will respond to touch, and wrote out a presentation guide for everyone in the group to recommend a optimized way that can show people every feature in the prototype.


5. Creating video demos for presenting (optional)

The fifth step is something that I did for the project presentation. I understood that some elements of our product is complicated, so I decided to make a video that explain how some of the elements will work and some concept that might be difficult to explain just by talking about it. I used Keynote, the presentation software from Apple, to create the demo. During the presentation, we had two computers looping this video, which helped us explain some concepts and learn how some interaction will look in action.

Apart from that, I also used principle to create a animated version of the robot, which will track the mouse and follow the cursor with his head. I think that might be a good idea that will put a smile on someone’s day.

These are the steps that I took to incorporate user centered design and design thinking into making a product. This experience has been beneficial and I believe it will change the way I think about design in the future.