Educational App for Girls Inc.

Introduction

For this project, I was working with a nonprofit called Girls Inc Metro Denver, a nonprofit organization that strives to provide girls with curriculum that is often overlooked in traditional education. This includes sexual health, mental wellness, and life skills that promote independence. I was the only designer for the project, and I met with Merritt Hays and Heidi Vielhaber, two Girls Inc staff members. The project lasted for about three months, where we would meet once a month. During this time, I had classes for the spring semester and was not paid, so I was essentially a volunteer. 

Understanding Business Goals

The User: Girls Inc Metro Denver typically works with girls between the ages 6-20, but for this project specifically, I was informed that this web app would be targeted towards 6-14 (elementary and middle school) girls.

User Needs:

• A simple, kid-friendly interface that is easy to navigate

• Modules with relevant content

• A gamified/fun aspect that would keep the girls' attention 

Unfortunately, I was not allowed to speak to the girls directly because of issues related to parent permission and COVID-19. Therefore, I had to rely on the staff members and their perspectives. Girls Inc wanted me to design a gamified platform that would allow young girls to learn content in a digestible way during the COVID-19 pandemic in 2020. While I used these business goals as a proxy for the user needs, I understand that they do not completely substitute user needs. 

Establishing Product Features

The general idea for the site was to include aspects of Canvas and Schoology but also mix in some elements of Quizlet. Content would include videos, readings, and quizzes. With everything in mind, the design of the user experience was supposed to show what the elementary and middle school girls would see while interacting with the web app. 

Features included:

• Login page since girls would have their own accounts

• Home page for announcements

• Module selection page

• Point system for completing activities to give the girls some fun competition while learning 

• Profile page

• Various content pages  

Getting Feedback

When I initially showed the Girls Inc staff my rough designs, they were quick to say that they liked them since I was technically designing for free as a volunteer. Being aware of this, I told them that I intentionally made rough mockups so that they could give critiques. This is when I realized that adding color and branding most likely made my mockups look finalized. I had to reassure the staff members that it was okay if they were not completely satisfied with what they saw because it turns out that users are quite willing to tolerate bad design. After telling them this, they told me that they wanted the interface to look cleaner and look less "blocky" and giant. They also wanted me to add more images and show the content in higher fidelity. 

Initially, we talked about the concept of having a shop where the girls could use the points they earned to purchase profile icons or something of that sort. However, they decided that they didn't want it anymore, and a leaderboard would work. This is because of the fairly short timeframe of the project. They did not want to go through the trouble of either getting permissions to use icons or designing their own set of icons. 

Including more project scope:

One thing that stood out to me during feedback was when the staff members wanted to see a term-matching activity for important vocabulary words, which relates to gamified content. They told me that videos, readings, and quizzes might not be fun for the girls, so it would be great if the girls had an activity that requires more engagement. 

Adding a ribbon bookmark motif:

Although I did not talk to the Girls Inc staff about this, I felt like the site could use something to push it further. The new design aspect I incorporated throughout the site was a ribbon bookmark motif to signify a chapter of these young girls lives, where they are a part of Girls Inc and receiving the education they deserve. 

Final Thoughts

The Girls Inc staff members were pleased that I was able to produce a design for the web app and incorporate their feedback into it. If I were to do this project again, I would want to meet with the girls, the actual users of this site. This way, I could understand the user needs better with direct user perspectives and actually test my design.  Also, with my initial rough mockups, I would make them in grayscale and leave out the branding to encourage users to give honest feedback. In terms of testing, it would be good if I put my mockups into a flow and let users try to navigate the design while trying to complete a simple task. I could get some robust feedback if I did this. Despite the several improvements I would make looking back, I ultimately think this design was a valuable one and for a good cause. 

The Full Mockup File