Clean Tracks, Clear Journey: A UI Revamp for Seamless Train Travel
MTR Corporation operates Hong Kong’s railway network and has a significant presence in the United Kingdom, Australia, Sweden, and China. Committed to enhancing riders’ daily journeys, MTR has launched a complementary mobile app designed to provide seamless access to essential travel information. The app is packed with functionalities such as real-time train schedules, fastest exit routes, and detailed station facility information, with the hope that users will find these features beneficial in enhancing their commuting experience.
However, user interviews and data tracking revealed the app's limitations, as many users struggle to navigate its features in the information cluttered interface. Key functionalities are often buried under multiple steps, leaving many features underutilized and consequently hindering the app’s full potential. Oursky took on the revamp of the MTR mobile app, ensuring that the redesign of the user interface would align with the digital initiatives that MTR had originally envisioned.

Modular UI: A Reorganized System for Efficient Information Access
Through our partnership with MTR in the complete redesign of the app, here are some highlights of the work:
- Simplified homepage to redirect the focus on the essential features, such as next train schedules and traffic news. Original loyalty related features are relocated into a new tab for better categorization.
- Reworked the dropdown into scrollable cards to create a cleaner, more intuitive browsing experience. This dynamic approach displays essential information in a compact format, allowing users to expand cards for more details as needed, ensuring a responsive and streamlined interaction.
- Improved information accessibility to enhance user experience. The style of First/Last train entries has been updated with a larger clickable area and clearer text descriptions, offering upfront guidance for users. Traffic news incidents are now prioritized, with incident details featured on the front page, providing simple and clear descriptions for quick understanding.
- Color-coded Organization and Personalization enhance indications. Train route results are color-coded according to railway line colors, making it easier for users to distinguish between routes. Additionally, the homepage background adjusts based on the user’s nearest station for a more tailored experience.
Enhanced Commute: The Direct Result of Our UX Innovations
With the increasing digitisation of the everyday, Oursky is committed to designing digital experiences that not only look good but work seamlessly within the context of users’ lives. Our work with MTR Corporation exemplifies this commitment, as we transformed the app into a powerful tool that aligns with commuters' needs and behaviors. By enhancing functionality and creating a more intuitive experience, we’ve turned casual users into engaged ones, adding value to both their daily commutes and MTR's broader digital strategy.