Project Role
UX and Product Designer
Date Completed
June 2019
Skills Used
Design Thinking, Product Design, Visual Design
As anyone who's ever traveled in groups with friends knows, it's difficult to stay on top of all the details and logistics. This app is an exploration in how to improve the planning and coordination process.
After recently going on a group trip myself, I wanted to see if other people experienced similar types of issues when planning and going on trips. I asked participants a set of questions based around their recent group trip experiences.
While the specifics of responses varied from individual to individual, there were some shared complaints:
People enjoyed actually going on trips with their friends, but there turned out to be multiple negative sentiments before the trip actually occurred. One thing that stood out was that decisions were often made by the loudest voice, and it was difficult to ensure everyone enjoyed every activity. When someone didn't agree with an activity or suggested something other weren't as interested in, it felt awkward and inconvenient to go against the group.
To keep track of activities proposed, people used spreadsheets and text editing apps. For the most part, this was done on a mobile device, but sometimes would happen on larger devices as well. Communication and activity discussion seemed to happen solely on mobile devices, with common chat applications people already use to communicate friends.
A recurring theme I noticed is that the asynchronous nature of group chats made people feel excluded from the decision making process if they weren't actively participating. This was coupled with need to scroll upwards through numerous message to catch up after which the conversation once again changed gears.
In my conversations, I noticed a distinction between people during trip planning. On one end of the spectrum, there are people who are very invested in being organized and pushing to ensure details are finalized and agreed upon. I named this group of people, "Planners." As their name suggests, their goals are to create structure and organization during the planning phase.
On the other hand, there are "Tag-alongs" who are more along for the ride and contribute input when deciding the details. Their goals include expressing their desires and feeling like they're heard.
Of course, people don't always fit neatly into one category, and often exhibit behaviors of both from trip to trip depending on their level of investment.
Although the chart is a simplified view of an overall trip experience, the data I gathered suggested that one of the key areas to improve a trip's experience was during the planning phase. I believe that instead of the large dip that comes from coordination can be addressed by targeting three areas to improve.
Paired with data about the types of planners and tools, I made some additional assumptions to guide my work.
Because there are so many applications and tools out there that help plan for other aspects of a trip, the scope of my solution focuses on keeping track of discussions, managing the itinerary, and deciding on places to go. These features address the core problems mentioned by those I interviewed, as well as fulfill the outcomes of the Planners and Tag-alongs.
Based on the data gathered, mobile devices were overwhelmingly used during the planning process. Many of these individuals already use apps like Airbnb and group chats, so creating a mobile application provides a seamless user experience where they don't need to switching between devices. Furthermore, when on a vacation and on the go, it's easier to reference a mobile device rather than a laptop or other larger device.
For a feature walkthrough, I'll be showcasing a group planning a trip to Canada with two cities in mind.
This application employs a swiping and header navigation style. Some trip goers may be planning multiple trips at once, and a tab bar navigation is an app-wide navigation scheme that would interfere with each trip's siloed nature. Because of the navigation style, each page has its title prominently in the header so the user knows where they are.
Common icons like "edit", "like", and "search" are presented without labels as they're common icons that are familar and have little room for interpretation. However, something like "Map View" is an icon accompanied with text. The icon, while recognizable, isn't commonly used. With assistance from the text and color, both its meaning and its importance becomes clear to a user.
The home screen offers entry into the main features of the application as well as contains major details about the trip. These details help establish context for all people on this trip. Itinerary and discussions are located at the top of the features because they are essential to the planning aspect, and would otherwise be lost under a large trip with multiple cities. The Places tiles draw users in due to their immense size and picture backgrounds. They excite everyone going on the trip so they feel interested in contributing and exploring.
I ultimately decided to use Places as a a concrete way of helping people decide where to go. Places are not limited to a specific activity, but meant to facilitate the activity selection process. Many of the things people do include visiting a location and exploring its surroundings. Anyone can propose a Place, and everyone else can vote to show support on said Place. Places are assigned to a city to keep them organized, but can also be viewed all at once.
Within each city, there are broad categories that suit a variety of interests, as well as offer the ability to search by name to avoid having to scroll through possibly hundreds of locations to find one they want. One of the key categories for travelers was "unique" things to see or do at their destinations, so it's included below as the first.
On the Browse screen (middle), each Place card offers a photo, the name, a summary, and the ability to add directly to their shared list of Places. Because the Places is the wide end of the funnel, I wanted to make it easy to add a Place based on its limited information and initial impressions. When narrowing what to do on the Places landing screen (left), large cards lead to limited screen real estate. To see all the proposals would require a lot of scrolling, leading to a high chance of abandonment and not weighing all the possible options. This led to the decision to cut out the image. Tapping on each card leads to the details screen (right) which provides more context about a location.
Every individual gets an opportunity to "like" a Place. This creates a democratic process where one person can't overpower the group because they are a louder voice. The likes help determine the group's approval of a location to go, and ensures that both Planners and Tag-alongs get a say on what's done on the trip. To assist with scheduling the destinations later on, I included a "Sort by most likes" switch that helps the group prioritize based on popularity.
The "like" action is listed on every card in the Places landing screen. By having the like action easily accessible, trip goers can save time if they've already done their own research, or don't want to tap into every single Place to "like" it.
I decided to only include "like" because disliking someone else's proposed Place can introduce discord into a group. While I did consider alternatives to express approval and willingness like "upvoting", platforms that allow "upvoting" often include "downvoting" as well, whereas "liking" is solid as a stand-alone concept.
The itinerary screen offers an organized schedule to help plan the order of activities. While this primarily targets the needs of Planners, Tag-alongs also benefit from having a day-to-day itinerary. I chose the list view as it presents a clear order to the activities. The features of the itinerary offer a balance between and spontaneity during a trip.
Start times can be specified for Planners who like to plan to the smallest detail, but they can also be left blank to allow flexibility for groups to move between activities as they're naturally completed. To indicate the optionality of adding times, they are in a dark gray color and off to the side signaling that they're detail and not the main focus of the page.
Groups can insert Added Places that have been voted on, or custom items. These custom items could be leaving notes for everyone to see or vague activities like "Wander around downtown" that aren't necessarily defined by a place.
I chose to use a card format in this list as the naturally create separation between different activities. In addition, during edit mode, they lend a 3-D effect that shows their movable and removable nature.
A core feature of the itinerary is the ability to view it in a map form. If the calendar itinerary captures the what and when, the map feature acts as a sanity check. This feature helps groups visualize the distance between activities and plan how to get places accordingly, and ensure that the order of activities makes sense.
Pins on the map are labeled with numbers showing the order they currently are on the day of the calendar itinerary and are tied to the cards below. I decided to use swiping at the bottom because I wanted to map to be the central focus on this page. In addition, a person's thumb is naturally near the bottom of the screen, allowing for a quick and easy action. The width of each card is intentionally shorter than the width of the bottom of the screen to hint at the ability to swipe between them.
The discussions page is similar to an online forum where threads discuss a certain topic. Threads can be on a trip or city basis. Discussions offer a way to separate conversation topics and make sure there is focus on one thing at a time.
Discussions are meant to capture the multiple conversations that take place in a group chat into their own separate threads. Conversations in group chats can jump from where you're staying, to what you're doing, to inside jokes within the span of a few messages. While this is natural and immersive if you're actively participating in the aforementioned conversation, it's unlikely that everyone will be able to simultaneously participate. Those that join later have to comb through messages to find the trip planning details the others have already discussed.
Discussion can be marked as closed once they've served their purpose. This allows discussions with details that haven't reached consensus to be prioritized at the top while simultaneously archiving the details in case they need to be referenced again.
Another feature of discussions is adding polls. When making choices, like where to stay, poll results provide a simple visual that summarizes the discussion below. Each option has the profile pictures of those that voted for the option, in order to give a representation of how many people have voted in the poll overall.
Ultimately, discussions create organization by separating out topics and transitions that might occur unchecked in a group chat. They are geared providing relief for people who may not be able to respond to a group chat at all times and allow them to catch up with the conversation on their own time.
While the current solution satisfies the needs of this specific group, in order to expand the audience, I would probably have to include more features that fulfill other parts of the trip planning process. What exactly these features are would require more research with other target user groups.
One thing I enjoyed about this project was using a new framework that structured my design thinking. Although I've always been focused on creating the best possible experience for people, in this case I drew the ecosystem, and continually questioned each feature to make sure that it satisfies the needs of the users. I will continue to use this framework in my future personal and professional work.