Wander

UI & UX DESIGN・PRODUCT DESIGN・WEBSITE
Challenge:
Help travelers create daily itineraries that they trust
Timeline:
August 2017 (1 month)
Sector:
Leisure travel
Role:
UI & UX Design
Product Design

Curating personalized travel itineraries

Wander is a speculative project to explore designing a brand new product. This personal project came about from my love for travel.

The idea started when I was planning my trip to Southeast Asia back in August 2016. I spent months scouring the Internet for blog posts and trusted travel websites, pinning different bucket list ideas for Southeast Asia. 

I spent too much time in the planning process that I began to wonder if other people found it as tedious and the idea of Wander started.

How do people decide that they can trust an itinerary that is given to them?

In order to truly help people save time when researching a destination, they have to trust the itinerary we give them.

Designing for trust

The main constraint to my solution is whether users will trust the itineraries that Wander curates. One potential concern is people who have FOMO (fear of missing out), because they prefer to do the research themselves in order to not leave out something that they would want to experience.

Wander’s recommended itineraries would be an aggregation of several travel blogs or sites that are well established in the travel industry, potentially specific to each region. 

For example, if several travel blogs recommend doing the same activity XYZ, the more likely that this activity will show up in your itinerary.

By using verified travel information sources, users can rest assured that their itineraries will contain worthwhile activities that match their preferences.

Learning user preferences for travel with machine learning

Wander would use machine learning to continue curating itineraries by learning what users prefer. As the user continues to use Wander, they are rewarded with itineraries that better match their travel style.

Research

Are other companies doing this? If so, how?

There are two types of itinerary planners:

  1. You provide the activities to build your own itinerary
  2. Smart planners that create the itinerary for you (Wander intends to do this)
None of them provide off-the-beaten-path experiences I want to target nor do they give the user enough confidence in the itineraries offered.

Define

After gathering all of the information from my users, I now have a better idea of who my users are and their wants and needs.

Wander Persona

Choosing the first features to design

In this first iteration of Wander, I focused mostly on designing the features that were most valuable to my users based on my research and that were easier to implement in terms of coding (top left corner of the chart below). The other features outlined would be part of future iterations.

Choosing between designing for web or mobile app

According to The 2014 Traveler's Road to Decision by Think with Google, over 70% of leisure travelers use a computer/tablet during the Inspiration and Research phase of the travel planning process.

2014 Traveler's Road to Decision by Think with Google

Per this discovery, I decided that Wander would be a website first and there would potentially be a complementary app that users can utilize to view/edit their itinerary while on the trip. This potential app is not covered in this project.

Ideate

Learning travel preferences through a Travel Style Quiz

Because trusting the itineraries that Wander provides is at the core of what we want to achieve, a travel style quiz that helps us understand the user’s travel preferences and wishes is necessary. After all, if my users don’t trust the itinerary, they will feel the need to do more research on their own and won’t use the service again.

Wander picks off-the-beaten-path experiences for your itinerary based on your preferences from your travel style quiz results.

Ability to see your curated itinerary by calendar, list or map view

Wander has different ways in which you can view your itinerary. You can see your full itinerary in a calendar view, see more details in a list view, or get a more visual representation of your itinerary in a map view.

Calendar view of the itinerary
Map view of the itinerary
List view of the itinerary

Based on your travel style, Wander can also suggest a city to visit if you don't know where to go

A feature that I thought would be delightful was to have Wander suggest several experiences for you based on your preferences. When you have made your choice, Wander would then create an itinerary around that experience.

Creating a navigable website

After deciding to have a travel style quiz, it was time to construct the structure of the website.

Thinking through a user's journey when creating an itinerary

Branding for Wander

The design of the website should invite people to want to travel. 

Curious | Adventure | Artsy | Fun | Quirky

I did several iterations on this:

After much thought, I decided to use a hot air balloon as the logo. It clearly evokes sentiments of wonder, of adventure.

The shade of orange in the logo was chosen since the color is associated with happiness, cheerfulness and adventure.

The look of Wander

Careful of the look and feel I wanted to maintain, I created the UI kit below.

For the color palette, I used blues and gray to complement the orange. Blue to convey trust and grey as a versatile base color.

Prototype

In order to test the usability of the website for Wander, I needed to create the wireframes and create the prototype.

Using wireframes to test usability of Wander

Using the sitemap, I sketched out the wireframes first and once I was happy with the layout, I created them on Sketch.

Click here for the full screen version

Using these wireframes, I created a working prototype of the website. The features showcased in the prototype are:

  1. Travel style quiz
  2. Ability to use the user's answers to create a travel plan for a known destination
  3. Ability to choose a random destination/experience (Wander)
  4. Different views of the itinerary: Calendar, List and Map
  5. Ability to modify itinerary
  6. Ability to add activities from Wander itself or 3rd party

Testing

For the testing of the website, I interviewed 5 people who were from my initial user research.

Using the prototype, I observed them as they went through the 6 features described earlier.

Affinity map illustrating insights from user testing

For the next iteration of Wander, I will need to address the items that need rework and this is how I plan to tackle them:

Despite the reworks suggested, there was a lot of excitement around the product and a lot of recommendations for additional features that would make it even better: a common theme was integration with social media and having friends see their itineraries.

Learnings

Passion creates better work

Wander was a very fun project to work on especially because I am passionate about travel and the problem is very dear to my heart.

It was very humbling to hear the amazing feedback I got after my users heard what was Wander about. People were very excited about the possibility of having an automated personalized itinerary.

The aspect that I enjoyed the most about this project was the ideation phase especially applying the insights from my user research to design the workflow of how people would use the site. Another part of the process that I also enjoyed was creating the final look of some key screens. 

Test one thing at a time

In retrospect, I learned that I should create a prototype for each specific feature to make it clearer for me and the users what they are testing. I only created one prototype to showcase 6 different features. I believe it would have been cleaner if I had 6 prototypes to clearly showcase each feature and not confuse the user since there were other clickable items in the screen to test the other features.

view previous project
Click to copy
It's ok, it won't open your native email application
My email has been copied to your clipboard!
Now go and say hi! 🤓
EMAIL