Overview
CMU Maps is the go-to app for finding food, classes, events, and everything else across the Carnegie Mellon campus. It is designed for students and faculty with a goal of giving people a better sense of organization, structure, and control in a highly stressful and fast-moving environment.
My role on this team as a Product Designer was to transform community insights into design deliverables over Summer 2024 such as wireframes, prototypes, and high-fidelity designs using Figma.
The Challenge
Navigating the demands of Carnegie Mellon can be overwhelming, with students often feeling the pressure of intense competition and tight schedules. This can lead to burnout and neglect of essential aspects like socializing, proper meals, and time management.
Community Insights
I first conducted a survey to CMU students, the majority being first-year students, to gain a better understanding of how comfortable they felt finding eateries, classrooms, bathrooms, and events across campus. Here are some of the things they had to say:
From these responses, finding ways to give students a sense of control over their schedule, location, and current events was crucial. After putting the insights together, I proposed to develop the project in three main classes.
Searching refers to specific and predetermined programs the user will input. Visual and textual clarity are most important for this class.
Programs are physical types of locations with information that are either a classroom, a building, or an eatery. We want to share logistical information about these entities to the user.
Navigation between two distinct locations demands clear visual queues for every step along the way.
Being conscience of one's surroundings makes all the difference in feeling comfortable. Creating a seamless, easy-to-use, and clear interface is necessary to foster a sense of control and navigability at CMU.
Implementing features that students could use to improve their daily lives was our ultimate goal and highest priority.
The Solution
CMU Maps is designed to empower students by providing seamless control over their schedules and locations, helping them stay on track, reduce stress, and build confidence—promoting better mental health and a more balanced campus life.
The Design
We first took a week to develop basic frames of each class to formalize the types of buttons needed, image/text layout, and functionalities. Then, another three weeks were spent to create all necessary frames and components from specific user flow charts within each class. Finally, we brought the classes back together and spent two weeks to finalize the global user flow and revise features in the classes.
Drawing on the insights gathered from community surveys, I created wireframes and experimented with user flows. From these wireframes, our team implemented the app through a series of cards covering half to three-quarters of the screen at all possible times so that students could easily refer back to the map. Buttons were to be minimal and clear while text informative and concise.
This process allowed me to visualize potential pathways more effectively and delve deeper into specific aspects of the user experience.
Search: users can either find specific locations by typing them into the search bar or explore important landmarks or events on campus using the drop down menus. The events tab refreshes and populates the drop-down with current events with specific tags.
Programs are either rooms or buildings. Each program frame will navigate the user to the location on the map and bring up a "card" with all necessary information. Buildings will often have an eatery carousel to highlight nearby food locations. Meanwhile rooms will display its live availability and allow users to reserve the room with a click of a button.
The navigation frames first ask the user to enter starting and destination locations. Then, they can choose between accessible or fastest routes. A preview of the route with key remarks is then displayed with icons marking important route steps along the way.
Since users could access features in multiple different ways, navigating a user through the app was the most difficult part of the project. However, by focusing on simplifying the user journey and prioritizing clarity, we iteratively refined the flow to ensure it felt intuitive and seamless. Through user testing and feedback, we identified pain points and adjusted the design to guide users more effectively toward their goals.
Specific Features for Better Student Experience
The interface focused on easily recognizable icons, simple colors, and minimalist de-
sign in attempt for users to easily understand and use our features. We worked to implement the features that were voiced by the community.
sign in attempt for users to easily understand and use our features. We worked to implement the features that were voiced by the community.
Integration with CMU Eats - While displaying places to eat, we partnered with another Scotty Labs team to show live hours of operations of all campus eateries. Doing so helps everyone as these hours often change from semester to semester.
Student calendar import - This feature is intended primarily for incoming students who have trouble locating their classes. They are able to import their semester schedule from the school's website and see it reflected in CMU maps in a calendar or list view.
Classroom scheduling - At CMU, students often reserve classes for clubs, studying, or meetings. The school's reservation website is outdated and doesn't conveniently display which times the room is booked. Under the room frames, students have direct access to view the room availability or make a reservation directly from the app.
Physical Useability
By default, the buildings on the map are displayed solely by a contour shape. The floor plan (imported from the original architecture drawings) is exposed as users zoom into the buildings. Moreover, users can also cycle between floors within the building.
I assisted in implementing our design on desktop as well. While the navigation feature is not the primary focus of the desktop, checking schedules, managing room reservations, and browsing current events are the intended uses of the desktop version.
Future Steps
CMU Maps has been widely adopted by the Carnegie-Mellon community. We are actively receiving feedback and working to push out new and exciting features. I believe that the project has helped students feel more comfortable on campus, supporting them day by day.
Implementing Bus Schedule Feature
CMU provides free shuttle buses that drive students to nearby popular off-campus housing. However, the information and schedules are obscure and unreliable. Finding ways to provide accurate data to users would be an incredibly powerful feature.
Continue Collecting Feedback
This entire project's foundation is in the voices of other students. It's imperative that we continue to send out surveys regularly to see what the community wants.
Bringing a more Personalized Feeling
While we've achieved remarkable features that enhance the quality of life for those on campus, research shows that users engage more with apps that feel personal and tailored to their needs. By curating a more customized and individualized experience, we can foster a deeper connection with users, encouraging higher engagement and long-term satisfaction.