Feb 2022

UI/Ux

Case study

App design

Parking mobile App

Because of Taiwan's narrow territory and dense population, we often encounter the problem of not finding a parking space, or finding a parking lot but no parking space. In this era of race against the clock, people focus on faster and more intuitive operation methods to help users quickly find the most suitable parking space when driving

Design background

Design Target

E-parking

Remindful

usability

Faster

800m

Lane 25,Zhangchun St

Finish

7 mins

2.4km .4:32 PM arrive

P

07:10

LTE

P

8 weeks

Duration

Figma

illustrator

photoshop

Tool

My role

Idea

Research

UX/UI Designer

Over 50 pages

Screens

02

Competitor analysis

04

persona

03

Empathy map

05

Journey map

07

Information Architecture

08

Flow chart

09

Wireframe

06

User flow

11

Mock-up

10

Ui design

W1

W0

W2

W3

W4

W5

W6

W7

W8

UX research

01

Design flow and timeline

Is there any parking lot nearby?

Is the parking lot still available?

Want to park my car somewhere safe

My girlfriend is waiting for,need to park quickly

Think

Say

How much will it costs per hour?

Is it secured?

How long does it park?

Will it accept online payment?

Drive car

Use the phone or touch screen

Check Google map when driving

Parking the car

Find where you park

Pay for the parking

Complex interface creates distraction

Lots of cars near tourist attractions

Forget where I parked it

Reduce accident happen

Save lots of time

Reduce unnecessary overhead

Tired

Frustrated

Unsure

Anxious

Feel lucky for finding parking space quickly

Feel Irritated if find no parking space

Do

Pain

Gain

Feel

Empathy map

As a driver,I want to park my car as soon as possible,so that I will not let my parents wait me too long.

As a driver,I want to have a easy and fluently UI interface,so that I can patiently to drive.

As a driver,I want someone tell me where i park it,so that I will not lost the direction.

As a parking lot owner,i want my parking lot has online pay ,so that driver can left quickly.

User story

Persona

Abby Beatrice

Age: 35

Status: marriage

Location: taipei,taiwan

Insurance solicitor

Beatrice is an insurance salesman , She usually goes to work from Monday to friday, but the company is next to the main road in the city center. Unless She leaves an hour early, there will be no parking space in front of the company, so he can only circle around the roadside to find a parking space, but he is often late because of looking for a parking space,she hopes to have an app to tell him where there will be more parking spaces nearby.

To find availbal parking lot as soon as possible

Help her to find her car

Too much time to find parking space

She always forgets where her car is parked

She can only focus on driving and cannot be disturbed by other information

Bio

Personality

Favourite brands

Frustrations

Motivations

Goals

Hush

Usability

Accessibility

Active

Specificity

Calm

Remindful

Forgetful

Nervous

Passive

Chill

Active

Driver Journey Map

Stages

Stage 1

Navigation

Connect bluetooth/

apple carplay

Connect bluetooth/

apple carplay

Merge parking app with the navigation app, allowing users to switch freely

Not knowing which navigation app to use, navigation system integration distracts driving

No information is provided to the user on whether there is a parking lot

Mark the nearby roadside parking section and ask whether to park in the parking lot or parking space when navigating to the destination

When parking in the city center, you often circle around aimlessly and have to re-enter to navigate to the parking lot

You often have to walk a long way to pay the fee. If there is only one machine, you have to queue up.

Because the input or selection time is too long, I am afraid of overtime, so I choose to go out on the road before navigating

If you can enter each attraction in advance, you can avoid having to enter it again every time

Often forget where you parked unless you have take picture.

After disconnecting by the car, the mobile phone records the departure track to find the car position

Through the license plate recognition technology, online payment with multiple parking lots

If a person is driving, he needs to be distracted and enter a halfway station, or wait for the red light to enter.

Set commonly used functions as buttons, and mark forward & opposite

Provide parking availability information when entering attractions or restaurants

Input with mobile phone or touch screen

Add a stop station while waiting for a red light

