Overview
The Campus Health and Wellbeing services are a collection of student support programs that address basic needs, counseling services, and medical services for Cal Poly SLO. These services are accessed on-campus at the Health Center, a few of which are promoted on their official website.
Our team at Cal Poly Iter8 designed a mobile app to increase awareness of the Health and Wellbeing program and to improve student’s accessibility to their services. Keep reading to see what we’ve done!
Project Details
Timeframe: 8 weeks | Winter 2023
Role: Project Manager
Tools: Figma
The HealthE Team
Problem Statement
How might we integrate the unique resources of Campus Health and Wellbeing into an interactive mobile application to improve student accessibility and increase awareness?
User Interviews
To evaluate the pain points and better understand the existing user experience, we conducted user research on the following segments: regular users of the health center, those who hadn’t used the health center before, and student leads and staff of the health center.
We asked our interviewees to share their experiences with the Health Center. Some main takeaways highlight that:
• Creating appointments is challenging. Students can only schedule appointments in person or over a phone call, and usually can’t schedule in advance.
• It is difficult to find mental health resources since the information is very unorganized on the Health Center website.
• Students want a fast and convenient way to check availability in the food pantry, a free service that provides food to students in need. Currently, students visit the pantry physically to check the inventory, where they are sometimes out of luck.
Competitor Analysis
After completing these user interviews, we conducted lightning demos where we compared the Cal Poly Health Center and Wellbeing website to those of other college universities. We created SWOT analyses to assess what works and what doesn’t, and how we could implement successful features into our prototype.
Solution Sketches
Now that our competitor analysis has been completed, we transitioned into Crazy 8's. Each group member created their own Crazy 8 and brought them to our next meeting to discuss our solutions. At the end of the meeting, we selected our top solutions. The sketches below represent the final sketches that were chosen.
User Flow
Based on our solution sketches and background research, we created a user flow outlining the onboarding process to the log-out process of the application. Together, we mapped out the user flow for the Food Pantry, the Health and Pharmacy, and Counseling Services. One person was assigned as the scribe of the group while everyone else discussed the flow aloud. We left post-its highlighting questions, concerns, or features we wanted to revisit later.
Ideation
After completing our research, each member developed their solution sketches, touching on various pain points and ideas highlighted in previous meetings. We later shared our ideas and findings as a group, critiqued each sketch, and voted on our top three solution sketches.
Some key design solutions we honed in on were:
• A page with up-to-date information on what is available in the Food Pantry
• A streamlined appointment booking process
• A calendar system containing events hosted by the Health Center
Prototyping
With our user flow in mind, we transitioned to prototyping the low-fidelity and mid-fidelity wireframes using Figma. In all, we created:
• A live catalog of what is available in the Food Pantry.
• A customizable calendar system showing each Health Center event.
• A health appointment booking system for users to schedule an appointment with a doctor on campus.
• An ordering system for over-the-counter and prescription medication.
• A notification section for users to receive updates about appointments, events, and important information.
Low Fidelity Wireframes
Usability Testing
After completing our prototype, we designated two user-testing groups. One group of users was given specific tasks to complete. The other group of users was given no task and was asked to roam the app freely.
Through this process, we learned that:
• A clear button to return to the previous page is crucial.
• Links need to be clearer and act as a call to action.
• Consistent spacing and alignment are visually important
After gathering these insights, we implemented change by:
• Defining active buttons with a gold color and allowing a larger surface area for clicking
• Ensured that all spacing was accurate (time-consuming, but important!)
• Tidied our prototype paths to ensure that there were no dead ends and a user could accomplish their tasks and explore the app
High-Fidelity Prototype + Design System
In our high-fidelity prototype, we developed a design system driven by our individual research and user interview feedback. We chose:
• Calming and welcoming colors that still convey themes of official Cal Poly branding
• A friendly sans-serif font that increases readability
• An original logo to represent the refreshed mobile identity of the Health Center
The Cal Poly Campus Health and Wellbeing Mobile App
After locking in our design system and completing user testing, we arrived at a prototype that we are happy with!
An intuitive home screen
We incorporated a search bar for easy navigation of our app and included upcoming event notices and announcements.
Tracking food at the food pantry
We incorporated a search bar for easy navigation of our app and included upcoming event notices and announcements.
More accessible health services
Appointment scheduling and prescription preorders are designed to be easier to complete on the app.
Challenges and Lessons Learned
Throughout the quarter our student designers met twice a week — syncing our schedules required planning ahead and setting designated meeting times. During the first few weeks of our project, we met in the Graphic Arts building and the Library, but we needed a central location to allow our team to get into the iterating headspace. To establish this space, our team applied to the Hatchery, an interdisciplinary playground through the Cal Poly Center for Innovation and Entrepreneurship. With this connection, our team was able to grow our roots in this creative space.
What's next?
Currently, Cal Poly Health and Wellbeing is undergoing a redesign of its website. Moving forward, we may meet with the team responsible for the web development at the Health Center and gain insight into their goals, while suggesting our prototype and research from our case study.
