aaaaaaaaa.jpg

Brief Summary

Viaggio is a travel app that incorporates a beginning to end journey to plan, organize, and manage a trip alone or collaboratively. The challenge was to redesign a new traveling app to make the user feel more excited, less stressed, 
and organized while booking, planning, and traveling.

Services

User Interface, User Experience, Brand and Design Identity

Client

UX UI Springboard Bootcamp

Year

2020

Problem Statement

Help users have one singular and collaborative platform where they 
can plan, organize, and store their booking and travel documents 
during travel.

Secondary Research

On the internet, there are 
on average 148.3 million bookings a year.

89%

44%

Of Americans are stressed
out over planning family
vacations.

Don’t use all their vacation days due to being a
“non planner”

Image by Arseny Togulev

Research

User Research

I interviewed a total of 5 participants who travel and book trips over three times a year. In framing open-ended questions and creating a scenario of booking and planning a trip in a large group, I got insight to their experience, behavior, emotions, and struggles as they were planning.

I found that participants avoided big decisions, didn’t feel confident about their processes nor the choices they made. To add on, participants used many platforms to do research, to book, and feel out what the best options were. This forced them to navigate through many tabs/windows which caused them to feel lost and disorganized. All participants said they would have texted their friend group to discuss possible airfare tickets, hotels, and activities.

Additionally, most of them said that receiving screenshots from a friend would prolong research and some links they would receive would expire. The participants relied on storing their travel/booking information on their iPhone in the notes app, by memory, or by their confirmation email with their reservation.

Participants

5 participants

Screener

Travel 3+ a year

Books online

Condition

Moderated Skype
and Facetime

Findings

01. Similar booking process
02. Felt overwhelmed with options
03. Communication through texting

04. Avoided making big decisions
05. Multi platform research

 

User Research Questions, Quotes, and Observations

Interview Questions:

“Planning for you and your significant other and 2 couples who live in different states to Tusan, Arizona from July 14-27. Please show and tell me how you would go about doing that? Please plan the flight, stay, and activities.”

Interview Quotes:

“Booking for a trip is like buying a car. A lot of discounts, promotions, then added surcharges
and fees.”

“So many options. Mixed reviews. "A catch" with ulterior motive, so don't know what is honest.”

My observations:

He felt frustrated when the hotel price went up when changing the dates, and wanted to change the flight dates based off the price.

She was very scattered when she was conducting the task. She had many windows and tabs open and couldn’t remember where things were and if she did or did not do something.

It seems like she has a routine established and was really organized with her method of planning a trip.

Affinity Map and Empathy Maps

I organized and clustered my research together into an affinity and empathy maps. This was to understand and determine who the personas should be and what the areas of improvement are for the process of booking a trip.

Mask Group.png

Research

Personas 

At this point, I had a thousand ideas. It was time to think about the purpose of the application and identify the persons who would use it. After evaluating the research from my 1:1 interviews, creating Affinity Map, and Empathy Maps, I created two personas: Penelope: The Planner and Nicolas: The Non-Planner.

 

During my 1:1 interview process, there were two main groups that were strongly diversified. 60% of the participants were unconfident, hesitant, and were disorganized throughout the task. These included planning a trip for themselves in a large group including a flight, stay and activities.

Meanwhile, the 40% of the participants had a very strong strategy for the way they planned out a trip, made big decisions.

My goal is to make the Nicolas users feel more confident, at ease, and feel like planning is a approachable process like the Penelope users.

Heuristic Analysis and Competitive Research

Heuristic Analysis
of Competitive Research

For my competative research, 
I took a look at
Pebblar, inspirock, and Geovea. I analyzed three heuristic concepts.

 

 

 


By sectioning each company with heuristic concepts, I organized my information on google sheets. I examined how the company had their own strengths and weaknesses and then determined how to include those strengthens into my own design.

1. Help & Documentation 

2. Consistency and Standards
3. Aesthetic and Minimalist Design

 

Group 10.png

Mapping 

Site Map

With the information I gathered from my competitor research and affinity mapping, 
I created a site map that illustrated what I thought would best navigate throughout the application. 

