This rebuild is still fresh. For now, please only view the desktop version.
The legacy Advantium interface worked reliably but felt visually dated and misaligned with GE Profile’s premium positioning. Café and Profile variants shared similar interaction models, yet lacked clear brand differentiation, and the overall presentation undermined perceived product value. Because functionality and hardware constraints were fixed, the primary risk lay in visual hierarchy, navigation discoverability, and learnability.
The challenge unfolded in two phases:
- How to modernize and differentiate the Profile interface without disrupting a proven interaction model.
- How far the Profile interface could be structurally simplified to improve aesthetic clarity without introducing unacceptable usability friction.
This project followed a deliberately staged intervention strategy to manage risk while elevating brand expression. Usability testing was used to validate whether these tradeoffs were acceptable for the Profile audience.
The first phase focused on a soft intervention:
- Retheming the existing Café Advantium interface to create a GE Profile variant.
- Preserving layout, navigation, and interaction behavior.
- Updating color, typography, imagery, and styling to match Profile’s visual language.
Once brand alignment was established and stakeholder confidence increased, the work progressed to a harder intervention:
- Exploring a redesigned Profile-only main menu.
- Reducing visual density and consolidating navigation.
- Introducing a cleaner hierarchy that prioritized refinement over immediate discoverability.
The final solution consisted of two complementary outcomes that balanced continuity and evolution. High-fidelity, animated prototypes were created to closely simulate the shipped experience and support usability validation.
Key design decisions included:
- Retheming the legacy interface to align Café and Profile variants with minimal usability risk.
- Introducing a redesigned Profile main menu as a separate, higher-impact intervention.
- Consolidating navigation into a refined top bar to reduce visual clutter.
- Supporting both click and drag interactions to reinforce affordances.
- Using motion and animation to guide users through a simplified hierarchy.
- Curating and organizing background imagery to elevate perceived quality.









Scroll Story
©2025 timothy yue li · all rights reserved · timyueli@gmail.com
Last Updated: 2025