The Project

Travel Buddy

As a passionate traveler, I’ve noticed many people dream of traveling and have the income to do so, but fail when it comes to planning and saving for trips. For my very first UX project, I decided to create a travel app that helps inexperienced users budget their finances and become knowledgeable on travel tips and trends, therefore making the joy of exploring more accessible.

TravelBuddy2ScreenMock.jpg

The Challenge

How do we encourage users that lack knowledge and experience in the travel planning process?

How can we ease the paralysis of fear and empower users?

How can we create a platform that is both easy and minimal but also fun to use?

The Goal

Get users excited, empowered, and confident in their travel planning and budgeting so they can actualize their dream travel destinations

My Role

As the lead designer of this app, I did research, sketching, wireframing, prototyping, and user testing.

Tools Used:

Sketch, Adobe XD, Invision, Maze

Who are our users?

Research has overwhelmingly shown that millennials are the fastest-growing travel market. In 2021 that makes up the age range of 24-40 year olds. 

unsplash-image-Ycds6emp7BA.jpg
 
unsplash-image-p2TQ-3Bh3Oo.jpg

Millennials prefer to spend their money on experiences rather than things, gathering these through reviews and ratings, as well as friends and social media inspiration. Although financially capable of traveling, this demographic is often held back by concerns over uncertain futures and financial budgets. Many are under the impression that wealth is required to travel.

Sketching Solutions

The Process

  • Affinity Mapping

    After extensive research and surveys, I grouped together the most common concerns millennials have about travel

  • Brainstorming Ideas

    Based off my research results, I began to freely sketch any ideas that came to mind. Playing around with different buttons and concepts

  • Lo-Fi Wireframes

    Once I established the main components, budget, information, and trip planning I worked on more specific wireframes

  • User Flow

    Now that the main functions of the app were decided on, I explored the different user flows

  • High Fidelity Screens

    Putting everything together, I created basic high fidelity screens

  • Moodboard

    Then it was time to think about aesthetics and the overall visual identity of Travel Buddy

  • Styleguide

    Making specific decisions about fonts, buttons, and other visual elements

  • Prototyping

    And finally putting it all together, and creating a fully useable prototype ready for user testing

Budgeting

Without having to think about it

The most important part of this app is to make travel dreams actually possible. I felt this could be best achieved with automatic monthly savings, this way the user is saving towards their goal little by little without having to calculate or worry. The user is in control and decides how much will be transferred into their savings fund each month. Once set up it is completely automated.

Travel Planning

Gamification (More on this further down)

Initially, the second most important pillar of Travel Buddy was going to be an in-depth planning section.

In the process of ideating and iterating, I came to the conclusion that along with budgeting it might be too much for an inexperienced user and I would risk a high bounce rate.

This is when I decided to turn this section into an incentivized gaming feature, where the user learns through play.

Travel Articles

Daily updated travel tips and trends

And finally, with a section dedicated to the travel industry, the user can read up on anything travel-related and save articles they enjoy or want to reference later.

Based on a user’s interest an algorithm might also suggest related articles.

 

Design

Adjusting ideas to software

My initial design ideas incorporated both elements from android and iOS operating systems. Although I was very pleased with the styles I chose, for the sake of programming and development, I chose to simplify and design for iOS to make everything consistent.

My initial designs have a lot of round features and sliding elements, including an Android typical slide-out menu.

 
Screen Shot 2021-06-25 at 9.54.36 AM.png
 

Redesign

Making the design more compatible with iOS

Apple believes that primary navigation elements should be in the foreground and that the hamburger menu should be used only to store functions that aren’t daily tasks performed by the user. The main iOS menu consists of a navigation bar that generally doesn’t have more than 5 buttons. Contrary to my previous design and androids slide-out menu. Overall Apple is very minimal in its design and has specific guidelines so I adjusted my design according to them.

My design has been modified to reflect standard iOS spacing and sizing.

 
Screen+Shot+2021-06-25+at+9.54.58+AM.jpg

Pivoting into Gamification

Modifying User Behavior through play

As mentioned earlier, I was trying to figure out a way to help inexperienced travelers learn about travel so they don’t feel so overwhelmed in the planning process. Initially, I was going to build a travel-planning feature but for someone who is new to this process, in addition to the budgeting feature, it just might be too much, therefore leading to the same outcome that we already see, people, putting off their desired travel.

After further research into app gamification and its overall success, I decided to take the chance and replace my travel planning section with a rewards points game section. Regardless of age, users enjoy learning through play, it takes away the fear and if implemented correctly builds confidence.

 
Screen Shot 2021-06-25 at 12.01.17 PM.png

The Evaluation

Usability Testing

Screen Shot 2021-06-25 at 12.23.53 PM.png
 

User Feedback

  • Users felt the progress wheel graphic was confusing

  • A lot of rounded elements caused the idea that certain elements were clickable and interactive

  • Users were unaware of an automated calculating feature in the setting up payments tab

  • The points/rewards button was too small

Screen Shot 2021-06-25 at 12.24.05 PM.png

Redesigns

  • Rounded edges were taken out to provide a more flat less interactable look

  • The automated calculation box was filled with indicative text “Let us do the math for you!”

  • The savings progress graphic was changed from the progress wheel to a flat picture incorporating the app logo

  • The menu bar was changed to showing a description of the icon only on the page the user is currently on

  • The Reward/Points button was enlarged and given a bright yellow color to be more noticeable

 

Future Improvements

  • Overhaul the UI, simplifying and cleaning up the color theme.

  • Add more illustrative graphics to the rewards game section

  • Potentially adding in some animated features as well

Reflections

Breaking tasks into small pieces and being aware of your strengths and weaknesses is key.

  • User testing and feedback is a gift, it is challenging to predict the experience of every single person at the same time and often when we zoom into a project what we need the most is perspective. User testing is a great way to fill in the blindspots and to learn and stay open to improvement.

  • Gamification should be added wherever possible, people learn and enjoy best through playful processes. Constant simplification and consistency is key in successful design

  • Users are more inclined to participate with incentive and confidence-building challenges.

Why isn’t this working?

A note about methods and growth as a designer

One of my biggest challenges about this project was not only being new to the process of User Experience Design but also simultaneously learning new software. I kept bumping heads with Sketch, trying to figure out more efficient ways to complete certain tasks. It eventually became so frustrating, it robbed me of valuable time and also kept interrupting my creative process. I finally had to stop and think of how I could solve this issue and came to the conclusion that I should just try another comparable software and see if it was more intuitive to use for myself.

As soon as I started using Adobe XD, my frustrations were lifted and I felt like I was flying. Was the software exponentially easier than the previous? Perhaps not, but it worked for me. Recognizing my problem, humbly accepting it, giving myself some grace, and trying to find a way to tackle it from another direction, or in this case software helped me succeed in the end. There are often multiple ways of achieving something. And now that I am comfortable in Adobe XD (as well as Figma), I also understand Sketch.

So at the end of the day I ended up familiarizing myself with all major UX design softwares on the market.

The key is to recognize that failure is more often than not an integral part of success.


Prototype