A lively and diverse city, historic North Charleston wanted a campaign that reflected its vibrant atmosphere and signaled that it’s a worthy destination in its own right. As a result, I developed this colorful, eclectic map illustration that highlights the unique features of the city. Our campaign presented North Charleston as a hub from which nearby downtown Charleston, Mount Pleasant, and West Ashely are accessible, but also highlighted some of the fun and exciting aspects that make the city stand out.
Jasmine Agosti
UX UI Designer
Viaggio
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
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.
On the internet, there are on average 148.3 million bookings a year.
89% of Americans are stressed out over planning family vacations.
44% don’t use all their vacation days due to being a “non planner”
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.
Details:
Partcipants: 5 participants
Screener: Travel 3+ a year and books online
Condition: Moderated Skype and Facetime
Findings:
01. Similar booking process
02. Felt overwhelmed with options
03. Communication through texting
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.
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, 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 an approachable process like the Penelope users.
Penelope
"Research is key, it eliminates the stress."
About:
Penelope lives in New York City and is a project manager for a production firm. She strives for organization and enjoys research to stay informed. Her desk is always finely organized with highlighters, post-it notes and organized folders. Penelope travels fairly often for work and needs to choreograph trips for her coworkers. She also goes often on “girl trips” and weekend getaways when she can.
Goals
She is concerned with speed, efficiency, accuracy, and wants apps to be easy on the eye.
She would use this for work and her personal life. She would use it x1 a week to book a trip.
She would need to share all the itinerary information with her colleagues before booking.
She would need to feel like this is an organized process and have easy steps.
Nicolas
"I get stressed when I have to plan something, I usually let my parents or friends plan vacations."
About:
Nicolas lives in Florida and is an insurance agent at a corporate office. He lives a slow-paced life and doesn’t let the “big things” overwhelm him. Nicolas is somewhat comfortable with technology but isn’t too knowledgeable about new software or apps. He mainly travels by car to visit friends in nearby states. He gets overwhelmed while trying to plan a long trip with airfare and hotel. If he were to travel, his parents or friends would do all the planning for him.
Goals:
He cares about speed, accuracy and wants the app to be easy to understand.
He would use this for personal use. He’d use it x6 times a year.
He would use this on his own and have his friends simultaneously use it to plan.
He’d want this to direct him on a step-to-step basis.
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
I sketched the screens that related to the red routes and establish the use of icons, information, and rhythm that the application would have.
1. Add Stay to Itinerary
2. Book Flight, Stay, and Activities
3. Check Notifications
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 an informal questionnaire to determine if they were Penelope or a Nicolas user. I tested 5 people on my red routes and asked them to talk aloud while completing the tasks below.
1. Add Stay to Itinerary
2. Book, Flight, Stay, and Activities
3. Check Notifications
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 wasn’t confident about where to press. Most of them. Also, they shared that the icons I used weren’t universal enough, which created some confusion.
Details:
Partcipants: 5 participants
Method: Instagram
Screener: Travel 3+ a year, books online
Condition: Moderated Skype and Facebook
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 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.
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.
Brand Identity: 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.
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.
Brand Identity: Color Pallete and Typography
High Fidelity
I incorporated my brand attributes, brand photography, and brand identity into this prototype.
Usability Testing
Throughout creating my high fidelity prototype, I created more screens than my red routes. I wanted to design the majority of the screens to identify the usability of the Viaggio app.
Testing
1. User Friendly
2. Feels logical and organized
3. Travel needs are met
4. Brand
Findings
1. Most journeys made sense
2. Essential overlays were not located on the necessary screens
3. Some UI elements were not clear and prominent
High Fidelity Prototype
High Fidelity Prototype
I adjusted the screens and navigation based on my findings from the usability testing.
Solution 1:
1. Altered the icon to create a drop-down for more options
2. Added additional flight information that was missing
3. Created more depth by adding a travel scenery background with the itinerary overlay
4. Added buttons to the itinerary for a better user experience
Solution 2:
1. Redesigned the itinerary slide by reorganizing information based on the confusion of the user
2. Created more depth by adding a travel scenery background
Solution 3:
1. I added additional options for the user based on their needs based on the tasks I asked them to complete.
Solution 4:
1. Added a three-dot icon on the main chat screen to create a faster and better experience for the users.
