UI/UX case study: Trip planning app

Shreyas hc
9 min readOct 8, 2021

--

Travel based Trip planning application

INTRODUCTION

I love Travelling! I mean who doesn't?

Travel makes everybody a more awesome person. I believe that travel is something that makes you not only a better human being but a way cooler one too. What if say you that there is a mobile application where u could plan your trip and meet new people around as well? Well yes, Trips at Tips is a travel application where u can plan your trip with ease and efficient manner with its user-friendly UI. You can also calculate the overall cost per person while planning the trip!!! How cool?

THE PROBLEM

People Nowadays are not being able to plan their trips in an appropriate way with a proper timeline and the people who travel most also face problems in finding nearby local places and accommodation also they are not being socialized enough. In addition to that, they are also finding it difficult in calculating an average cost per person while planning the trip.

GOAL

To Create an application for people to plan their own trip with a perfect timeline, to follow friends, plan trips together and get to know about their trip plan and experience. and also to include a cost estimator where users will be able to plan trips effectively with minimum cost. The users should be able to navigate to places using a better route, moreover, they should be given the chance to add custom places to the map.

RESEARCH

Getting an idea of why people are finding it difficult to plan trips and what kind of issues they face.

Focus areas

  1. Why do people want to plan trips?

2. Why do they need a mobile application to plan a trip?

3. What do people look for when they plan a trip?

4. What has helped people succeed in planning trips and what has interfered with success?

5. Understanding how they used to plan the trips

Market Research

I conducted some quantitative research and here are the findings-

· 23–30y old travel most

· 96% of the travel independently

· 74% of travelers say they will spend more time choosing a destination this year in 2021

· 66% of travelers say they will spend more time reading reviews about destinations in 2021

· 72% of travelers say they will spend more time selecting their accommodations

· 70% of travelers say they will spend more time finding things to do at their travel destination in 2021

· 67% of high-income travelers said they would rather spend their vacation money on activities than a nicer hotel room

· 90% of them use mobile phones to plan a trip

How do people typically use their mobile phones to find inspiration or ideas on where to travel?

source: statista.com

Interview findings and pain points

I started my user research by conducting user interviews with 10 users, which vary from actively traveling users to infrequent users of any travel-based apps to understand what motivates or demotivates them from planning trips from the mobile applications. I conducted some telephonic interviews while some I ran in person.

Competitor Analysis

To gain more knowledge regarding the current market I listed some competitors and studied them in detail.

User Reviews

I started looking for reviews on the Play Store for similar kinds of apps. There were many apps but most of them didn’t have many downloads (10K+) and selected few apps which have similar goals, so I only found a few relevant reviews, I even went through some reviews of the competing new apps (with 1M+ downloads) to know their best features, attracting and retaining their users, and even the ones they missed out.

After going through reviews I found that-

  1. Most of the users weren’t satisfied with the experience of the app.
  2. Not being able to plan trips in an appropriate way.
  3. Can’t find nearby local places and restrooms while traveling to new locations.
  4. Cost estimation for traveling to a particular place isn’t mentioned.

User personas

Personas help to see things from the perspective of users. On the basis of primary and secondary research that I've done earlier, I created 2 personas that would help guide design decisions, priorities and increase empathy throughout the case study.

Pain points

  1. Facing difficulty in finding nearby accommodations like hotels and resorts and even local salons, cobblers, public washrooms, etc.
  2. It’s hard finding out whether it’s the right time and right season to travel to that destination.
  3. People want suggestions in case they ran out of ideas while planning a trip.
  4. Participants also want to know the cost of traveling while planning the trip.
  5. They also need a user-friendly UI to add their custom places to the map and mainly people want to know what other people are up to.
  6. Users also wish to have their own Timeline of the Trip.

Finalizing Features

Based on the pain points I've listed I decided to select and sort all the features for the application. Below listed are the final features of the app.

Final features

Information Architechture

Created an information architecture to get a better understanding of how each feature will help and also to get an organized view of the app. It also helped us in creating user flow and wireframe.

information Architecture

Creating user flows

