Taking the seat selection experience from regular to a dapper fit for MakeMyTrip buses
Seats alone have the potential to ruin a fine bus journey — here’s the story of how the design team at Make My Trip uncovered research insights and made the seat selection experience better, to make sure it wasn’t a spoilsport.
The last time you travelled by bus — whether alone or in a group, there are some things you might recollect starkly than others. Chances are finding your seat, settling in, and enjoying that space for the rest of the journey are some of the activities you’ll remember. Can you imagine what would have happened if the seat was not of your choice? Maybe something went wrong while travelling in a group, and all your seats got mixed up? What if everyone ended up sitting far apart because one of you made a mistake while booking? It would make an otherwise great trip, pretty horrible, no?
Chances are finding your seat, settling in, and enjoying that space for the rest of the journey are some of the activities you’ll remember. Can you imagine what would have happened if the seat was not of your choice?
It is right to say, indeed, that seats alone have the potential to ruin a perfectly fine bus journey! We, at MakeMyTrip, understand its importance to a person’s journey. Consequently, we put a lot of focus on the experience of seat selection while booking bus tickets.
Bus Industry in India
Buses are the most popular and convenient mode of transportation in India’s urban cities. More than 1.6 million buses are registered in India, and the public bus sector operates 170,000 buses. Buses in India carry roughly 70 million people per day providing last-mile connectivity to everyone. With an 85% share in passenger traffic output, buses help people travel to corners of the nation where even trains do not go.
The Set-Up
Simply put, the steps to describe the bus booking flow on MakeMyTrip platform are -
Search — where a user specifies their trip criteria. They land onto the Search Results where we display the available buses and their details. They pick a bus to get to the Seat Map where they view the details of the bus and select their seats. A user, then, adds their Traveller Details to complete the booking. They review the details, make the payment and the booking is done!
In June 2019, the seatmap had a tab-view for a double berth bus (pictured above). The data suggested that the seat map had the lowest conversion rates out of all the steps a user had to perform; this meant most of our users were leaving their bookings mid-way when they were at the seatmap.
There was a time when users went to book a bus on MakeMyTrip and they got lost within selection and reviewing of the seats for their trip.
Dropping off could be attributed to various reasons which involve talking to a group of people about available seats, going back to explore another bus, or just deciding to come back at a later point to book. However, not everything could be out of our control. Some drop-offs had to be because of the experience they were getting.
Our hypothesis was that users were getting confused because of the seat view they get. We also hypothesized that users were finding it difficult to review the selected seats because of the low visibility of seats together.
Our formulated hypothesis strengthened when the research team conducted a usability test for the bus booking flow. The findings not only supported the hypothesis but added insights that we might have missed to accommodate otherwise.
Finding Solutions
The idea was to bring the experience of imagining your seats to the user. In the process, we wanted to manifest the idea of a bus onto the screen as real as possible. This meant realising an abstract concept of a seat layout as it is inside a bus. To achieve a balance of elements, we iterated over several distinct approaches for the visual layout of seatmap.
We wanted to ensure that the approach we took (far right above) was scalable. Buses come in all shapes and seat arrangements and we had to make sure the design could accommodate them, without compromising the system designs guidelines around the touch target area and interaction. It meant finding as many distinct combinations, of seater and sleepers, as we could and see if it works!
Buses come in all shapes and seat arrangements and we had to make sure the design could accommodate them, without compromising the system designs guidelines around the touch target area and interaction.
Problems Solved
1. The Progress Bar
Our starting point for the progress bar on screen was that it took up crucial real estate and a visual lift will help us save that. Furthermore, research pointed out that users hardly notice the progress bar on seatmap, and focus more on the seat selection. This prompted us to rethink whether the component was important or not. Ultimately, we went back to the designs and discarded the progress bar completely.
2. The tab-view to side-by-side
One of the drastic moves in the process of this revamp was from a tab-view for berths to a side-by-side view. Our research pointed out that users spent considerable time going back and forth between the tabs to select their seats. Frequently, they even selected seats in other berth and forgot about them. Thus, we wanted to bring the bus to a single view to help the user to see chunks of available seats and select in a single go.
3. Visual Appearance of the Seat Map
To bring the elements of the bus into the design, we played around with iconography, bus outlines, and imagery. The seater and sleeper icons were changed to showcase a seat and a sleeper respectively. We also rethought our colour palette for the layouts. Earlier seatmap legend was upfront. Since it was information that users learnt once and didn’t always need for a recall, the seatmap legend was changed to on-demand info.
To achieve the realization of a bus onto the screen, we took a step further by adding the outline of a bus and its headlights, besides the existing steering wheel we had. This helped us encapsulate an existing abstract seat layout into a form of how people imagine a bus.
4. Inability to Filter via price
Price difference amongst seats is common in buses owing to past patterns like seat preferences, or seat type (like seater and sleepers within the same bus). Earlier the capability to filter via price was not present. In its absence, users often saw an increase in price from choosing a bus on search results, to selecting a seat. This led to disappointment with the users and seldom, we also got to see sharp opinions about fluctuating prices from users who felt cheated with such an experience. Thus we added a price filter if more than one value was available on a bus.
Closing the loop and way forward
No design works till it shows that it does, and this one went live as an A/B test in November 2019. It performed well by 2% and was ultimately taken at 100% uptake in December 2019.
The paradigm shift with new designs worked well for the booking flow. In a qualitative usability test, we found that users were now able to select a group of seats more efficiently and proceed ahead. Soon after, the design transformation happened within Goibibo too as they changed to a similar view for seat layouts.
Nevertheless, no design is perfect and soon after release, we started to notice our misses. The conversion spiked initially, marking a 12% increase by Jan’19 compared to Oct’19. Eventually, it steadied showing an increase in conversion by a few points. We investigated further component-wise to understand how we could improve the status quo. The price filters, for instance, initially showed no traction with very low click-throughs. We went back to the whiteboard to whip out some ideas. Consequently, we brought clarity and prominence by clearly communicating the price filter and individual seat prices. The usage has risen from an average of 1.23% in December ’19 to 6.27% in April ’19 (month of v2 launch). Today, the usage of price filters stands at 13.65% of visits (Aug ’20)
We attempt to understand our users more with every little discussion, experiment and launches. The aim is to achieve nirvana — where users will trust and come to MakeMyTrip to book a bus.
While we work on improving more experiences, why don’t you head over to MakeMyTrip app, see how it works today, and book a bus for a staycation near you in this work-from-home situation? Hope to see you soon there!
The Team
This outcome would not have been possible without the team who took the risk, of shifting the norm, together — Design team (Baisampayan, Nitesh, Aakash, Jaydeep and everyone who was bugged for feedback), UX Research team (Yatin, Smriti, Vidushi, Rupesh), Product (Raj, Jaideep), and Engineering (Rajesh, Avinash)
