Baggage Notification Service in
My HKG app

UX design | UI design

MyTAG Pro is a new launch smart baggage tag. It allows user to track their baggage and receive notifications of estimated pick-up times, via the My HKG mobile App.

As their UX/UI designer, I work closely with project manager and the developers, focus on enhancing the user experience of the entire work flow.

Hong Kong International Airport

Client

UX design | UI design | Prototype | UAT

My role

Native mobile application

Platform

Jun 2021 - Present

Timeframe

My role

When I first join this project in May 2021, it was at the stage that our team have to review and comment the screen flow before starting development. Afterwards, I become the sole designer that contribute to this project. As the UX UI designer, I

Review all user flow and develop prototypes

Present and explain user flow to management; hands-off to developers

Conduct UAT

Challenge

Our goal is to provide a seamless baggage tracking experience for users, covering everything from unboxing to pairing MyTAG Pro with the My HKG mobile app.

User pain point

Travellers often carry valuable luggage and want to stay informed about their baggage status to avoid frustration. MyTAG Pro solves this problem by allowing customers to easily track their baggage in 20 airports, providing peace of mind.

Innovative Design and Technology Integration

We have integrated sigfox technology into MyTAG Pro, seamlessly integrating it into the MyHKG app. This integration enhances the travel experience by offering users an easy-to-use baggage tracking service.

Simplifying User flow

We are streamlining the process, minimizing steps, and ensuring an intuitive experience for seamless access to core functions.

Addressing Privacy and Security

We understand the importance of privacy and security. Therefore, we have implemented robust measures to protect users' personal information and handle their data responsibly.

Design hypothesis

1. Intuitive and User-Friendly Interface:

Ensure that the design of the MyTAG Pro and My HKG mobile app is intuitive and user-friendly. Use clear visuals, intuitive navigation, and logical information hierarchy to guide users through the tracking process effortlessly. Minimize the learning curve and make it easy for users to understand and interact with the tracking features.

2. Consistent and Clear Communication:

Establish a consistent and clear communication system between MyTAG Pro, the mobile app, and the user. Provide real-time updates on baggage status, including notifications for arrival, location changes, and delivery. Use concise and easily understandable language to inform users about their baggage's whereabouts and any relevant actions they need to take.

3. Seamless Integration and Device Pairing:

Ensure a seamless integration between MyTAG Pro and the My HKG mobile app. Simplify the device pairing process, making it straightforward and effortless for users to connect their MyTAG Pro to the app. Provide clear instructions and visual cues to guide users through the pairing process, minimizing any potential friction and frustration.

Design process

The design process of the UX design flow begins with reviewing the existing screen flow or user journey. This helps identify strengths and weaknesses in the current design. We spot out the registration flow may be complicated, which can deter users.

The next step involves conducting research to gain insights into user preferences and pain points. Based on the research findings, revisions are made to simplify and improve the registration flow by reducing steps, providing clear instructions, enhancing visual design, and utilizing progressive disclosure techniques.

Key design changes & rationales

Here are some examples of the UI UX changes after the internal review by our team and the management.

Core register flow

Combine the registration flow from few pages to 1 single page.
Added a progress bar to indicate the current step.
Improved wording to enhance clarity and avoid confusion.

Pairing flow

Step by step guide instead of one page instruction to avoid confusion.
Use animation and adjusted icon size for better understanding.
Utilized clear titles with short descriptions for improved readability.

Track bag flow

Implemented RC-4 tracking logic for departure flights.
- Before: Error message displayed at the end.
- After: Enhanced user experience by filtering available departure flights for service usage.
Added sorting logic to the tag list for faster selection.
Simplify the information display on screen