keeping in mind the existing pain points and making an appropriate user flow with eliminating as many pain points as possible.

User Flow

Wireframes

Wireframes are considered as the skeletal view of a product. After making observations of some references and competitor apps, I sketched out some layouts and started designing low-fidelity screens (wireframes). The wireframes helped me to focus on key functions, elements, and actions before proceeding to the high-fidelity (hi-fi) designs.

wireframes of main screens

Logo, Color and Typography

For the logo, I kept it simple and clean. I used 2 color gradients as shown in the pic below and used Poppins font as it looks kind of round and Elegant and it also suits inside the circle.

logo design process

Final design

After completing all the wireframes I started with the visual design. the biggest challenge here is to make the app user-friendly, clean, and simple to use.

the final design of some main screens

Sign up / Sign in

Below pics shows the splash screen and welcome screen where users can log in or create a new account to sign in to the app and explore. Users need to have an account in order to explore the app and also they can sign in through google Facebook and Twitter for easy and faster login.

splash and welcome screen

Bottom Navigation screens

So basically the main features in the app are home, maps, explore and chat that's why I decided to keep those icons in the bottom navigation, and the plus button which is the highlight of the bottom navigation is the trip planning Screen.

After signing in, the users are directed to the home screen where they will have to enable location or choose their location manually in the upright corner of the home screen. the home screen basically shows all the places nearby. The maps section directs users to a map screen where users will be able to search any destinations and view routes. Explore screen shows the plans made by other users, interested users can send join request to them and also people can post their own trip plan in explore page in addition to that it also shows stories uploaded by friends nearby to get to know where they are traveling to and nearby local spots.

Bottom navigation screens

Home

Home Screen shows all the nearby places around the user, they can also search a place and can use filter option too and also they are able to share the places with their friends. the below screen shows the places screen when users tap on any location they are able to view some information regarding the place and they can also view the route and add the place directly to their current trip. moreover, it shows the people who have been to that places and also nearby places.

Planning Trip

The trip planning screen was the main focus and was a bit challenging too. as users tap on make new trip button which is in the middle of the bottom nav, they are directed to the new screen where they can start planning their own trip.

The process of Trip planning are as follows:

  1. Firstly, Select the number of days.
  2. Select From and To location initially, adding intermediate destinations is an option.
  3. Based on the number of days the users selected, a blank timeline is created where users can add places, restaurants, and hotels.
  4. Users can view and edit the timeline whenever they wish to.
  5. After completing the Timeline, they can even calculate the average cost per person on the trip. It is calculated on the basis of the places they visit, restaurants they go to eat and hotels they wish to accommodate. it's the average cost estimation to roughly calculate the price of the whole trip.
planning a trip

Navigations and Map

Users can locate their position on the map and also search for any locations and view the route via bus car and bike from the current location. they can even favorite a place and also share it with friends.

Unique Features

Users can draw on the map to highlight all the spots like restaurants, hotels, public toilets, gas stations, and much more as shown on the third screen in the above picture.

Adding an undiscovered place to the map is one of the feature which most of the users wish to have in their app. with a simple UI users now can add any places to the map including photos of the location.

Making new friends and planning trips with random people can also be considered an interesting feature of this application.

  1. Search: Users can search any place, people and also can use the filter to segregate the search results.
  2. Invites: People can send friend requests to each other and make friends. All the invites to the plans made by users can be accepted or rejected here on this screen.
  3. Profile: In the profile screen, users can view all their previous Trip plans and current trip plan, in the other section they can view all the places they visit.
  4. Chat: In the chat section users will be able to chat with their friends and even make groups. they can share their trip plan with other users and also call and use attachments.

Conclusion

While working on this case study, came across several micro-challenges, which made the whole project even more interesting. I learned how to resolve those challenges without compromising on the primary design solution.

Researched several times to dig deeper into the things which needed improvements and also worked on a number of iterations.

That’s a wrap. for now! Let me know what you think in the comment section below. If you have any feedback or want to chat with me, drop me a message at shreyashc777@gmail.com or connect on LinkedIn.

If you enjoyed reading, claps would be appreciated.

THANK YOU!

--

--