Project Overview
Embedded Files
Schoolfit is a responsive website that helps parents, guardians, and caregivers search and compare schools for school-aged children in grades ranging from K-12.
Role:
UX/UI Designer
UX Researcher
Responsibilities:
User research and analysis
Persona creation
Wireframing
UI Design
Prototyping
Iteration of designs
Project duration:
September 29, 2022 - October 31, 2022
Tools:
Adobe XD and Miro
Project type:
Conceptual
The Problem
In the winter of 2022, at least 52% of U.S. parents had indicated that they were either interested in finding a new school for their child, were currently in search of a new school, or had found a new school for their child to attend. "47 percent of parents indicated, 'I wish I had more time to consider the schooling options for my child". Taking time to consider schooling options for children can be a tedious and stressful task. There are so many factors for parents/guardians to take into account to make a safe and sound choice for their child. What tool can help support parents have the ability to search for schools, compare key features of schools, and read reviews of schools? How can this process be made so that parents/guardians feel stress-free and at ease?
National School Choice Week Team "Survey Shows: More than Half of American Families Look(ing) for a New School - Winter 2022". schoolchoiceweek, 09 May 2022, https://schoolchoiceweek.com/how-parents-feel-about-school-choices-2022/
The Solution
Design a responsive website that allows parents to view school data and information in a "one-stop shop" setting. Schoolfit is a responsive website that allows parents/guardians to view key data points and factors designed in an environment to evoke calmness and ease.
User Research
Assumptions
Prior to conducting user research, I wrote down the assumptions I had about parents/guardians and their process of searching for schools:
Most parents/guardians will have thought carefully about what school their child attends.
Most parents/guardians choose which school their child attends.
New parents need guidance on what key factors they should look for when searching for a school.
Key factors parents will take into account:
Distance
School rating
Teacher ratings
Special education supports
District Rating
Lunch menu options
After school activities
Pricing
Amenities
Unique attributes
User Surveys
To begin the research process, 5 potential users were interviewed. The findings of these interviews led to the creation of a survey that had 19 participants. Below are the findings from the user survey.
Key Takeaways
68.4% of participants choose which school their child attends.
School choice is an important factor for parents/guardians, there is a need to be able to compare/search for schools.
83.3% of participants already have a set idea of what key factors are important to them when finding a school.
I need to take into account parents' important factors when designing school informational pages.
The top 5 key important key factors participants want to see when searching for a school are curriculum, student/teacher ratio, test scores, safety protocols, and distance.
I need to incorporate these key factors within the school information page.
The top 3 "quick facts" the parents would like to view are parent reviews, curriculum, and school pictures/test scores.
These quick facts need to be "above the fold" for parents to quickly view.
The target user for the responsive website will be parents/guardians of school-aged children ranging in grades K - 12. The survey did indicate that couples who are thinking of having kids, and couples with babies, already consider school factors and the future school for their children and they should be considered as future users of the responsive website.
The insights and data gathered also supported the creation of a user persona.
User Persona
Meet "Heart"
Heart is a military spouse and mother of 3 who needs a simple and easy way to search and find elementary schools for her children because she needs to feel secure and sure she has chosen the right school for her kids to attend.
User Journey Map
Heart's way of researching schools creates an environment of stress. The constant back and forth between websites makes the searching process tedious, tiresome, and frustrating for Heart. She is able to complete her task and find a school for her children (because she has too), but is there a better way for her to complete this process?
Sketching and Wireframing
To begin my process of ideation, I started with a round of Crazy 8's for the dashboard of this responsive website. Once I had a good general idea of how I would like to overal feel and look of Schoolfit, I started sketching wireframes (5 frames for each page) and refining those frames.
After refinement, I moved forward to designing digital wireframes and a lofi prototype. This lofi prototype showcases the main user flow of searching for a school, viewing a specific school informational page, and saving the school page. This prototype also allows users to view the user dashboard as well.
Usability Testing
One round of a lofi usability test was conducted with five participants. The results revealed key insights that would aid in a better user experience.
5/5 participants initially began searching via the search bar function rather than category selection.
5/5 participants were able to complete prompted tasks.
4/5 participants felt confident that they completed the prompted tasks.
3/5 participants stated (to some effect) that the Search by State page felt overwhelming.
1/5 participants stated that it is redundant to have a"saved schools" menu option when they can also find it in the dashboard.
I changed the search by-state icons to a list view and resized the clickable map. This is to provide a cleaner and less cluttered feel of the search-by-state option.
I removed the "saved schools" menu option to compare schools. This allows users to quickly access the feature to compare schools and minimizes the redundancy of the saved school access.
Hifi Mockup/Prototype
Accessibility
The color contrast of my responsive website did not pass on many background and foreground texts. I needed to change the color palette so that it is more accessible for all users.
New Color Palette
This hifi prototype shows the main userflow with iterated pages to better support the user and their needs.
Next Steps
A second round of usability testing.
Iteration based on findings
Check the color contrast of smaller elements - school ratings.
Learnings
This project was rather challenging for me, but I did incorporate key takeaways from my first case study learnings. The user survey really helped me mold categories and data that should be incorporated into Schoolfit. A struggle of mine was really targeting my goal for this project, and at times I became too mindful of "so many possibilities" instead of focusing on the main objective of my goal and this website's goal.
Page updated
Google Sites
Report abuse