Travvellr is a mobile app prototype that aims to break down cultural barriers by fostering positive interactions between tourists and locals.
We hear stories every week about negative interactions or friction between tourists and locals, which can often reinforce cultural divide. What if tourists could engage in experiences that both provide rich and fulfilling experiences, and break down cultural barriers along the way to create a more friendly global community?
"Travvellr allows you to dive deep into learning the culture and history of your next destination straight from locals." It aims to integrate these interactions seamlessly into a tourist's itinerary by focusing on things they'd already be doing so that it won't feel like an obligation or a chore.
The initial idea for the platform was to focus on negative behaviors exhibited by tourists and to take a psychological approach to root them out. This would later change to focus on letting positivity build positivity rather than trying to build positivity from negativity (more on this later).
Banners in Barcelona ask tourists to stay quiet at night.
Photo courtesy of the Barcelona City Council.
The initial analysis featured four competitors:
Travel Smart: How can cultural info be integrated with useful tools?
Barcelona City Council: How does a city facing tourism issues protect locals?
Kingdom of Bhutan MDPR: How do mandated initiatives affect tourist experience?
FairTrip: How can "good tourists" find activities in line with their preferences?
It focused on qualitative data such as:
Counteracting negative behaviors.
Incentives.
Integration of initiatives into what tourists are already doing or paying for.
A summary of my findings is found below. View the complete analysis in a slideshow.
Travel Smart
Integrates cultural information into useful tools, but it could be more tailored.
Barcelona City Council
Comprehensive plan to tackle tourism issues, but no "catchy" incentives for tourists.
Bhutan MDPR
All tourists who visit Bhutan support initiatives. It's expensive but covers most costs.
FairTrip
Free and self-marketing, but could use more incentives to reach a wider audience.
Logos courtesy of respective competitors.
Key Takeaway: It can be helpful to look into competitors that aren't just software platforms.
Three user interviews were conducted, focusing primarily on users' needs and goals as tourists, considerations they make to local livelihoods, and insight into positive and negative interactions from past travel.
Some key quotes included:
"If you don't speak their language, you have to rely a lot on mannerisms."
"Companies are putting a premium on eco-tourism. Could something similar like cultural or social tourism be done?"
"I want to know where the best food spots are, I need standards. If all you put on your food is salt and pepper, you don't get to make a review."
The following key needs and goals emerged, which led to the corresponding features:
Pick up language basics. → Learn useful expressions.
Understand mannerisms to avoid missteps. → Read cultural info when selecting a destination.
Find the best food spots. → A "Cultural Eating" section that includes cultural food tours.
Highlight reputable reviewers. → A "Reputable Reviewers" section for applicable activities.
Get settled in quickly. → A "Long-Stay Orientations" feature for an extensive welcome.
Avoid dangerous areas. → A map feature highlighting neighborhoods to avoid.
With interviewees focusing much more on positive experiences than negative ones, and after reflecting on how the scripts (van Oost, 2003) of focusing on negativity could come across as patronizing, the design problem shifted. Instead of rooting out negative behavior, going forward I would try to build positive interactions to allow negative ones to naturally be avoided.
Key Takeaway: Ask more follow-up questions to probe answers given (this was a helpful critique of my interviews).
With the goals of potential users in mind, it was time to begin visualizing how they would interact with the platform. Three personas were created based on the interviewees, and two additional partial personas were created based on secondary research (focusing on a tourist who exhibited negative behaviors in the past, and a person who works for a tourism board to promote their city) for the purpose of scenarios.
The personas included quotes, demographics, story and experiences, context of using the platform, goals and motivations, and questions, concerns, and obstacles.
An example of a persona based on an interviewee. View the primary personas in a text-based slideshow.
Based on each persona's goals and motivations, and keeping in mind their questions, concerns, and obstacles, five scenarios were created and visualized as storyboards to show how the personas would meet their goals on the platform. These scenarios would form the core content of the platform moving forward.
"Foodie Fred's" storyboard shows him booking a cultural food tour as well as the in-person interaction that follows.
View all storyboards in a text-based slideshow.
Key Takeaway: Artistic choices to show vision, focus, and motion can make scenes easier to understand.
Five scenarios had been created, so now it was time to translate them into navigation and functionality. Unlike I've done in previous projects, Travvellr's user flows focused on the specific scenarios from the previous section rather than trying to capture the entire system in one flow.
Additionally, the flows include things like annotations (to account for user errors and other considerations), swimlanes (to group actions into sections), and wireframes (to visualize the key points).
Several text-based flows are in Figma:
The Back-End City Registration Flow is important because it shows how a service provider enters activities, which is what Travvellr would depend on to fill its content (governments, tourism boards, and locals).
Key Takeaway: Annotating things like errors, wandering off path, and additional considerations is critical.
The prototype focused on interactions like messaging.
The five scenarios planned in the user flows were recreated as a paper prototype. The prototype focused on interactions, and I tried to get creative with things like scrolling (both horizontal and vertical), messaging, image uploads, and more.
As this was my first time paper prototyping, I found it a valuable learning experience. For example, in my first pass I was meticulously measuring components, and found that I was taking too long to make the prototype without getting much out of it (since it hadn't been tested yet).
Rapidly testing and iterating the prototype (more on this in just a moment) and taking a looser approach to the iterations helped me get much more out of the paper prototyping process in this next phase.
The prototype was tested with three users chosen using convenience sampling. For the tests, participants went through the process of all five scenarios while following a think aloud protocol. Sample feedback questions include giving a numeric ease of completion rating, to share any points of confusion, and to share any suggestions for additional features. Following completing the scenarios, they were asked similar questions about the prototype as a whole.
Average Ease of Completion Ratings:
Japanese Greetings: 4.7 out of 5
Cultural Food Tour: 5 out of 5
Long-Stay Orientation: 5 out of 5
Coffee Hour with a Local: 5 out of 5
Create Excursion, View Analytics: 5 out of 5
Key Feedback:
Include a breakdown of prices displayed.
Include a way to contact hosts.
Add Help and About sections.
Want to see more detail? View the notes from one of the sessions.
Key Takeaway: Let the paper prototyping process be quick, and iterate frequently.
With usability testing feedback in hand, I brought the paper to life as an interactive digital prototype. It was key to take the paper prototype further by paying mind to the seven fundamental principles of design (Norman, 1988), most notably discoverability (it's clear what users can do in each state and the paths to follow) and signifiers (making discoverability possible through clear cues and feedback).
Testing was again conducted with the same participants, structure, and questions, however due to time only three scenarios had been prototyped prior to the test.
Average Ease of Completion Ratings:
Japanese Greetings: 5 out of 5
Cultural Food Tour: 4.7 out of 5
Coffee Hour with a Local: 5 out of 5
Key Feedback:
Include a signifier on pages where scrolling is allowed.
Link to a menu for restaurants and other food activities.
Add a voice translator to allow users to translate phrases aside from the presets.
Want to see more detail? View the notes from one of the sessions.
A down arrow was added to scrollable pages as a signifier.
Key Takeaway: Don't wait to include fundamental design principles (include them in paper or early prototyping).
A few challenges I ran into with the digital prototyping included getting the scrolling signifier to disappear as you scroll and to work error messages into the flow when no real data is being entered.
The workaround solutions for these were to make the arrow disappear automatically after two seconds and to create non-interactive mockups to help visualize error messages (paying mind to what developers look for in a handoff).
As I worked on incorporating the rest of the usability testing feedback, since my initial competitive analysis was focused on behavior I realized (a bit late, but not too late!) that I would need to add a fifth competitor to benchmark things such as travel app features I may have been missing.
I chose Viator as my fifth competitor, and noted the following features that were missing from my prototype to this point:
The ability to save activities.
The ability to share activities.
Display the number of reviews for an activity.
Show cancellation options (considered in user flow, but not initially prototyped).
A search for a non-participating destination shows an error message.
Key Takeaways:
Add annotations and create non-interactive mockups to account for things that can't be naturally prototyped.
It may be necessary to revisit earlier parts of the process based on shifted plans.
The prototype is available in Figma, and it includes the five scenarios that have been consistent throughout the project:
Tourist Scenarios:
Learning basic greetings and introductions in Japanese (Tokyo).
Booking a cultural food tour in Amman, Jordan.
Booking a long-stay orientation in Arusha, Tanzania.
Booking coffee hour with a local in Phuket, Thailand.
Service Provider Scenario:
Uploading an excursion into Travvellr on behalf of your city.
Additional features that are noted but not yet included are:
Booking a miscellaneous excursion.
Viewing a map displaying neighborhoods to avoid.
Travvellr was made with the objective of diving deep into interaction design in mind. A key interaction, messaging (as seen in the paper prototype) is shown here.
Travvellr was a solo project, however I'd like to thank the following people for their contributions:
Dr. Jean Hardy (course professor)
Interviewees
Usability Testing Participants
MI 844 Classmates