Time Frame
3 weeks
Release Date
January 7, 2021

Hidden Destination was created to help travelers find hidden gems in locales that travelers are interested in traveling to.

This app is about "discovering" and "providing ideas" to "hidden travel destination".

Hidden Destination Overview
Hidden Destination Overview

Roles and Responsibilities

I worked with my client as the sole UX/UI designer and researcher to conduct interviews, do competitive analysis, and create a design that helps users find interesting places to visit base on their travel preferences.

Problem and Challenge

Most of the travel websites focus on popular travel destinations, but there's a lot of hidden gem off the beaten paths.

My main problem is "How can we help people discover those hidden gems that are yet being discovered?"

My Solution

I used "Search + Filter" and "Explore" two functions to help users who know where to go find the hidden gem they're looking for in that destination and provide ideas to people who not yet know where to go.

Process: Double Diamond and Agile-Based Sprint

I used the double diamonds method and agile-based sprint to solve the problem.

The double diamond model
The double diamond model (Source from Nielsen Norman Group)

After I found the problem, I then defined the problem by conducting research. Following this, I came up with solutions that could fulfill users' needs and started to do the wireframes and prototype. Next, I did three usability testing. And I modified my design along the way while I was doing the usability testing so the next tester could have a better experience and provide new feedback. After all three usability tests were done, I made a final change and had the final delivery of the product.

Problem Statement & Goals

People were looking forward to traveling in 2021. My client and I saw this opportunity and we wanted to create a travel website which is a little different from the rest of the existing ones. Most of the travel websites are recommending same places. We wanted to focus on places that are less popular. We wanted to find the hidden gems and let people share their own experiences.

Problem: How to help people discover hidden gems off the beaten paths?
Goal: Develop an website/app that would
  1. Enable users to find what they want.
  2. Provide ideas to travelers with different needs.
  3. Organize the information clearly.
  4. Encourage people to create a community.

User Research

My client already had some data of the potential users in hand. Hence, due to budget and time constrain, I used secondary research and competitive analysis as my main research method before developing persona and user flow.

Secondary Research:

Who travels? Among those people, who will be our user?

Millennial aged 25-35, more likely to be female. Mid to low income. Looking to travel alone or with friends. Focus more on US domestic destinations but also collect international information. Use their phone to do the searching. Most of the time, they don’t have a clear destination in mind.

Resource:

  • Travel and Tourism Statistics: The Ultimate Collection, Andrew Graft, 2020.
 Resource here
  • How the Travel Research Process Plays Out in Time-to-Make-a-Plan Moments, Think with Google, 2016. Resource here
  • Millennials: a New Trend for the Tourism Industry, Bogdan SOFRONOV, 2018.
 Resource here

Competitive Analysis:

How can we be different? What can we learn from them?
1. Tripadvisor Forum

S: Category / “Forum” function (how people interact with each other)

W: Not enough photo / Most places are quite popular

O: Add more photos / Improve user experience / Focus more on less popular destination

T: Provides good ideas about travel and could book everything in one website (same as Expedia, Sky Scanner)

2. Instagram

S: Good resource to find ideas (Photos presentation and website structure)

W: Not travel orientated

O: Being travel orientated / Makes search function better

T: There are a lot of influencers or accounts on Instagram who are dedicated to travel related posts

3. Other competitor inspiration

Airbnb: Main page layout

Pinterest: Photos presentation, website structure, and “Collection” function (to give ideas)

Tumblr: Mixing photos and text. Scroll-down design (to attract users to keep exploring)

Research Findings:

According to the research findings. More and more users are using phone to search for travel ideas. So I convinced my client to develop an app instead of a website. It'd not only match the users behaviors also easier to develop within the tight timeframe we had.

User Persona: Meet Sarah & John!

After talking to my interviewees and digging into travel-related research. I developed my persona. This could help me shape more vivid users in my mind and empathize with what they want and what they need.

User Persona 1: Meet Olivia!
Persona 1 - Olivia
Persona 1 - Olivia
User Persona 2: Meet John!
Persona 2 - John
Persona 2 - John
Both personas are in their late 20 to early 30 and pretty confident with using technology. They are looking for something different or exciting in their life.

