COLAB15 - WEB APP

TravelBuddy

TravelBuddy is a web app that allows travellers to collaboratively plan their itineraries, all in one place.

Summary

TravelBuddy is a web app that allows travellers to collaboratively plan their itineraries, all in one place. TravelBuddy asks users to input details about their trip, and provides relevant itinerary ideas that match with the group’s inputs.

With TravelBuddy, travellers can vote on activities that they’d like to add to the itinerary, giving the group an easy, informative and gamified method to trip planning. 

Problem Background 

Trip planning contains several moving pieces: booking flights, finding accommodations, choosing itineraries, managing budgets, and more. In 2015, Expedia explained that customers visit an average of 38 sites on average before booking - and this is just for flights and accommodations - imagine activities! Additionally, 52% of Americans highlighted that they prioritize the time they devote to travel research over all the other factors in the booking process. 

Travel is complicated to book, and consumers have so many choices. 

Travel apps do exist, like Travefy and Splitwise, however they are targeted toward travel professionals, or other pain points such as splitting expenses. There are no platforms that assist with consolidated and collaborative itinerary planning. 

Problem Statement

Research Highlights 

The endless websites and constant research create emotional pain points for users, as they may spend hours building the perfect itinerary, creating feelings of stress and anxiety, and reducing the pleasure associated with planning a trip. In fact, 64% of survey respondents agreed that they dread the travel planning process, and “virtually-exploring” the destination prior to visiting. 

Take a look at some user insights that further highlighted some pain points:
- “I really don’t enjoy researching about the places to visit”
- “I don’t enjoy when we can’t decide and have different opinions”
- I hate how long the research takes, there’s no single place to find everything, you have to use multiple sources (TikTok, Google, Eater, etc)

On the other hand, these are some user insights that showcase what made their previous trips so successful and memorable:
- “The people I was with:) planning together with friends is so much fun - I like the collaboration aspect, so you can get excited together!”
- “Proper planning for sure”
- “Planned with a group, took the stress off of one person” 

Solution Explanation 

The key driver of our solution is collaboration. We created a platform that allows users to plan their trips alongside their friends, and with the voting functionality, users can ensure that there is fairness across the board. 

All users that have not previously used the app are prompted to register using a First Name and Email address. The group admin, or user one, creates a trip on the app by entering the destination, start date, and end date. Once the trip is saved, the admin is able to invite friends to the group via an invite link. Once all TravelBuddies have joined the group, the admin can initiate the “Voting” period. Now, all TravellBuddies of the group are able to view itinerary ideas for the inputted location, and must cast 3 votes on their favourite itinerary ideas. Once all Travellers have casted their votes, all TravelBuddies can see which itinerary items were highest ranked within the group. 

Lo-Fi Wireframe 1
Lo-Fi  Wireframe 2
High Fidelity 1
High Fidelity 2
High Fidelity 3

Design Iterations  

After user testing we added some microinteractions and graphic elements to our prototype, such as swipes for onboarding screens, color identifications of bottom states and logotype so users better understand and navigate the product.

Iteration 1: Microinteractions

As some users pointed out that the interface is sometimes overwhelming, we’ve switched to the concept of clean design and decluttered the interface, softly navigating and informing users. We’ve reduced color usage, number of elements on one screen, revisited our texts in order to make the product as simple for the user as possible at this stage.

“The simplest way to achieve simplicity is through thoughtful reduction.” - John Maeda, The laws of simplicity

Iteration 2: Declutter 

We’ve reworked the concept of voting after users’ feedback and replaced it inside a trip card without adding an additional tab specifically for voting. That saved space in designs and made it more logical for users as now all information about the trip is stored in one place.

Iteration 3: Voting

Design Handoff for Developers

For better communication a design system was created with comments about certain interface elements and their values, that helped the team to stay aligned.

Handoff

Implementation Details

Travelbuddy’s frontend currently sits in one of netlify’s awesome servers. Deploying on netlify is a breeze, most people who have used the solution would share a similar experience. 

