CONTRIBUTIONS
I mainly led the project scoping, user research, interaction design, prototyping and user testings. Additionally, I played a core part in data analysis and communication with diverse stakeholders.
Delivered the product from 0 to 1
Role
Product Designer
UX Researcher
Duration
8 months
Jan. 2022 - Jan. 2023
Tool
Figma
PhotoShop
Google Forms
UserBrain
Team
2 Product Managers
3 Developers
2 UX Designers
1 Mechanical Engineer
OVERVIEW
FlashParking
Starting from January 2022, I worked as a product(UI/UX) design intern for FLASH in a cross-functional team. FLASH is on the forefront of innovative parking and mobility solutions. This app should provide FLASH's customers a seamless mobility experience, navigating them back to their parked car from any point in a garage efficiently. The team is targeting to increase customer satisfaction and sense of loyalty to the company's overall product suite.
An indoor AR navigation app that marks parking position and guides users to their car in a multi-level parking structure without internet.
CONTEXT
SOLUTION PREVIEW
An indoor navigation app that leverages low energy Bluetooth beacon to pinpoint parking/users' position, and navigate them back to the car reliably, even without internet connection.
Mark down parking position in 1 -click
Once you launch the app, it will automatically detect and display your parking information on a 2D floor map. The bottom panel highlights the specific parking space and the floor you're on. Just confirm it in "1 click" if it's right.
Dashboard: Parking position will be stored in a dashboard for you to check when leaving.
Oops! Wrong spot? Fix it in 1-click
If the auto-loaded parking information by chance is not accurate, just hit the "refresh button" or either pick the right floor from the dropdown.
Guide you back to your car
Navigation is tailored for walking! After returning the parking structure, you can start from previewing the walking route, ETA, and distance to your car. Then the app will guide you back from anywhere you are!
Turn on AR navigation via setting menu
Use this slide deck to turn on/off AR navigation, and customize display of different navigation aids on your preferences.
DESIGN PROCESS
The design process is never linear
Due to the complexity and high standard of this project, we spent over 2 months to self-educate and scope before determining the final plan. At each stage, we kept refining our product while iteration.
AGILE DESIGN PROCESS
USER SURVEY
Understanding our users' attitude about AR is also crucial.
How users think about AR? And why they easily get lost?
To figure out users pain point when finding the car and their attitude towards AR navigation, I created the user survey via Google Form and received 50 valid responses across 16 -40 years old.
BRAINSTORMING
Initially, AR navigation is the business interest.
Explore all potential opportunities
At the beginning, I analyzed the market and competitors, identifying 3 viable options with the team together. Notably, FlashParking especially favored AR navigation for product distinction.
FEATURE EXPLORATION
#1 How to help users remember their car position effortlessly before leaving the garage?
A Start Point to Auto Mark Down the Car Position
-
auto load and visualize users' car location on a 2D floor map.
-
Highlight parking and floor number in a bottom sheet.
-
Allow users to confirm/update auto-loading information.
#2 Where to store and check parking information after users leave the garage?
A Clear Dashboard
-
store the parking information from the last step
-
hint users next step to find their car when back to the garage
#3 How might we better tell users how to get back their car from current position after they come back the garage?
Custom Walk-to-Car Route Preview
-
allow users to preview walking pathway and time and distance details before navigation
-
users are free to update the current position
#4 How to integrate AR intuitively as a bonus feature?
Provide AR Map Option in a Setting Deck
-
Click the setting button to open the side deck without leaving the navigation interface.
-
Allow users to customize their navigation preference by turning on/off the toggles.
THE VISION
Business vs. Users: Identify major conflicts
I identified the conflict between FLASH's business interest and user needs: FLASH wants AR navigation as the primary feature while users still prefer 2D maps.
Technically, we really need a tech solution that's reliable without internet access since users complained that poor signal often disrupts GPS. However, AR relies heavily on the internet.
Define the balance
After collaborating with the PMs and engineers to re-evaluating the pros & cons of earlier solutions, I found a middle ground: using BLE beacon for consistent offline 2D navigation and having AR as an optional feature users can toggle on/off on their own.
BRAISTORMING
Pros & Cons Analysis
Helps Us Make Decision
Based on the previous research results, I created a primary persona to clearly showcase our target users' needs and pain points.
02. Ideation & Design
What are the product user flow and features?
.png)
USER FLOW
User Stage 1:
Before Leaving Garage
The drivers pull up their car in a parking structure. As soon as they open our app, it automatically suggests current parking position.
User Stage 2:
Come Back Garage
When drivers get back to the parking structure, they will use the app to check where they parked. If needed, the app can guide them back the car from current standing position.
03. Testing & Iteration
How might we ensure an intuitive app that minimizes user efforts and satisfy their needs?
USABILITY TESTING
How Users Think of Our App Experience?
I designed the test and recruited 12 users to validate our design assumptions. All user tests are remote, unmoderated, and carried out through UserBrain platform. The results show very positive feedback towards the general app experience and design style.
Finding 1 : Visibility of System Status
The terminology of title is not clear and intuitive enough, so users didn't realize the parking position and floor info is automatically loaded when they open the app.
Finding 2 : A Gap In The User Flow
After user mark down the parking position and leave, users might be confused when to use this app again and not clear where the navigation will be working.
IMPACT
100% users report the app is intuitive and easy to use
we recruited 6 participants with over 1-year driving experience to test our updated design after first round tests. The format is moderate and taken by Zoom or in-person.
DESIGN SYSTEM
FINAL DESIGN
REFLECTION
01. Research & Scope
Other Works
🌱Plant to compose your music
GenAI Hub
PROBLEM
How can we create a efficient and intuitive way for people to find their car in the parking structure?
FEASIBILITY RESEARCH
However, most studies indicate that AR navigation faces notable UX and technical obstacles in our case.
THE VISION
AR can be a feature to enhance navigation.
01. Need a feature to help users mark down and store parking location, so then users can check back anytime
Users easily forget their parking location After leaving
🚗
02. Prioritize & display current floor information with spots number and area code.
“Which Floor” is a key factor for users to find the car
🪜
03. Still use 2D map as the primary navigation with clearly pathways
2D Map is still preferred than 3D / AR
🧭
04. AR can be an add-on feature to turn on when users need to take turns or go up/down stairs.