grydpark Apple carplay
The daily grind of finding parking is hard
I designed an integration for GrydPark with Apple CarPlay to make parking, well, a walk in the park.
Because this was a solo passion project, I was able to operate under my version of an ideal process, taking the time to validate and understand the problem so that what to build and how to prioritize would be clear - including whether it was worth building in the first place.
Tl;DR
The mission
Drivers face significant challenges when searching for parking spaces, often leading to distracted driving, wasted time, and additional charges for overstaying in parking spots. The process is inconvenient and inefficient, lacking a seamless, safe way to locate, book, and pay for parking directly from the car's interface.
The outcome
A CarPlay-integrated app that enhances the GrydPark experience by allowing drivers to find, book, and pay for parking spaces from their car's head unit. This aims to boost convenience, safety, and efficiency in the parking process by minimizing distractions and streamlining essential functions.
This will be developed in early 2022.
My Role
As the sole person on this project, I wore all the hats:
• Product Management
• User Research
• Ideation & Strategy
• UX and UI Design
• Usability Testing & Prototyping
Throughout, I consulted with engineers & stakeholders to assess technical feasibility.
Problem space
First of all, was there a problem worth solving?
Week after week, I struggled with the inefficiencies of parking while driving in a busy city.
I wanted to understand if others shared these frustrations, so I conducted targeted user research focusing on drivers and conducted surveys to gather broad community insights, aiming for more than 50 responses.
KEY INSIGHTS
Here’s what I discovered.
No. 1: Drivers face significant safety risks due to distractions while searching for parking
Most drivers reported feeling stressed and distracted while looking for parking spots, with 80% acknowledging the dangers of phone usage while driving. The need for a safer, more integrated solution was evident.
.webp)
No. 2: ...Forgetting to check out of parking spots leads to additional charges
Many users complained about forgetting to check out of parking spaces, resulting in unnecessary fees. This pain point highlighted the need for a more intuitive and automated parking management system.
.webp)
No. 3: Time spent searching for parking is excessive and frustrating
Drivers often spend a significant amount of time searching for available parking, leading to frustration and inefficiency.
The process needed to be streamlined to reduce search time and improve the overall experience.
.webp)
No. 4: Users require offline access to parking information
Given the inconsistencies in network connectivity, especially in underground or remote parking areas, users needed access to essential parking information without relying on a stable internet connection.
Key Quotes
The frustration is universal.
COMPETITIVE ANALYSIS
But wait, is there anyone solving this problem?
Knowing there was a problem, I conducted a deep dive into existing solutions. I meticulously documented 5 competitor apps (SpotHero, ParkMobile, JustPark, EasyPark, PayByPhone), learning that:
• The better-designed apps focused on booking and paying for parking but lacked seamless in-car integration, which is crucial for minimizing driver distraction.
• The less designed apps offered some in-car functionality but had serious UX issues and did not adequately address safety concerns.
It was clear that this field was ripe for innovation. Let’s get going!
The Opportunity
What am I building?
A solid research foundation helped me laser focus on only the biggest pain points.In short, I could safely ignore features like extensive social networking within the app (we probably have enough of those). Instead, v1 of the CarPlay integration would focus on:
• Seamless access to nearby parking options;
• Displaying essential parking information prominently;
• Automating check-out reminders to avoid additional charges;
• Ensuring offline access to vital information.
UX Phase
Initial quick ideation
To assess my thoughts and gatherings, I sketched out a few wireframes to try and get stakeholders' buy-in at the early stages. Stakeholders were able to see how the concept would work, and after a few rounds of revisions, this was the iteration we settled on.
UX phase
Making ideas more tangible
Wireframing helped me understand the design compromises at stake and led me to converge on the strongest solutions. Here are some of the questions I asked myself during this stage:
• What is a user trying to accomplish on a given screen? i.e., what should be prioritized? what can be moved elsewhere?
• How can the interface be simplified to minimize distractions?
• How can offline access be integrated seamlessly?
• Should there be a reminder system for checking out of parking spaces?
UI Phase
The Solutions
Here are a few of the design solutions as they related to the discovered core problems.
Challenge No. 1:
How might users locate parking safely and efficiently?
Key design decisions here:
- Large, clear icons and text: Ensuring that all elements are easily visible at a glance to reduce the need for prolonged focus on the screen.
- Simplified interface: Removing unnecessary distractions and focusing on essential functions like booking and paying for parking. This helps keep the user's attention on the road.
- Voice integration: Allowing users to interact with the app using voice commands to further reduce distractions. This enables hands-free operation, enhancing safety.
Challenge No. 2:
How might users avoid additional charges from forgetting to check out?
Key design decisions here:
- Automated check-out reminders: Sending notifications to the car's interface when the parking session is nearing its end, or when the car starts to move ,reducing the likelihood of overstaying
- Integration with calendar: Allowing users to set reminders based on their schedule and parking duration. This ensures they are alerted in a timely manner.
Challenge No. 3:
How might users reduce the time spent searching for parking?
Key design decisions here:
- Real-time availability: Displaying live updates of available parking spots nearby, so users can quickly find a space without driving around aimlessly.
- Quick access buttons: Enabling users to book the nearest available spot with a single tap. This streamlines the booking process, making it faster and more efficient.
- Filtering options: Allowing users to filter by preferences such as price, distance, or parking type. This helps them find the most suitable parking spot quickly.
- Saved addresses: Importing saved addresses from the phone app, so users can easily navigate to frequently visited locations. This reduces the need to manually input addresses each time.
Challenge No. 4:
How might users access parking information offline?
Key design decisions here:
- Local caching: Storing essential parking information on the device to be accessible without an internet connection. This ensures users can find and book parking even in areas with poor connectivity.
- Minimal data requirements: Ensuring the app functions smoothly even with limited connectivity. This optimizes performance and user experience, regardless of network conditions.
Usability Testing
Verifying design decisions
To ensure the effectiveness and safety of the Apple CarPlay integration, I conducted extensive usability testing. Instead of remote testing, I opted for a hands-on approach by running the Figma prototype on a tablet from the car. This allowed for a more realistic simulation of the in-car experience. Different users, including both experienced and novice drivers, tested the app under real driving conditions to provide comprehensive feedback.
Original:
Initially, I used the app's original design style, incorporating vibrant colors, detailed illustrations, and the existing user flow for search, booking, and checkouts
Testing:
However, feedback from the testing sessions indicated that these elements were too distracting for drivers. The focus needed to be on quick, easy-to-read information that adhered to Apple's human interface guidelines for CarPlay.
Pivot:
Key changes based on testing feedback:
- Minimalistic design: Transitioned to a more minimal design, reducing the color palette and removing detailed illustrations to avoid distractions.
- Simplified user flow: Streamlined the user flow to prioritize essential features, enabling quick task completion with minimal interaction.
- High-value information layout: Redesigned the layout to present high-value information in a clean, easily scannable format, using larger fonts and clear icons.
- Adherence to Apple's guidelines: Aligned the design with Apple's human interface guidelines for CarPlay, focusing on providing useful information with minimal interaction.
UI Phase
Branding and Visual Design
Following Apple's CarPlay design guidelines, we implemented two themes: light and dark. The main background colors were FFFFFF for the light theme and 3F403C for the dark theme. To maintain consistency with the main app, we incorporated primary colors 00AF85 and DF5A37.
Key design elements:
- Themes: Light (FFFFFF) and dark (3F403C) themes to ensure readability and user comfort in different lighting conditions.
- Primary colors: Integrated 00AF85 and DF5A37 from the main app's design guidelines to retain brand identity.
- Icons: Used Apple's official icons library for a cohesive and familiar user experience.
- Font: The font chosen was Manrope, aligning with the app’s existing design for a seamless user experience across platforms.
Lessons Learned / Next Steps
Focusing on the "why":
Leading this project was both exhilarating and challenging. It was easy to get carried away, and go beyond MVP. There were a million other ideas that weren’t pursued, at least for this initial release, because first the idea had to be proven in its barest form. Working through this project was a fascinating dance between unlimited ideation, and reeling it back in because of reality and scope, all the while keeping top of mind the problems that were trying to be solved
Next Steps:
.
• Collaborate with developers to finalize the app and prepare for launch.
• Continue gathering user feedback to refine and enhance the user experience.
