top of page
XIAOMI
Watch S1 Pro
UX / Product Design
User experience design and UI enhancements for health Apps on smart watch for global tech brand.
Xiaomi Watch S series rivals Apple Watch and Fitbit, with a global market share of 15%. As part of the user experience team, I revised UI guidelines which later used for all health apps.
Learn more about the project at the end.
I renewed the Period App with an identical interactive solution, with clear data hierarchy and circular visual system for seamless usability.
Learn more about the project at the end.
The new solution changed the original Period static calendar into an interactive mode, activated by turning the watch crown.
Learn more about the project at the end.
In this new version, user could view a 30-day period forecasts by rotating the watch crown, a cursor will scroll along the dial, each dots along the dial represent a calendar day. As user scroll along, the main screen switches in color and text, notifying the prediction on specific days.
Learn more about the project at the end.
As user turn the crown to scroll across the dial calendar, the color changes in gradient corresponding to specific date and forecast.
Learn more about the project at the end.
Project Story &
My Contribution
Xiaomi is a leading electronics company which produce smartwatches, rivaling Apple Watch and Fitbit. Our team enhances UX, visual systems, and UI guidelines, specifically for S series models. To enhance the Period App on the smartwatch, which previously only had a static, square-shaped calendar for cycle forecasting, underutilizing the circular dial and watch crown.
The design aims to utilize the watch crown and creates a dynamic interaction. Use circular dial effectively, creating an organic and visually appealing interface. Information placed in clear hierarchy, reduce understanding costs.
To align with Xiaomi's circular dial, we introduced centrally symmetrical interfaces, optimizing screen space, standardizing card formats, and refining visual details for clarity. In a dial-shaped interface, users can navigate by turning the crown to adjust the cursor, while in a list interface, they can swipe to scroll through options.
Our users could view 30-days forecasts by rotating the crown, still keeping the calendar feature. When rotating the crown, a cursor scroll along the dial, each dots along the dial represent a calendar day. When tapping into the period App, user lands on the circular calendar page, in a beautiful organic shape. Each dots has color that representing period prediction status, as you scroll along, the main screen switches notifying our users prediction on specific days.
We kept the original calendar color system from previous versions, and assign each type of day with specific color. As user turn the crown to scroll across the dynamic dial calendar, the color changes in gradient corresponding to specific date.
I led and drafted this proposal in Q4 2021, just before the end of my internship. A year later, my colleague from Xiaomi contacted me to inform me that they had chosen to adopt this plan for future product designs. Ultimately, it was implemented in the Model S1, S2, and S3, which were released between 2022 and 2023.
Employer
Xiaomi
Discipline
Product Design
Tools
Figma
After Effects
Adobe Premiere
Office
Beijing
Project Team
Yan He
Zhoucong Tsui
Xuewei Tsui
Leo Liu
Kairui Wen
Zhen Mei
Julia Du
DIOR
Merchandising
Business Analysis
Trend analysis, sales forecast, and store management for Dior Menswear.
bottom of page