Zipcar UX/UI

Page 1

UX/UI Proposal By: Monica Shehata


Introduction

About Zipcar, the app, and current pain points


About Zipcar and the App Zipcar Zipcar provides automobile reservations to its members, billable by the minute, hour or day; members have to pay a monthly or annual membership fee in addition to car reservations charges.

The App As a member with the free Zipcar app, you can find cars and vans in your neighborhood and across the globe—and reserve and unlock them, too. Gas, insurance, mileage, and dedicated parking are included in every reservation.


Current App


Aboutthe From Zipcar users 87.5% of users believe that the current Zipcar app lacks heirarchy and displays a lot of unnecessary information when it is not needed.

Users who said that Zipcar needs heirarchy

Users who said that Zipcar does not need heirarchy

87.5%

12.5%

Number of users


Aboutthe From Zipcar users 95.8% of users think that Zipcar should have a way to alert the users when their reservation time is coming up.

Users who said that Zipcar needs a way to alert users of reservation times

Users who said that Zipcar does not need a way to alert users of reservation times

95.8%

4.2%

Number of users


Aboutthe From Zipcar users 95.8% of users think that Zipcar should have a quick instructional guide for the basic functionalities of different cars.

Users who said that Zipcar needs a how-to guide

Users who said that Zipcar does not need a how-to guide

95.8%

4.2%

Number of users


Pain Points Summarized A lot of unnecessary information There is a lot of unnecessary information presented to the user, and no information hierarchy. And as thus, the users are overloaded with information that they may not need at that moment.

No reminder system The only reminders of the car reservation that a user receives are through e-mail which is not efficient, and thus users often forget about their reservation.

No how-to guides Since there are a variety of cars within the Zipcar system, not all users are familiar with all these cars (how the parking brake function, how the start button works, etc.) and often need a simple and quick how-to-use guide.


Competition

How they solve for similar problems


Uber About the app Although Uber is a little different than Zipcar, it is a big competitor to ZipCar. Uber allows you to reserve rides to a specific location, without having to check for availability. Additionally, with Uber, you do not have to drive yourself which is what a lot of people prefer.

A similar problem solved Uber has a clean and straightforward interface. Uber also sends a reminder of when the user’s driver is arriving.


Enterprise CarShare About the app Enterprise CarShare is a membership-based carsharing program that allows users to rent a vehicle when needed - by the hour, day or overnight.

A similar problem solved CarShare gets rid of the excessive information when not needed, yet still remains informative.


Business Cases

Business potentials of a new UX/UI design


Business Cases Wider Audience Base Making the Zipcar app easy to use, with all the necessary information, Zipcar can broaden its audience base.

Revenue By making Zipcar accessible to wider and different demographics, revenue can be capitalized


Personas and Use Cases The audience and their needs


Mark Anderson

The Surfer

Demographics 20 years old College student From Roseville, California Does not have a car Likes the outdoors, beach and surfing Unorganized Extrovert

Needs • An easy way to be able to rent a car for a little bit to go on little excursions • An inexpensive car to drive his friends around • Needs a way to be reminded of car rental time, so he does not forget


Mary Stuart

The Grandma

Demographics 60 year old Retired school teacher From Los Angeles, California Does not have a car, because she doesn’t like to drive in busy LA Likes to go grocery shopping every two weeks

Needs • A limited time car rental service to go grocery shopping, without the hassle of worrying about gas, etc. • Instructions on how to use a vehicle without having to go to external websites • Easy to read interface


Mitchell Hunts

The Techie

Demographics 25 year old College student From Dallas, Texas Lives in San Francisco Does not have a car in the busy city Works in the tech industry Very busy with work and activities Introvert

Needs • A clean and easy to navigate interface, so that he does not waste time • A way to see the important information right away


Use Cases Straightforward interface As an app user, I want a straightforward interface, displaying the important data that I need, so that I can easily create and track rentals, and use my time wisely

Reminder system As a busy college student, I want an easy to use reminder system to remind me when my car rental time is, so that I do not forget and waste my limited monetary resources

How-to guide As an elderly, I want instructions on how to use a vehicle, so that I do not waste my time and resources trying to figure out the different functions of the car


User Flows An app map


Login User Flow User opens the Zipcar app

User directed to a sign-in wall

User enters login information

User clicks on forgot username

User clicks on member contract

User clicks on privacy notice

User clicks sign in

User redirected to a web page

User redirected to a web page

User redirected to a web page

User taken to the search screen Action performed by user Result of user interaction User redirected to an external browser


App-use User Flow User on the search screen

User clicks on Search Nearby User adjusts pick-up location

User clicks on preset date & time User adjusts pick-up time

All available cars previews shown User clicks on car preview

User clicks on cars on the map

Car preview info displayed User clicks on preview info User taken to car info screen User adjusts time, info & reminder

User clicks on back arrow

User clicks confirm reservation

User returns to search screen

Success page displayed

User clicks on drive

User clicks on rental history

User clicks on account

Car information and functions displayed only if there is a reservation in progress*

User taken to rental history screen

User taken to account screen

User clicks on a previous trip

User clicks on ‘Help and FAQ’

User clicks on a previous trip

User redirected to a web page

User taken to drive screen User clicks on ‘Honk’ User taken to trip info screen

User clicks on ‘Sign out’

User clicks on back arrow

User taken to initial sign in wall

User clicks on ‘Lock’ User clicks on ‘Unlock’ User clicks on ‘How to Use’ User directed to How to Use screen