User Journey and Empathy Map

After the persona, I chose to use Olivia's profile to develop user journey and empathy map (female would more likely to be our main user) so I could better understand what Olivia is experiencing and thinking when using our product.

User Journey and Empathy Map
User Journey and Empathy Map

User Flow

Next, I created a user flow based on the journey map. When I was developing the user flow, I took both Olivia and John's personas into consideration so I knew what my users are looking for. After all, not all users are looking for the exact same thing.

For Olivia, she knows what to look for (or what keyword to type in). But for John, he has no clue of where to start from. Hence, this user flow illustrated both users: the ones that know where they're going (or looking for) and the ones who are here for travel aspiration.

User Flow
User Flow

How to solve the problem

After the user flow, I had a more clear idea of what the users' needs are and how they would use the product. Following this, I gave more details to my problem statement and solved the problem with corresponding solutions.

Solutions
Solutions

Develop Design Ideas

After developed the solution, I used processes like “Crazy 8’s” and “4 step sketch” to turn the ideas in my mind on paper so I could see which one might work and discuss with my client.

My client and I had a long discussion about whether we should have the main page which combines "Search" and "Explore". We decided to separate on the first design and let the user testing tell us how the users think.

Crazy 8s
Crazy 8s
Note Sketch
Note Sketch
Used sticky note to mimic animation
Used sticky note to mimic animation
Paper prototype
Paper prototype
Digital Sketch:
This is the sketch I used to discuss with my client. After discussion, we decided to separate "Category" and "Photos from other's upload", and see how users respond.

Wireframes

After letting my mind go wild, I went back and took a look at my user flow and my solution. I started to do wireframes.

Wireframes
Wireframes

Usability Testing

There were few design decisions I'd like to test users responses before continues carving the design. Hence, I conducted users testing once the low-fi prototype was ready and kept iterating my design along the way.

3 testing: 2 remote / 1 in-person
  1. Male, 35, married, heavy tech user, travel abroad 1/year & domestic 3/year, IT (in-person, moderated)
  2. Female, 28, single, mid-tech user, travel abroad 1/2 year & domestic 4/year, Office  (remote, unmoderated)
  3. Female, 26, single, mid-heavy tech user, travel abroad 1/2 year & domestic 4/year, Research  (remote, moderated)
Tasks
  1. You want to know what cool castles there are in Ireland and then save them into your collection.
  2. You are not sure where to go, but you like outdoor activities. What would you do?
Usability testing with tester #1 and #2
Usability testing with tester #1 and #2

Observation

1. Landing page (ask for interests) could cause confusion.
2. Name of the tab bar wasn’t clear enough.
3. Users don’t know what “Explore” is for.

Pivots based on usability testing

1. Scroll part should be all the way through the screen.
2. Consider adding a “Home Page”.
3. Rethink “Explore” and how to guide users there.
4. Remove the page which was asking for "Interest".

Final Product

I modified my design according to the usability test results, including: removed the page which asks for interest, added a home page, simplified Explore option...etc.

Here is my final delivery of the clickable high fidelity prototype CLICK

Sign up process
Sign up process
Search your destination
Search your destination
Explore for travel ideas
Explore for travel ideas
Link to my project
Overview of the final product

Final Thoughts

Future Development

  1. Create a system to do the filter and deliver accurate search results
  2. Create a good algorithm to recommend posts that would interest each user on "Explore"
  3. Interface: maybe more text in the future.

Lesson Learned

During Define
  1. A survey would be helpful:
    I spent most of my time talking to the client and doing secondary research. But I think it'd very helpful if I could do a quantitative survey to get the answer to the questions that I'd like to know more and couldn't find it by doing secondary research.
  2. Do user testing with the user:
    Due to the holiday season, I sent the task and asked the tester to record and sent the feedback to me. But the tester didn't follow my task. Hence, she was confused.

During Design

Search v.s Explore:

I spent some time trying to figure out how to distinguish "Search" and "Explore" during the design process. Especially after the user testing, I realized that what's obvious to me isn't obvious to others. This is why user testing is so important.

©copyright 2021 jenccchang