Travelbuddy’s backend was built on using Nestjs and Postgresql for the database service. We chose this stack considering scalability,efficiency and control over data types.

The backend service was hosted using Digital Ocean, which allows the frontend developers and users to connect to the backend and access the different features of the application.

We chose a web app considering its relative ease of access, and the individuality of our engineering team. NextJS & typescript was an easy choice as our frontend UI library due to its performance and type safety. The user interface architecture is centered around reusability (components that are used in multiple screens are composed to smaller units) and extensibility (components are flexible enough to allow extending new properties & attributes).

The hardest part of development has to be staying up late for meetings to align product and development, also time spent writing code and debugging.

Our application is hosted on-cloud, so we do not foresee major scaling issues

Future Steps 

With our user testing and research, we were able to identify future features to be added. Some examples are: 

  • Adding a feature that allows accurate geographical distance between each user and the trip location
  • Adding a feature that allows for the itinerary items to be displayed in a calendar function, completing the end-to-end planning process
  • Minor customizations to each trip such as adding a group name, a variable number of votes per traveller, and more. 

We also spoke with many users about expanding beyond the travel planning process, and into the travel inspiration space. With this, we would dive further into inspiring beginner travellers to get out there, and explore the world! Potential features could look like: 

  • Create a “favourites” tab of itinerary ideas that users find interesting. This would inspire users to book a new trip, and they could refer to this list when building future itineraries 
  • A community feature, where users can view trips that other travellers have completed. After completing a trip, travellers can add reviews about what they liked, what stood out, and choose to make it publicly available. This would inspire and inform others, when planning a trip for the same destination! 

Learnings

Product Manager Learnings:

Sanaa Kahloan

Building a 0 to 1 Product taught me a lot about the grit and consistency required to be a successful PM. 

  • Prioritize ruthlessly, scope flexibly: Especially when building from 0 to 1, it is crucial to understand that you will not accomplish all the features you’ve brainstormed, and that’s okay. Your MVP will change, and grow into the Product you’ve envisioned, however you must be realistic with yourself in regards to your team’s skill level and time constraints. That’s what iterations are for! 
  • Communicate early and often: I’ve learned the importance of consistent communication. Facilitating the right communication practices (stand-ups, retro’s, etc.) heightens the entire team’s learning experience and progress. 
  • Invest time in understanding the problem space: User research should never end, and it is up to the PM to ensure you are creating a solution to a problem that actually needs solving. It’s easy to get excited about building something, but you must share your ideas with potential customers, do the research on what people need, and ensure your solution is fulfilling that gap. 

Designer Learnings:

Mariia Kraisman

My key learning was about understanding how the collaboration between designer and developers work. That has taught me a lot. 

  • How to structure Figma file so that you can find an object you are asked about easily
  • A simple design system is a must even in a small project or MVP as it help to handoff designs faster
  • Build proper connections between screen so that it would be crystal clear for everyone

And the most pleasant part - in this team I finally felt as a designer, my opinion was important and taken into consideration. That is an amazing feeling that I am going to take with me from Co.Lab experience.

Developer Learnings:

Ayodeji Akinborewa

Being involved in building the product from 0 was a unique experience. In my time in Co.Lab, I learned:

  • Setting up a scalable frontend architecture and tooling to help collaborative development. 
  • How to communicate with people from different backgrounds, experiences, and within different timezones.
  • Overall, coming together to build something has been a wonderful experience, and I am very thankful for it. 

Developers Learnings:

Chukwuemeka Nkwo

&

My time in Co. Lab and working with my team-mates taught me a lot like

  • I learnt how to collaborate and work with team-mates in different timezones and this has been an experience i had always wanted
  • Give me deeper understanding of the backend architecture 

Full Team Learning

As a team, we learned the importance of effective asynchronous communication. Given that our team comes from different areas of the world and time zones, strong communication is a must when engaging in frequent sprints and a short deadline. This means ensuring all team members are engaged in having a clear understanding of the product idea and priorities, and feel empowered to ask questions and raise issues as early as possible.