Initial Wire Frames

Red Routes

When reassessing the interview notes, I established three red routes that both the personas would need to take. Since Penelope users were familiar with booking,
I thought it would important to incorporate methods to help Nicolas users devise a step-by-step process of booking an entire trip.

Since users were too familiar with the booking process, I thought it would be best to provide a guided journey to teach from beginning to end.

1. Add Stay to Itinerary
 

2. Book Flight, Stay, and Activities
 

3. Check Notifications

User Story Sketches

User Story Process

I sketched the screens that related to the red routes and establish the use of icons, information, and rhythm that the application would have.

01. Add Stay to Itinerary
 

02. Book Flight, Stay, and Activities
 

03. Check Notifications

Testing

Guerrilla Testing

Due to Covid 19, I was restricted from testing in person. I tested participants on facetime and skype by reaching out on social media with a informal questionnaire to determine if they were a Penelope or 
a Nicolas user. I tested 5 people my red routes, and asked them to talk aloud with while completing the tasks below.

01. Help & Documentation 

02. Consistency and Standards

03. Aesthetic and Minimalist Design

 



 

My findings were that all participants had trouble with one task; Adding stay to the Itinerary. They shared that the screen was very distracting with the number of icons/words, and weren’t confident to where to press. Most of them. Also, they shared that the icons I used weren’t universal enough, which created some confusion.

Participants

5 participants

Method

Social Media:

Facebook and Instagram

Screener

Travel 3+ a year

Books online

Condition

Moderated Skype
and Facetime

The improvements 

I made were to make the interface more minimal and have 
a higher signal-to-noise ratio

I initially wanted to give the user as many options they wanted or thought they needed, but that just left them confused. I think by creating different areas with the hamburger or 3 dots icon that would include more options I initially had out in the open in the app will be necessary.

Using a Touch Phone

Low Fidelity Prototype

By establishing the improvements and changes I needed to make, it was easy to establish elements to create a more minimal interface, incorporated higher signal-to-noise ratio and contain more universal icons throughout the design.

Group 15.png

Brand Identity: Brand Attributes

Brand Attributes

Based on the insights from the user research, participants felt overwhelmed and unconfident. The participants felt like the process wasn’t approachable. I wanted to create a brand where the users felt the opposite. That is why I chose these adjectives for the brand attributes.
 

Approachable
Caring
Relatable
Sincere 
Confident

Brand Identity: Photography

I wanted to incorporate heavy travel photography throughout the brand.
I wanted to encompass images that a traveler would post or feel relatable towards. Some of these images were a mix of people being social, posing in
front of monuments,
or traveling scenery.

Group 25.png

Brand Identity: Color Pallete and Typography

Color Pallete

Text

High Fidelity Prototype

High Fidelity

I incorporated my brand attributes, brand photography, and brand identity into this prototype.

Testing

Usability Testing

Throughout creating my high fidelity prototype, 
I created more screens than my red routes. 
I wanted to design majority of the screens to identify the usability of the Viaggio app.

Testing

01. 
02. 
03.
04. 

User Friendly
Feels logical and organized
Travel needs are met
Brand

Findings

Most journeys made sense
Essential overlays were not located on the necessary screens
Some UI elements were not clear 
and prominent

 

01. 
02.

 
03.

marten-bjork-FVtG38Cjc_k-unsplash 1.png

High Fidelity Prototype

I adjusted the screens and navigation based off my findings from the usability testing.

01. 
02. 
03. 

 

04. 

Altered the icon to create a drop-down for more options
Added additional flight information that was missing
Created more depth by adding a travel scenery background with the itinerary overlay

Added buttons to the itinerary for a better user experience

01. 
 

02. 
 

Redesigned the itinerary slide by reorganized information based off confusion of user
Created more depth by adding a travel scenery background

01. 
 

I added additional options for the user basing off their needs based off the tasks I asked them to complete.

01. 
 

Added three dot icon on the main chat screen to create a faster and better experience for the users.

jasminemcagosti@gmail.com

All Rights Reserved  2020 jasmineagosti.com