UX Case Study: SchoolSearch App & Site
UX Case Study: SchoolSearch App & Site
This case study for my Google UX Design Professional Certificate features a tool to help communities in the UAE to find elementary schools for their loved ones.
Project overview
The product
School Search is comprehensive schools directory in UAE where users can search for schools, location and details to find and compare the school that fits child.
The problem
Users want to have a platform where they can find a consolidated list of Elementary schools in UAE to compare the details of the school to decide where they can enroll their kids.
The goal
Design an app and a responsive website of Elementary School finder letting users to browse by location, get details and get contact details of the school.
My Role
UX designer designing an app and responsive website for SchoolSearch - an Elementary School finder from conception to delivery.
My Responsibilities
Conducted competitive analysis by trying competitor apps
Conducted user interviews as primary research with 5 users, parents with kids in Elementary level.
Created user personas
Created user flow diagrams
Created paper and digital wireframe
Created Mockup for app & responsive design in Figma
Created low and high fidelity prototype in Figma
Conducted 2 rounds of Usability study and interview
Project Duration
July - September 2021
User Research
I conducted interviews and created maps to understand the users I'm designing for and their needs. A primary user group identified through research was parents who are from different locations and needed to migrate in UAE and busy working adults who are looking for school nearby their location.
User Journey Maps
User journey maps help to create obstacle-free paths for your users, reduce the impact of designer bias, highlight new pain points, and identify areas for improvement in your design. With these benefits in mind, we can build the path to map our users journey.
Persona
A great persona includes relevant information about your target user's life. These identifiers give us a more well-rounded idea of who our users are. They also help get us thinking about why these people need our product. This will help identify patterns and behaviors in users that might point to a common pain point that a group of user experience. Build based on research and data collected.
Sitemap
To review all of the pages that need to design for the website I created a sitemap. It is a diagram of a website or an app that shows how pages are prioritized, linked, and labeled. Building an effective sitemap also allows me to identify unnecessary pages or spot gaps where I need to create a new page.
Wireframe
Next, I started making paper wireframe, a fastest and inexpensive way to get the idea out. Stars were used to mark the elements of each sketch that would be used in the initial digital wireframes.
Moving from paper to...
Digital Wireframe
After ideating and drafting paper wireframes, I come up with the initial design of the Elementary Search app. I made sure to display the important feature users wanted to see in the app like the search feature, list of schools nearby and school category by Emirate. Will continue to get feedback and findings from the user research.
Low-Fidelity Prototype
Using the digital wireframe, I created the low-fidelity prototype connecting the primary user flow of searching school and viewing the detailed page of the School Search app and to prepare for usability testing.
View the SchoolSearch app Low-fidelity prototype in Figma
View the SchoolSearch Website High-fidelity prototype in Figma
High-Fidelity Prototype
The final high-fidelity prototype presented a smooth flow from browsing school to check school details. It also meet user needs.
Responsive designs
The designs for screen size variation included mobile, tablet and desktop. I optimized the designs to fit specific user needs of each device and screen size.
Takeaways
Impact
The SchoolSearch app and responsive website makes the user feel that they attended to the need of user and able to search and check for important details of the school.
What I learned
I learned a lot while designing the SchoolSearch app and responsive website. We should always make the user front and center of the product. Always remember that we are not the user, that's why we need to continuously learn from them to produce inclusive design.
Next steps
Conduct more user research to determine new features needed or areas to improve the design. Conduct another usability studies to validate whether we addressed the needs of the user experience.