Group trips more organized. More organization means more fun!
Project Type: Concept
Brand & Identity
Low Fidelity Wireframes
Mid Fidelity Wireframes
High Fidelity Mockup
Going on vacation is fun for almost everyone. Planning the vacation however can be nightmare, especially when planning for a group of people. Differing personalities, interests, and many others can turn a group vacation from relaxing to stressful. Keeping communication amongst a group a people can be difficult as well.
How might we make group vacation planning easier for people?
Most other organizational applications for group travel are geared toward travel professionals such as travel agents. With group vacation becoming more popular, we saw a need to create an organizational application for the average person who likes to travel with others.
Trip’d is an application that allows users to create itineraries, add flight information and alerts as well as message others for each trip. Travel planners can create private groups travelers have access to create a unique experience.
Planning a vacation for a group of people can be challenging especially organizing and keeping up with communication. There aren’t a lot of applications that cater toward the average user who may be planning a trip with family or friends that allow them to keep their travel planning organized and everyone in the loop.
Trip’d focuses on the average person looking to keep their travel planning organized so that everyone had access to the same information. No longer will emails, phone calls and text messages be lost for upcoming trips with friends and family. This application is simple, create the trip you want to plan, invite your friends, plan the itinerary and go. You can even look up flight information and message travelers on the go.
Research and Discovery
Upon post qualitative analysis of the survey, I discovered that there is a desire for a group travel app, but user’s want one that’s organization and itinerary heavy. Potential users do not want a travel app that is feature heavy, but expressed a desire to connect and communicate with each other before and during the trip.
Tripit is an app that allows users to organize their travel plans no matter where they book. Travelers can simply forward their flight, accommodation and other trip related confirmation emails and Tripit will create a master itinerary for you.
Users can share their itinerary but not share access to a group and no communication features are available at this time.
Travefy is an app that helps users create itineraries for groups and allows for communication with travelers. Planners can configure their own travel plans to share with a click of a button.
The app is geared toward professional travel agents and requires a paid subscription.
Mobili is an app for group travelers that allows users to create a travel group. With this app, users can compare and view others travel details potentially making it easier to coordinate in a group.
Many users commented that the app prone to stop working randomly.
Utilizing the information and trends I saw with my results from the user survey, I curated a list of 11 user stories, then prioritized the most essential ones that address the problem and users’ needs (e.g. creating a trip itinerary to better organize travel plans, communicating with other travelers etc.). By dividing by priority, I was able to focus and hone in on the Minimum Viable Product requirements and separate the features that would be nice to have in future iterations.
In order to keep the users’ needs in mind, it’s important to humanize the research thus far. Three distinct personas were created to reflect the data we collected this far as broadly and accurately as possible.
My user flows integrated high priority user stories and show how a user would accomplish each of the tasks imperative for testing the general functionality of the app. I made sure to keep the flow simplistic within the constraints the problem at hand and user needs from data we collected. Below are two examples of user flows I created for this project. Feel free to click the button below to see all the user flows for this project.
Wireframes and Sketches
So now that we know how the app should work, what should it look like? Before we dive into this, here is where I learned a big lesson on shortcuts and finding your individual design processes.
And that's where things went left...
Can you spot which wireframe was created first?
If you guess the sketches you are incorrect. Everyone has their own process when designing. Some people sketch with pen and paper and others use digital software instead. Because of the time constraints on this project, I decided to use Balsamiq for rough wire framing rather than pen and paper sketching first.
Results: Scope Creep & Loss of Focus
As you can see in Balsamiq rough wireframe, I got off track and went beyond what was needed as the dashboard for a trip location. Instead of a creating a basic layout, I spent too much time on details. I went back to look at my data, started from scratch and sketched with pen and paper. This allowed me to focus on the basic visual structure rather than loads of text not needed at this point.
It wasn’t all bad…
Using Balsamiq first, wasn’t an entire waste however, I still used some of those elements that along with my sketches to create mid fidelity wireframes.
Branding & Visual Design
While crafting user flows, I thought of possible brand names and settled on Trip’d. Group trips are fun, yet complicated and a little messy and I wanted to show how organization can be your friend when planning a trip with others. I went through quite a few iterations of a logo, but none of them seemed quite right. I wanted something that was simple, to the point and showcased what the app is about, so I chose to use the brand name only. Settling on using the brand name rather than a symbol for a logo, allowed me to show my targeted audience what the app is about, without any confusion.
I chose blue tones for the majority of the app because I wanted to convey a sense of calmness, stability and reliability. As I said before, traveling can be hectic, plus highly dependent on information, so I wanted the color scheme to be unobtrusive and distracting. The shades of grey for text, menus and buttons give a sense of balance and readability. Bright colors such as green and red are used to be notified (trip payment, new messages) or give notification (tell car service of arrival, checking into a hotel).
Because this app has the potential to be used by a large breadth of users, I wanted to keep the type simple and easy to read. Also since the first iteration of the design used IOS design elements, I used SF Pro Display for all of the text in the application. The logo, technically the name of the brand, I used Poppins because of the geometric aspect and balance it shows.
High Fidelity Mockup
Now let’s see what this looks like with some color! I took my branding guide, applied it to my wireframes to create the first iteration of Trip’d. I tested a mobile prototype for feedback. Overall, users enjoyed the look and feel of the app.
Prototyping & Testing
I used Maze to test three main tasks: creating a trip, booking a flight and sending a message. I was able to secure 4 testers for these tasks and facilitated this testing remotely using Maze and Zoom because of COVID-19. Maze allowed me to work around the tester’s schedules and allow them to complete the tasks on their own time. Using Maze also allowed me to easily separate tasks and ask relevant questions for each of them.
Each of the participants were asked to complete a few tasks which were creating a trip, booking a flight, responding to a message and navigating back to the itinerary dashboard. Out of those 4 tasks, 1 was rated as easiest to complete and had a completion rate of 6.5 seconds. While the other 3 tasks took participants a lot longer and were commented to be much more difficult to complete. Those 3 were: Booking a flight; Navigating back to your itinerary dashboard; Creating a trip.
As you can see, most of the clicks were in the middle of the area, not the chevron off to the right. This leads to the assumption that the user may think the entire area is clickable rather than just the chevron icon.
These findings along with others, led to the latest iteration of Trip’d.
Designing for a large yet niche subset was a bit tricky. It’s easy to get caught up in focusing on cool features and losing focus on user needs. In hindsight, designing for group traveling made sense because it is a sub-sect that isn’t thought about very closely unless it’s dealing with a travel agent. Very little attention is paid to those groups who are a family planning a trip on their own or a group of friends planning a vacation. Not everyone uses a travel agent for these kinds of trips.
What I would change…
There is plenty of room for improvement and expansion to include other user stories and important elements to this project. If I had more time, I would focus a little more on usability testing to see what the limits are for user’s going through a step by step process. I’d also add alerts and entry and exit information so that travelers can be aware of important information that they need to know such as a flight getting cancelled or having to have a particular vaccine to enter a different country. As it stands now, Trip’d accomplished it’s goal of helping group travelers and planners get organized and connected with each other offering a simple, reliable way creating adventurous memories for the future.
What I learned…
While working on this project, I learned more about my design process. From making the mistake of creating digital wireframes first before sketching on pen and paper to seeing the feedback from usability testing, I now know how easily it is to lose focus on project but learned how to get it back on track for a successful product. As I continue to learn more and grow in design, there are going to be bumps along the road, the most important part to gather what you can learn from it and how to overcome it.