Background
What is Smart HQ Management?
Smart HQ Pro Management is a cloud-driven enterprise software solution that enables property managers, hotel operators, and laundromat owners using GE Appliances to efficiently manage and maintain all their appliances across various locations in one platform.
.png)
Introduction
Why this project is starting?
As Smart HQ Pro contracts increased and the business expanded significantly, various issues emerged, leading to the integration of commercial laundry features for laundromat owners and the launch of version 2.0.
Business Goal
Streamlined Solutions for Maximum Profitability
Redesign with a scalable solution to enhance usability for business customers and maximize their profitability through streamlined, efficient tools.
.png)
Situation
Challenges in Scalability and Consistency
The current service struggles with scalability because it was designed without a clear plan and lacks consistency. This leads to delays in adding new features, high maintenance costs, and confusion for customers due to different designs on desktop and mobile.
.png)
Approach
Optimizing UX Flow and Design Consistency
We decided that reorganize the UX flow to prioritize user needs, create a consistent design system for both mobile and desktop, and restructure the IA to feature the most used and newly added functionalities.
.png)
Impact
Increased Usage and Contracts Following 2.0 Upgrade
After the design updates, contracts with GE Appliances property owners and managers grew, boosting app usage and satisfaction. The design system enabled faster development, issue resolution, and updates.
60%↑
increase in update frequency
Contracts ↑
with large enterprises.
Launching 2.0 Design Update with Unified Design System
We improved the UX/UI and updated various details, launching the app on both iOS and Android. Users can also access the web version through Google Chrome. Feedback from users has shown significant improvement compared to before the update.
App Store and Google Play
Research
Heuristic Evaluation with User Reviews
All kinds of owners, managers, and operators
The app’s primary users are various such as property owners, hotel managers, hotel guests, laundromat operators, and other appliance owners. For understanding their needs, we analyzed how they use this service, examined the features based on Heuristic Evaluation, and simulated user scenarios.
Analyzing User Needs
By using an affinity diagram to group user feedback, we identified key problems within the app: it contains too many features, making it difficult for users to find what they need quickly, and it lacks consistency between desktop and mobile versions.
.png)
Affinity Diagram
Insights
Simplifying Navigation and Enhancing Cross-Platform Consistency
The analysis reveals a clear need for feature prioritization and platform consistency to improve user experience. With too many functions cluttering the interface, users struggle to quickly locate desired features, indicating that a refined information architecture is essential for streamlined navigation. Additionally, the lack of design consistency between desktop and mobile versions suggests a need for a unified experience across devices, which would not only enhance usability but also strengthen brand identity. By prioritizing key features, optimizing for device-specific usage, and creating a cohesive design system, the app can better meet user expectations and reduce cognitive load.
Design Goals
Streamline and Prioritize Key Features
Focus on essential functionalities to make the app easier to navigate and reduce cognitive load.
Establish Cross-Platform Consistency
Create a unified design across desktop and mobile to improve usability and reinforce brand identity.
Optimize for Device-Specific Needs
Tailor features and layout for desktop and mobile, enhancing usability based on the specific contexts of each platform.
Solution
Optimizing User Experience through Customized UI
Problem
The current app has too many mixed features, which increases user confusion. There are various types of users, each needing different functionalities, making it difficult to fit all features into a single service effectively.
Design
Grouping related features together and Building a User-Customizable UI
By creating different entry points, the app now prioritizes displaying only the necessary features for each user type from the beginning.
Detail Pages of Features are Confidential
Device-Specific Customization
Problem
Desktop and mobile designs have a big difference in style, and the depth to access the same features varies, causing confusion for users.
Design
Efficient Feature Layout for Desktop and Mobile
We researched user preferences for desktop and mobile, then organized key features into a clear list. On desktop, we used the larger screen to show important features at a glance, while on mobile, we streamlined the flow to minimize transitions, helping users find what they need quickly.
Mobile and Desktop Version
Consistency and Brand Cohesion
Problem
When products from the same company don’t have a consistent design or feel, users can get confused and feel like they’re using products from different brands.
Design
Enhancing Brand Value Through Adapted Design Systems
To enhance brand value, we analyzed the unique features of each application and adapted the design system within a consistent style. This approach allowed us to modify and refine the system to suit each app's needs, increasing overall cohesiveness and quality.
GE Appliances' Smart HQ Home and Pro Series
Iterative Design Process
Incorporating Feedbacks and Data-Driven Changes
Feedback was gathered from team members, including software developers and project managers, as well as users, to refine the prototype and enhance user navigation. Issues such as tangled mouse flow were resolved, and the use of excessive colors was reduced to ensure key elements were more prominent. Consistency in button positions, page titles, and scroll areas was maintained to help users stay oriented when switching between pages. This iterative process brought continuous improvements and ultimately earned stakeholders' approval for release.
Three Phases of Design Development
Final Design
Refining the Final Design for User Clarity and Cohesion
To create a user-centered design, our team focused on minimizing excessive text and retaining only essential functions, using icons to make features easily understandable at a glance. Consistency across desktop and mobile design systems was maintained while considering screen sizes and user interaction methods, such as finger taps and mouse clicks, when designing the flow. A cohesive experience between both devices was ensured by developing a new design system with a unified style.
Mobile ver.
Changing from a text-heavy and monochromatic design, we adjusted the placement of clickable components and buttons to make them easy to use with one hand. The mobile design system was constructed using components that felt familiar to users. For complex screens like graphs and payment systems, we restructured the flow to highlight the most relevant information first—for instance, ensuring that laundromat operators could easily view their total earnings and revenue changes over time.
Detail Pages are Confidential
Desktop ver.
We leveraged the wide screen space to design features that could be viewed at a glance, enhancing the overall user experience. Main button placement and scrollable screens were unified to minimize confusion, while vertical and horizontal menus were arranged for quick access to key functions. To keep the information display simple and easy to read, we used tag chips and color cues, allowing users to quickly identify statuses at a glance.
Impact
Ensuring consistency across 800+ screens
I developed a new design system aligned with the style of the Smart HQ apps. For features unique to Smart HQ Pro Management, I collaborated closely with developers to create new components, designing over 800 screens in total. I led the design of an application that enables both internal appliance technicians and external service providers to easily diagnose and repair appliances. I was responsible for the entire design process and collaborated closely with developers to deliver an optimized UI/UX, resulting in a successful launch.
Confidential Detail UX/UI Pages
Industry Recognition and Exposure at Major Conferences
Our product was featured at both the Heritage Properties, Inc. Conference and the NAA Apartmentalize Conference in Philadelphia. Presenting at these high-profile industry events allowed us to introduce the product to a wide audience of property management professionals, fostering interest and receiving valuable feedback directly from key stakeholders in the field. This exposure enhanced the product's credibility and highlighted its potential for broad application across the property management industry.
Key Takeaways
Importance of data-driven design
I realized that restructuring the UX based on user data, rather than assumptions, helps avoid costly changes during development.
Effective Design of Across Platforms
Designing for both desktop and mobile taught me the importance of creating adaptable yet consistent experiences. Understanding the unique challenges of each platform allowed me to develop user-friendly designs that feel seamless, no matter the device.
The Power of Cross-Team Collaboration
This project showed me how invaluable it is to collaborate with different teams. Partnering with developers, product managers, and fellow designers helped us overcome the unique challenges of creating a seamless experience across platforms. This taught me that bringing together different perspectives leads to more cohesive, user-friendly designs and stronger solutions overall.
Recognizing the Importance of User Context Analysis
Through this project, I realized just how important it is to understand the context in which users interact with a product. By analyzing their environments, needs, and challenges, we can create designs that not only meet their expectations but truly support their goals and make their experiences more meaningful.
.jpg)
