About the project
Codegen, along with their, large range of TravelBox product line, were focused on providing travel exploring and planning capability through their TravelBox™ SURF B2C platform. Along with the web application, there was this need to build a mobile app also. So this marks the application design solution.
Starting with discussions
To begin, several brainstorming sessions were conducted, primarily involving product owners & stakeholders. Given the simultaneous designing of a web portal, it was essential to establish clear distinctions of few things. So with the Classic Brainstorm approach I focused on
How different it is from the web portal & determining the key areas requiring emphasis in the mobile app.
What is the impact to the business
Requirement for an app to function as a simplified version of the web portal which can access on the go, focusing primarily on enhancing discovery and planning features.
Impact to the business,
Defining the problem & my assignment
With all the points after discussions, I just stated the problem that we need to solve from the design.
Lack of the necessary flexibility and freedom in planning and scheduling and absence of resources (tickets access, maps etc) results in travellers feeling stranded and frustrated during their journey planning process.
As the result of all these discussions and findings, I just marked down what I should complete as the UX designer.
I was given the responsibility to design a new application enabling users to explore, plan, and book their travel itineraries directly within the app.
Conducting stakeholders workshops
The next step was, conducting Stakeholder workshops to gather insights. This choice was driven by our tight schedule, which didn't allow for extensive user interviews with a large number of users. I chose 2 approaches,
I conducted cross functional workshops to capture diverse perspectives on user needs and challenges, and to gather informations from the domain specific perspective I held few domain expert workshop rounds.
So the focus areas were,
Key entry points
that can guide trip planning from exploration
Primary features
that should be included in a itinerary planner
Essential resources
that should be integrated into a travel planner
In this step, we mostly used the Traditional brainstorming method, because it allows to freely share thoughts, in a wide range of ideas.
So in this approach our team members could verbally contribute, which led to quantity over quality insights.
Talking to users
Even with a tight time frame, as the next step I chose to have a quick round of user interviews for better collection of insights. So I had few user interviews covering different type of user profiles.
Based on the insights gathered from the interviews, I could re-evaluate our assumptions and reconsider the points identified in previous workshops.
Key take-aways are,
↑ Major key points, found from interviews
Refining, personas & Journey maps
While creating personas and journey maps before interviews is a common practice, my goal was to create highly detailed personas and journey maps grounded in real-world insights.
While creating personas and journey maps before interviews is a common practice, my goal was to create highly detailed personas and journey maps grounded in real-world insights.
Solo Backpacker
Group
Traveller
Family Travel Planner
Experience Seeker
Cultural Explorer, Adventure Enthusiast
Nature Lover, Travel Blogger/ Photographer
I combined the personas and journey maps to better represent the user group.
Additionally, I curated a list of features corresponding to each stage within every journey map.
Checking out competitor’s apps
Then, the next step was having a look at various travel planning apps focusing how they handle the exploration part and the planning part. I also looked for feature areas where they were lacking.
For this stage, I got the essential stakeholder: the Business Analyst involved.
Highlights: Exploration
Most of the apps provide various discovery and exploration options, but less related contents.
The apps allow users to create wish-lists or save items, but there's no direct access from the saved options.
While all the apps provide multiple recommendation features, some overwhelm users with excessive content, leading to frustration.
Highlights: Itinerary Building
Most of the apps lacked entry points to itinerary
Some apps offered, itinerary builder but they didn't have enough options or customisation options.
I checked some reviews as well.
As a follow-up task I started looking for reviews on the Appstore & Play Store for similar kinds of apps as a way of gathering more insights.
Highlights: Reviews
People are having problems with handling large itinerary
More people wanted to bring their manually searched items in to itinerary
Most of the people were fed up with unrelated recommendations
Refining the Information architecture to kickstart ideation
Based on these insights, the business analyst and I developed the information architecture and conducted brainstorming sessions with the stakeholders.
Structuring the information for the Itinerary planner was a bit challenging.
Therefore, we chose to implement crucial changes after a few design iterations of the itinerary planner rather than completing it immediately.
Paper sketching & Wire-framing
Next, I just started to ideate with pen and paper addressing every part of the user flow. I sketched flow wise designs first and then I converted them in to low fidelity wireframes.
↑ An initial paper sketch
I transformed the wireframes into a wire-flow and shared it with the team for clarification and feedback. The wire-flow helped illustrate interactions between screens and components, making it easier for the team to understand and provide more insightful feedback.
Some of the finalized designs
Explore Tab/Page - Search identified as the main component here, and organised all the recommendations and suggestions under different categories which act as entry points allowing the user to explore more.
↑ Explore tab design
↑ Main search option
Scroll through the design to see the content ↓
↑ Explore tab design
Items Listing Pages (Activities & Hotels) - As a starting point for exploration, users can view hotels, activities, and other items in this view, enabling them to search based on their preferred destination.
↑ Activities listing page
↑ Hotel listing page and map view
Scroll through the design to see the content ↓
↑ Activity Detail Page design
Add to trip from saved list or item detail page - Enabling users to add activities, places, or items to the itinerary by specifying the exact day and indicating the day's activity count simplifies the decision-making process regarding which date to add them to.
↑ Itinerary selection view
↑ Day selection view
Itinerary Planner iterations
↑ Design iterations of itinerary planner
I did few iterations to ensure it's simple, clutter-free, and flexible, catering to all user planning needs.
Restructured the information architecture for the itinerary section.
Re-evaluated which options to display immediately and which ones to reconsider for inclusion.
to minimise the Cognitive burden on the user .
Itinerary Planner - Finalised Design
Presenting essential activity details and consolidating secondary editing options under one button transformed the view into a summarized format, providing the freedom to make changes while reducing clutter.
↑ Itinerary planner view
↑ Itinerary planner scrolled view
Ticket Selection - Here's how users are presented with the ticket options within itinerary
↑ Ticket selection view
Re-Ordering - This is how users can rearrange the order of items within the days.
↑ Item re-order view
Prototyping and testing, parallelly
So in the mean time of designing , I started converting some of the flows to high fidelity prototypes in order to user test with the in-house team.
We tried the Cognitive Walkthrough method to test the selected flows needed for the optimum design. Running prototyping and testing simultaneously proved effective, especially given the project's tight timeline, allowing us to identify necessary changes promptly.
What I've learned
Importance of feature prioritisation - While it's possible to incorporate numerous features into a design solution, I learned that meticulously identifying features directly impacts the user experience.
Recognition rather than recall is very impactful to design solution- I've learnt that users expect familiar behaviours and patterns from the app based on their daily interactions with other applications and it is highly impactful to our design solution
That's a wrap. Thank you for reading!
Other stories
