Our mission has always been to revolutionise the bus industry through technological and operational innovations, and so we strive hard to bring a vision of a better bus industry into the 21st century.
Over the last 4 years, we have constantly adapted to the times and the purchasing habits of our users. With recent data collected, over 70% of our traffic in Malaysia and Singapore comes from mobile devices, hiking over 20% in the last two years. Hence, we decided to revisit the drawing board, and come up with a completely fresh outlook to our mobile website experience.
THE BEGINNING
From the get go, we envisioned a mobile website that embodied our very existence. We wanted to create a specified booking platform that was fast, interactive and more importantly, established a relationship with our mobile users.
THE PROCESS
We began by first dissecting the whole process and removed all clutter and fluff that hindered a perfect booking process.
We looked into the pains of our beloved operators and users, and figured out how we could address them. Internally, we consulted the various departments in our company, from our tech team to our customers service representatives, who are the bridge between us and our customers. We also got our families and friends into the act, having them book through our old mobile website and getting their feedback on their user experience.
Upon the information attained, we gave the mandate to our designers.
Our designers tirelessly explored many styles through various mood boards (left image), before producing the wireframes and finally the mockups (right image). The icons, colours and fonts were all given meticulous thought, ensuring that every feature aided in a smooth flow from bus bookings to ticket payments.
THE PRODUCT
Before long, it was time to gel the pieces together. The result was astounding, reflecting both elegance and perfection on a mobile screen.
-
FEATURE
On first glance, our mobile website looks clean making it easy on the eyes. As users venture deeper into our mobile website they are presented with 15 of our popular cities which proactively filtered as they typed out their destinations.
We also added an icon on the top right corner of the screen (left image) enabling the option to select their preferred currency and language, avoiding the hassle of navigating through numerous options, icons and pages to make minute changes.
The moment search results are presented (right image); our users are notified on the number of trips available at the top of their screen which recalculates as users switch dates through left and right icons available before selecting their ideal trip.
For further ease in decision making, we programmed a filter that arranged the trips according to the operators, earliest departures and cheapest trips from left to right, preventing the need for long downward scrolling (right image) previously on our old mobile website.
-
TECH INFLUENCE
Clearly, our mobile website is nothing like we imagined and all would be in vain if not for the competence and resilience of our tech team.
Upon much consideration, we decided to adapt Quasar and Vue.js as our desired frameworks to bring our mobile website to life. Vue.js represents the very core of our mobile website while Quasar brings the interactive elements through visual aspects and animations.
Combined, both frameworks allow for the single page navigation feature, where a whole booking process commences on a single page. This grants users faster loading screens and consumes less data, personifying us and what we stand for, a company with bus tickets on-the-go.
THE FUTURE
Scary enough, this is just the beginning. We have more features on the way in the months to come. Among them, Refer & Earn, one our latest app features which allows users to save on their ticket purchases, amenities for a deeper insight into each coach, safety features and more.
Stay tuned, because your bus booking experience is going to get a WHOLE lot better!
P.S. Add our mobile website to your homescreen. Watch our video and you can do it too!
CatchThatBus | Blog 
Leave a Reply