Project: Team Project
Role: UX Designer
Timeline: March-April 2024
Tools: Figma
Background
Ann Arbor has a shortage of street parking to accommodate the large University of Michigan student community.
This issue leads to students wasting their time searching for parking spaces.
The Community
U of M Students
- Students who need to save time and eliminate tardiness due to parking.
- The objective is to find the closest available street parking space to their intended destination.
"Sometimes I end up getting to class late or have
to leave extra early to get a good parking spot.”
- UOFM Junior, Commuter
“Parking was an everyday thing I had to deal with at UMich.
But I still preferred street parking to the parking lots because they’d get so full.”
—UOFM Alumni
Ann Arbor Residents & Visitors
- Residents who need to save time and pay without hassle.
- Visitors unfamiliar with the city need guidance in locating available parking."Looking for parking in Ann Arbor?
“Just drive around and see for yourself.”
—Ann Arbor Citizen
“Parking is expensive and hard to find.
I’ve circled for 30 minutes before finding a spot.”
—Ann Arbor Citizen
Existing Solutions
Parking Structures and Permits
- Large availability
However...
- Structures are crowded, expensive, and far from class buildings
- Permits are expensive and require monthly or yearly payments
- The diversity of permit options leads to significant confusion
ePark Ann Arbor
- Flexible time slots and small transactions
- Digital and physical payment options
However...
- No information on available parking spots
- Limited digital payment options
Our Goal
Enhancements to existing ePark Ann Arbor.
Solutions to save time looking and paying for parking spots.
Ideation
Ideation for onboarding U-M web login system
Ideation for payment methods
Our Solution
Introduces...
- Interactive map
- Personalized spot recommendations
- Google Maps integration
- Online & BlueBucks Payment
Seamless Onboarding
By allowing UOFM members to utilize the familiar SSO login and non-UOfM members to use the existing login, we eliminate the need for users to adapt to a new procedure. The University of Michigan web login page ensures security for the app.
Interactive Map
The pinch-and-zoom searching emphasizes the intuitive design. The map offers real-time updates about parking spot availability.
Personalized Recommendations
The app displays university-specific destinations tailored to the user population. Streamlined user flow is emphasized once again through the clarity and simplicity of the process to get to the "pay now" button.
Third-Party Integration
The seamless Google Maps integration offers users a familiar layout to navigate for parking spots. The app sends familiar notifications through Google Maps.
Familiar Payment
The payment page also offers a layout similar to most payment pages on other apps. This eliminates users having to familiarize themselves with the app while they are on the go to classes. The default time selection minimizes time spent on the app.
This version of the app offers BlueBucks (campus currency) as a payment option for students.
Takeaways
This was the first UI/UX project that I worked on. Throughout the project, I was introduced to and familiarized with Figma. By problem-solving and developing new features on an existing app, I learned to become a team player.
My most important takeaways were...
Increasing Usability
Integrating Google Maps and familiar payment methods reduced the time users spent getting used to the app. Because users would use the app daily, a unified layout of features would minimize the time spent searching and paying for a parking spot, optimizing the user's time.
Straightforward Design
Throughout the design process, I focused on simple yet sufficient design choices. Functionality is prioritized over aesthetics through the white background that emphasizes the information through text and narrow color pallet that eliminates any unnecessary artistic addition.