Wireframes

Sketches of the redesign


Search Screen Zipcar

1. Clicking on any item within this area, causes the pick up time and location menu to expand so that the user can edit them, as seen in the screen to the right

Search Search Nearby

1

Today from 2pm – 3pm

2. Clicking on any of the car markers on the map, causes the car preview information to be displayed below 3. Clicking on the car preview information opens a new screen with the detailed information regarding the car

2

4. The Search screen is the current screen 5. Clicking on Drive triggers the Drive screen to open 6. Clicking on History triggers the History screen to open 7. Clicking on Account, triggers the Account screen to open

3 Subaru Equinox Automatic

4 Search

$7/hr Available

5 Drive

6 History

7 Account


Search Screen Zipcar

1. Clicking allows user to edit their location/pick up location

Search

2. Clicking this activates the My time is flexible� field

Search Nearby 1

2213 Higuera St.

3. Clicking switches to the Drop off time carousel 2

My time is flexible

Pick up Today Sun Dec 9 Mon Dec 10

Drop off 3 90 10 11

0A 30

M PM

5

Search

Subaru Equinox Automatic

Search

Drive

4

$7/hr Available

History

Account

4. Pick up/drop off time carousel allows user to pick the time 5. Clicking Search unwinds the menu and displays the available cars


Making a Reservation Zipcar

1

1. Clicking on the back button takes the user to the Search screen

Search

2. Clicking on the Pick-up time displays a mini date and time carousel 3. Clicking on the Drop-off time displays a mini date and time carousel 4. This triggers a mini carousel to set up a reminder time 5. Help and information open the corresponding web page

Subaru Equinox Automatic

Location: Price:

2213 Higuera St. $7/hr or $80/day

Pick-up time: Drop-off time: Reminder

2

Sat, Dec 8 at 9AM Sat, Dec 8 at 11AM 3 4 20 minutes before

Sub-total: Tax: Total:

$14.00 $0.50 $14.50

Help and more information? 5

ConďŹ rm Reservation

Search

Drive

History

6

Account

6. By clicking, the user reserves a car, and a success screen is dis played.


Making a Reservation Zipcar

1. Mini carousel through which the user can choose an appropriate time.

Search

Subaru Equinox Automatic

Location: Price:

2213 Higuera St. $7/hr or $80/day

Pick-up time: Drop-off time: Reminder

Sat, Dec 8 at 9AM Sat, Dec 8 at 11AM 1 20 minutes before 30 hour

Sub-total: Tax: Total:

$14.00 $0.50 $14.50

Help and more information?

ConďŹ rm Reservation

Search

Drive

History

Account


Making a Reservation Zipcar

1

Reservation Successful

Success! Your reservation of Subaru Equinox has been made!

1. Clicking on the back button takes the user to the Search screen


Drive Screen Zipcar

1. Clicking opens the map to help user navigate to the car

Drive

2. Clicking on the Pick-up time displays a mini date and time carousel 3. Clicking on the Drop-off time displays a mini date and time carousel 4. Clicking unlocks the car 5. Clicking locks the car

Subaru Equinox 8JKL912

1 2213 Higuera St.

Location: 2

Pick-up time: Drop-off time:

4 Unlock

Sat, Dec 8 at 9AM Sat, Dec 8 at 11AM 3

5 Lock

Report a problem

Search

6. Clicking causes the car to honk so that the user can easily locate it

Drive

6 Honk

7 How to Use

8

History

Account

7. Clicking opens the How to Use screen (Right screen) 8. Clicking causes a pop-up with Zipcar phone number to open so that the user can call the company and report the problem.


Drive Screen Zipcar

1. Clicking returns the user back to the initial Drive screen

Drive

1

2. By clicking, a short instructional video plays

Subaru Equinox Model 2016

How to turn the car on

2

How to use the parking break

Search

Drive

History

Account


History Screen Zipcar

1. Clicking takes the user to a screen with detailed information about each reservation

History 1 Subaru Equinox November 12, 2018 $15.20

Subaru Equinox October 1, 2018 $17.50

Ford Fiesta Decemebr 12, 2017 $95.56

Search

Drive

History

Account


Account Screen Zipcar

1. Clicking takes the user to an external web page with help information

Account

2. This signs the user out and takes them back to the sign in wall

Tino Tonitini

Zipcard number: Gas card number: E-mail: Payment:

123498765 5599887745321 ttonitini@yahoo.com **********1234

1 Help and FAQ

2

Search

Sign out

Drive

History

Account


Moodboard

Colors, typography and more


Modern, Clean and Simple This style is modern, clean and modern. The green tones are lighthearted and illicit a sense of comfort in the user. Meanwhile, the cooler gray colors, convey a modernity and sleekness that elevates the application in the user’s eyes.

Aa Bb Cc Dd Ee Ff Gg

Aa Bb Cc Dd Ee Ff Gg

This is a Title This is text. This is text. This is text. This is text.

Aa Bb Cc Dd Ee Ff Gg


UI Design

A new look for Zipcar




UI Redesign Overview Zipcar provides automobile reservations to its members, billable by the minute, hour or day; members have to pay a monthly or annual membership fee in addition to car reservations charges. As a member with the free Zipcar app, you can find cars and vans in your neighborhood and across the globe—and reserve and unlock them, too. Gas, insurance, mileage, and dedicated parking are included in every reservation.



Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.