PARKOUR A mobile application to find a parking slot for a professional and help them park their car in a busy office area quickly.
Design Process
Identify
Define
Design
Analyse
Brainstorming
Persona
User Flows
Usability Testing
Primary/Secondary Research
To be journey map
Wireframes
Iteration
Competitive Analysis
Information Architecture
Visual Design
High fidelity prototype
Brainstorming Brainstorming is one of the most crucial and initial step that helps to explore an array of opportunities that could or could not be possible with the brief. It helps to find out all possible derivates while thinking out of the line as well.
Secondary/Primary Research Secondary Research helps in getting quantitative data and discovering the pain points and needs of the users. In order to get a holistic view about parking spaces, a questionnaire was sent to individuals from professional bagrounds and telephonic interviews were done with around four individuals Link to Questionnaire: https://forms.gle/oPtS7Ne8xwyceb94A
Competitive Analysis Competitive Analysis helps in getting the perspective of other designers as to how they designed keeping in mind the pain points and needs of the users. I went through the following applications to understand the mental model and the user journeys of them:
Parkopedia Park+ Get My Parking SpotHero
Overall Key Insights Based upon user research and competitive analysis, some of the key design insights that were collected are as follows:
Time efficient
Minimal UI
Safe to use
Intuitive
Reccomended action
Hands free ability
Assumptions Before planning the user flow couple of assumptions were considered that could be made feasible in real time scenarios by integrating physical product interventions. These features could be helpful post pandemic as well once people start commuting. Parkour would be assisting the existing parking lots to manage the traffic and parking system in efficient manner. Inorder to make it happen following products could be installed:
- Unmanned Toll Booth that helps in scanning the QR Code of the individual's vehicle. - Sensor modules that gives real time update about parking location. - GPS Based location service that allows to track the current location of the individual and helps in suggesting the nearest parking lot to the office
Persona Personas are fictional characters, which you create based upon your research in order to represent the different user types that might use your service, product, site, or brand in a similar way. Creating personas helps in understanding the users' needs, experiences, behaviors and goals.
Amit ABOUT Amit is a 35 year old IT professional who has been working in HCL Technologies since 5 years. His office is located in cyber city and lives in sector 29 Gurgaon. He drives swift desire every morning to the office and leaves home usually by 8'o clock. He often picks up his two of his colleagues on the way to office as he believes car pooling could help in reducing the carbon footprint.
NEEDS
“I usually leave on time or mostly before time to reach office but finding parking has never been convinient for me"
GOALS
To be able to park the car efficiently despite getting
To reach office on time and not get late for early
late to work or during rush hours.
morning meetings.
To be able to find the parking slot prior effectively
The experience of parking the car should be smooth
and faster.
without any interruptions after entering the office premises.
To get a parking spot closer to the office premises.
To get a parking spot closer to the office premises.
PAIN POINTS
Age: 35yrs.
PERSONALITY
Cannot check his phone again and again while
Job Title: IT Consultant
Analog Skills
Beginner
Excellent
Digital Skills
Beginner
Excellent
for the fear of theft.
Wayfinding Skills
Beginner
Excellent
Post pandemic won't like to spend too much time
Financial Profile
Beginner
Excellent
driving.
Family: Married
Cannot trust the unguarded/open parking spaces
Location: Gurgaon, Haryana
taking tokens/parking slips.
SCENARIO Organised
As the number of cars are increasing every day, the parking spaces are reducing. Everyday he faces a challenge to get a parking spot near the office
Adventurous
Punctual
premises. Some times he gets frustrated seeing the unused parking spots being used as a placeholder for broken/ unused cars. Entering the premises takes a lot of time as he has to wait in long ques, which Catching up with the morning meetings is a challenge for him as it takes not less than 10-15
Forgetful
minutes to find a parking slot in the lot.
User Journeys A user journey is a path a user may take to reach their goal when using a particular website. User journeys are used in designing websites to identify the different ways to enable the user to achieve their goal as quickly and easily as possible. Here Amit is symbolic of the young age professionals whereas Anuradha represents the mid aged individuals. Link to the hi-res version: https://drive.google.com/drive/folders/1_SnKVJSXl4BzzAmQwojtCyVp_fekh5Au?usp=sharing
TO BE USER JOURNEY MAP
Needs
Journey
Scenario:
Amit
Amit has left the home and is running late for a meeting. He has not reserved a parking spot
Age 35, Gurgaon, India
in advance therefore looks out for the spot in the parking app on the way while entering the office premises
To enter office premises on time without waiting in queues
To enter inside the parking lot without having to get any token
To get to know where the parking spot is empty
To choose the desired parking spot
To make cashless/ cardless payments
To reach the parking spot without any hassel
To park the car at the spot
To remember the parking spot
To walk to the office
To go back to the parking spot at the end of the day
To get directions for the way out
After reaching home reserve the parking spot for the next day
To look for available parking spot for the following day/week/month
To choose the desired spot and book in advance.
Initiate
Entry
Spot Availability
Spot Selection
Payment
Navigation
Park
Remember
Going to Office
Archive
Return Navigation
Reserve Spot
Check Availability
Book
Open the app and Login
To enter the parking premises by getting the QR code of the profile on the car scanned.
Get an indication of the booked/empty parking spots and their location
Chosing the suitable parking spot depending on the distance from the office entrance
The bill goes into the credit account which the user can pay later. The payment link will be shared on SMS and visible on App profile
Once the spot is selected the app will show the directions to the parking spot from the user's current location.
Parking the car after reaching the spot correctly
Save the spot details for the user to return back
Show directions from the spot to the office entrance
Show details of the saved parking spot
Show the directions to the spot for the user to return back easily
Plan to book parking spot for following day/week/month
Search for the parking spot for selected period of time
Process the advance payment after selecting the desired slots
Frustated, Tensed
Tensed and Doubtful
Hopefull and eager
Exhilarated
Anticipated yet eager
Open app
Scan QR Code
Select the parking zone
Feeling and Thinking
Interaction Touchpoints
Needs
Journey
To find a platform to book a parking spot in advance
Discovery
Select Parking Spot in parking zone plan
Anticipated
SMS, My Account, Payment Portal
Disoriented
In app Navigation Map View from Origin to Destination
Comforted
Car Parking Successfull
Relieved yet nervous
My account, Saved Places
Perplexed
In app Navigation Map View from Origin to Destination
Pleased
My account, Saved Places
Happy
In app Navigation Map View from Origin to Destination
Book a slot
Date Selector
Thrilled
Payment Portal, Booking Successful, My Bookings
Scenario:
Anuradha
TO BE USER JOURNEY MAP
Content and Relieved
Age 42, New Delhi, India
Anuradha is an HR professional who sometimes get late while leaving home as she gets busy in household chores and has to drop her 8 years old daughter to the school on her way . She wants to have a dedicated platform for getting parking conviniently even when she gets late to work.
To explore the service
To search for office area and it's parking lot
To reserve a parking spot for following day/week/month
To look for available parking spots for the following day/week/ month
To choose the desired parking spot
To choose the desired spot and book in advance.
To remember the parking spot
To enter inside the parking lot without having to get any token
To reach the parking spot without any hassel
To park the car at the spot
To walk to the office
To go back to the parking spot at the end of the day
To get directions for the way out
Initiate
Search
Reserve Spot
Check Availability
Spot Selection
Book
Remember
Entry to Office
Navigation
Park
Going to Office
Archive
Return Navigation
Search for the office area and look at the parking lot plan
Plan to book parking spot for following day/week/month
Search for the parking spot for selected period of time
Chosing the suitable parking spot depending on the distance from the office entrance
Process the advance payment after selecting the desired slots
Save the spot details for later
To enter the parking premises by getting the QR code of the profile on the car scanned.
To show the directions to the parking spot from the user's current location.
Parking the car after reaching the spot correctly
Show directions from the spot to the office entrance
Show details of the saved parking spot
Show the directions to the spot for the user to return back easily
Find an app that helps Open the app and Sign up, in booking parking slots in advance Create a profile and add details
Feeling and Thinking Anticipated
Interaction Touchpoints
Search on Play store, Install app
Comforted
Sign up page, QR Code generated
Disoriented
Select Parking lot
Hopefull and eager
Book a slot
Anticipated
Date Selector
Content and Relieved
Select Parking Spot in parking zone plan
Comforted
Payment Portal, Booking Successful, My Bookings
Pleased
My account, My Bookings
Perplexed
Scan QR Code
Relieved yet nervous
In app Navigation Map View from Origin to Destination
Exhilarated
Car Parking Successfull
Exhilarated
In app Navigation Map View from Origin to Destination
Anticipated yet eager
My account, Saved Places
Thrilled
In app Navigation Map View from Origin to Destination
Information Architecture Information architecture is the practice of deciding how to arrange the parts of something to be understandable. Information architecture aims at organizing content so that users would easily adjust to the functionality of the product and could find everything they need without big effort. Link to the hi-res version: https://drive.google.com/drive/folders/1_SnKVJSXl4BzzAmQwojtCyVp_fekh5Au?usp=sharing
Low Fidelity Wireframes
PARKOUR
Low-fidelity wireframes act as the initial blueprints for web pages and app screens. They help your stakeholders focus on a page's key purpose and functionality by deliberately excluding any specific details like colours, fonts, logos, and exact sizing – all of which can be added later!
Login
Signup
Home
Select Parking area
Reserve Booking
Review Booking/Pay now
Booking Confirmed
Hamburger Menu View
Logo analysis Logo Variations
Typography “Poppins”
Sans-Serif font that is symbolic of geometric and playful style
Bold Green color represents growth and optimism along with a hint of nature
Colors
White signifies the safety and clarity that the brand offers in terms of values
#529B72
#FFFFFF
Forest
Clear
green
White
Hi Fidelity Wireframes A high fidelity wireframe captures the look and feel of the product in the advanced stages of the design process. Hi-fi wireframes go beyond the placeholders and 'lorem ipsum' text of low-fidelity wireframes to include actual content, typefaces, colors, image dimensions, and branding elements.
Key Features: Auto-detect current location
Modify Existing Bookings
Quick Run Time
Reserve Booking in advance
Safe Payments
Hassel free Entry and Exit
Wireframes analysis Minimal Logo Design with clearly mentioned application name
Requirement of essential fields can stay until the user types in credentials
Login screen with allowance to add mobile number
SCREEN 1
SCREEN 2
Checkbox to give opportunity to the user to read all the Terms and conditions liable to the application
Click to action button to get OTP
For potential users who have got knowledge about app and come to sign up
Loading bar to give users motivation to complete a task and move to next one as the bar fills up
Toggle button to give user freedom to select between two wheeler or four wheeler
Click to action button to proceed signing up
Data fields provided as per the number of required digits to avoid any confusion
Notification button to provide alerts of any new empty slot in nearby office area
Wide search bar to be accessible at all times. Location marker would help the user in finding his exact location
Mic Button to activate hands free mode
Share Button helps in sharing the parking space with your office colleague Back button allows user to go back and re select the parking area Filter Button allows to find by area, locality, proximity and type of parkings
Hamburger menu with all the essential items including
Toggle Button allows to switch between the floors
Closest parking spot mark would be slightly larger than the rest markers
Adds the location to the list of saved locations
Subtle Click to action button that opens up the list of parking spaces in the area
Opportunity for micro interaction to allow the user drag his car to the selected lot
SCREEN 3
SCREEN 5
SCREEN 4
Select parking Area would clearly show just the essential information in the limited space
Click to action button to proceed to choosing the slot in the plan
Representational plan of the parking lot guiding about empty/booked slots Action Button that helps in looking for next or previous parking location
Date and time gives opportunity to the user to reserve the parking for later as well and book it instantly
Click to action button to confirm the chosen spot and move on to the next step.
Thank You for you time!
Anvi Mathur
+91 9650121343
anvimathur1996@gmail.com