Find a nearby parking space or parking lot when you are nearing your destination

Find the payment machine and enter the car number to pay

After paying the fee, find car position

Leave the parking lot within 10-15 minutes and go to the next destination

Which navigation app do you use to navigate?

I wonder if the spot has their own parking lot ? Let's go first!

I'll go around to find onstreet parking first. If not, I'll find a parking lot

Where do I pay?

Wow, there are so many people

I remember my car is parked in A17 of B2

I'll go out first and then navigate. Someone is waiting for my parking space

I'm looking for a gas station on the highway now, do I need to re-navigate or add a stopover?

Enter destination

View parking lots near your destination

Add a stop station (gas station, convenience store)

Find your car

Go to the payment machine to pay

leave the parking lot

Parking

Pay

Stage 2

Stage 3

Actions

Thinking

Emotions

Pain Point

Opportunities

Wireframe

Lo-fi wireframe

Before starting Ui design, sketch the important interfaces in the functional map to make wireframe,and turn ideas and flow charts into actual interfaces to ensure the logic of later design

App screen

Enter security code

Please check your phone for a text message with your code

Send again

-

-

-

-

-

-

A parking app for driver who for is impatient and forgetful when driving

E-parking

Phone

iHeartRadio

Now Playing

E-parking

Podcasts

Messages

Maps

Music

07:10

LTE

Onboarding

Sign up & Log in

Parking lot setting

Filter

On-street parking setting

Avoid highway

Speed ​​measurement

Show traffic flow

0.8 km

0.4 km

Parking space

Parking space

Spot

Spot

When you enter the spot or address, the parking lot or roadside parking space within the range you set will be displayed. After clicking, you can view the information of the parking lot.

You can choose according to the rate of parking you want, or choose according to the type of parking. When you want to add a rest stop on the way, you don't have to re-navigate, you can directly select the stopover you want to go from the side options

There is a filter in the upper right corner, you can choose whether you want to turn on these functions, here you can also set the distance of parking lot or street parking

$30

1 hour /

1 hour / NT15

( 20 / 300 )

All

Parking lot

On-Street

7 mins

Lot 8 Parking

Other informations

2275 E Mariposa Ave, El Segundo, CA 90245

6:00 a.m~23:00 p.m | Mon-Sun

+1 213-742-7329

Online pay available

Height limit: 2.48m

Disabled parking spaces

Electric vehicle charging

Cancel

Start

Navigation page

Payment page

sec

min

hr

08 : 05 :07 am

13 : 42 :53 pm

2275 E Mariposa Ave, El Segundo,

CA 90245

2022/02/24

Parking location:

Lot 8 Parking

Parking time:

NT 75

Total

1 hour / NT15

B2

Floor

Seat

A17

Go to pay

Online payment can be paid by credit card, line pay or applepay to save the time of going to the payment machine to pay

Some stores offer discounted parking coupons, which can be redeemed by scanning the QR-code or entering the invoice number

When you enter your license plate number on the online payment page, your parking bill will be displayed, and you can check the parking time in any time.

Remind you!

Pay

Cancel

You need to leave within 15 minutes after payment, otherwise you will be charged extra.

Cancel

Try Face ID Again

Try Again

Face ID

_

Personal page

3 Spots

2 parking lot

2022/02/26

travel plan 1

On the morning of February 28, I will go to Los Angeles and stop at several scenic spots along the way......

9:41

travel plan 1

Done

Spot

Parking

Spot

Parking

Spot

Parking

Spot

Parking

9:41

Lane 153,Deji Street

Dexiang St

Zhongming S Rd

Dai 630 St

Fude St

Fulin Road

Namping St

Xiang Yi St

travel plan 1

Done

4 Pennsylvania Plaza, New York, NY 10001

Parking

$30

$15

$20

$20

All

Parking lot

On-Street

$30

1 hour /

If you don't want to enter spots for the whole trip, you can set up your travel plan and pre-set the location of your spots and parking lots before departure

Thanks for watching and Like