Smart Living
From Residential Units to Connected Experiences
Overview
As urban residents' expectations for a high-quality community life rise, traditional property management models often struggle to meet these demands. This project aims to bridge that gap. The resulting Smart Community Platform goes beyond being a tool, acting as a one-stop hub that connects homeowners, property management, and third-party service providers. By focusing on four core functions—property fee payments, smart access control, convenient services, and repair requests—it directly tackles industry-wide pain points like information opacity and cumbersome processes, transforming complex offline tasks into clear online flows and visual information, creating an efficient, convenient, and secure digital home.
Timeframe
4 Weeks
My Role
Research, UX/UI & IA Design, Branding, Prototyping + Testing
Tools
Sketch, photoshop, wps
Seamless Integration of Diverse Services: High-precision core property services must be smoothly integrated with complex third-party providers and uniformly connected to community IoT hardware, ensuring stable and consistent data flow and service experiences across multiple systems systems.
Balancing Experience and Security: Achieve the right mix of security and usability while satisfying community safety and user privacy needs. Create reliable and easy-to-use mobile interactions that overcome the outdated complexity of traditional property management apps.
Simplifying the Digital Transition: Address the uncertainty and "black box" anxiety of transitioning from offline services to an online app. By providing clear status updates and explicit feedback, the design establishes user trust in the digital process, making it feel tangible and reliable.
Challenge
For Homeowners (users): Offer a comprehensive mobile service portal that provides “everything you need at your fingertips.” Enable seamless access, instant bill payments, and quick service delivery, greatly improving residential convenience, security, and quality of life.
For Property Management (operators): Promote the digitization and standardization of property services to lower operational costs, enhance efficiency by improving service response time and quality, and increase homeowner satisfaction.
For the Platform: Develop a highly active, high-engagement community life service platform. By integrating value-added services and advertising, explore new business models and strengthen the platform's brand image and market leadership.
Objective
Competitive Market Analysis
To clarify the unique advantages and market position of the "Smart Living App," we analyzed the industry's top competitors. This analysis focused on identifying their strategic priorities, strengths, and weaknesses, aiming to clarify the market landscape and provide key insights for developing a differentiated product strategy.
Conclusion
Analysis revealed that top competitors either prioritize community social/e-commerce ecosystems or focus on platform scale expansion, often diluting the depth or consistency of their "basic property service" experience. This confirmed our core strategy: to avoid blindly pursuing scale or social trends, and instead first focus on the depth and reliability of property services (e.g., access control, repair, payment) to build an irreplaceable foundation of user trust. Only on this base can the ecosystem be steadily extended to enhance experience and loyalty.
User Research
This research focuses on the platform's three core roles: property owners, tenants, and property management staff. Although they share a common expectation for digital transformation of community services, their roles and core behavioral patterns are fundamentally different. To achieve precise design, we segmented the core users as follows:
Process Fragmentation: When completing routine tasks like fee payments, maintenance requests, users must switch between multiple disconnected offline steps—such as phone calls or on-site visits—resulting in cumbersome operations, frequent interruptions, and a poor experience.
Heavy Dependence on Manual Labor: From work order documentation and task assignment to status tracking and resident verification, processes rely heavily on manual work and repetitive communication. This not only reduces efficiency but also raises the risk of errors and user dissatisfaction due to oversight or delays.
Information Opacity: Critical details such as repair progress, service status, and community notifications cannot be synchronized or queried in real time, creating an information black box. Users cannot establish reliable service expectations, which increases the explanation efforts between property management and residents.
Key Points
Streamlining Service Workflows: Reconstruct complex offline operations like repair requests and property payment into clear, coherent online processes, making them as smooth and simple as online shopping to fundamentally resolve the pain point of fragmented workflows.
One-Click Access to Key Functions: By unifying service entry points and streamlining interaction paths, essential functions like "Property Payment" and "Repair Request" are easily found and utilized on the homepage, significantly reducing operational steps and decision-making effort.
Trackable Progress Updates: Ensure every status step, from service request submission to final completion, is recorded and clearly visible in real-time. This eliminates anxiety over information opacity, ensures user peace of mind, and enhances the management and collaboration efficiency of the property team.
What should we do?
Design Principles
Based on the insights from the core pain points identified above, the following principles guided the entire design process.
Warm and Inviting
By employing a warm visual language and emotive design, we soften the utilitarian tool-like feel, transforming complex service processes into a clear, friendly online experience, thus enhancing the overall experience quality.
Effortless and Efficient
We focus on the highest-frequency operations on the homepage, guaranteeing one-click access and the shortest path for core tasks to directly address the pain point of "cumbersome processes."
Secure and Reliable
Establishing certainty through trackable progress updates and status feedback, and building trust in sensitive operations with stable performance and clear data, directly responding to the anxiety of "information opacity."
Information Architecture
After defining user roles and core needs, we built a mobile navigation framework with four main tabs: “Home,” “Life,” “Messages,” and “My.” This framework strictly follows the “Effortless and Efficient” principle, integrating scenario-based features with clear information hierarchy to ensure users can efficiently access all core services with minimal steps. This strategy aims to simplify the daily life of property owners and support efficient property management.
User Flow
We have developed key service flow diagrams for main scenarios, clearly illustrating the full digital service cycle from “user submitting a repair request” to “property management receiving and handling the request,” ending with “user completing the evaluation.” This ensures smooth process integration and a consistent user experience throughout the entire journey.
Mid-Fidelity Wireframes
Using mid-fidelity wireframes, we concentrated on designing the “repairs” process. From the homepage entry point to successful submission, we carefully mapped out the information layout and operational feedback for key stages—including repair area selection, problem description, and image upload—ensuring a clear workflow and simple forms. This creates a strong interactive foundation for high-fidelity design.
Branding
Before diving into high-fidelity design, I first extended the established design principles (warmth, efficiency, safety) into core brand keywords and created a mood board centered around "warmth, efficiency, safety, and intelligence," clearly defining the perceptual direction the brand needed to communicate. Building on this foundation, I developed a comprehensive set of visual guidelines, including the color palette, typography hierarchy, and component styles.
The design features a bright, warm yellow as the brand's accent color, evoking a sense of sunshine and vitality. Paired with a stable, neutral color palette, this combination creates a reliable, approachable, and modern visual foundation. Icon and graphic designs draw inspiration from architectural silhouettes and everyday life scenarios.
Ultimately, this visual system not only offers functionality but also subtly communicates the project’s core value—from reliable residential units to intelligent connected experiences—transforming every smooth interaction into a warm, neighborly connection.
High-fidelity
Based on the design specifications, we have finalized a high-fidelity design. The design thoroughly integrates into community life scenarios, using intuitive icons, a clear information hierarchy, and real-time status feedback to create a reliable, user-friendly, and thoughtful platform experience.
Internal Testing
To assess the feasibility of the core service workflows during the early stage, we organized an internal review. We focused on two high-frequency scenarios that represent 'transactional trust' and 'service synergy': "Property Payment" and "Repair Request." Product managers and development engineers evaluated the workflow feasibility and design solution clarity by interacting with the prototype.
Review Scenario 1
Your ceiling is suddenly leaking. Please use the app to submit a complete repair request and then try to track the processing status.
“How did you find and begin the 'Repair Request' workflow? Were the form steps (selecting area, description, picture upload) clear and easy to operate?”
“After submission, where can you check the processing status? Did the status display make you feel informed about the subsequent progress?”
Review Scenario 2
Your monthly property management bill has been generated. Please try paying online.
“How did you find out about and verify this month's property bill that needs to be paid? Were the bill details (e.g., items, amounts, billing cycle) clear and easy to understand?”
“Was the entire payment process smooth? Before and during payment, what elements or information made you feel reassured or caused concern?”
“After a successful payment, what confirmation did you receive? Did you find this confirmation clear enough to confirm that your payment was complete and no further action was required?”
Task1
All participants successfully completed the online payment for property fees. From bill viewing to completing the deduction via WeChat Pay, the entire process was seamless. Clear bill details and explicit multiple payment feedbacks (processing, success) were considered effective in building transactional trust.
Task2
Participants successfully submitted a repair request and could clearly find the work order and its current status (e.g., "Submitted," "In Progress") in the repair history or message center. The closed-loop design of the workflow was preliminarily considered effective in alleviating user anxiety over the "information black box" during the waiting period.
Review Feedback
Intuitive and Reliable—Payment bills are crystal clear, and the process includes explicit transaction feedback, which is very reassuring.
“
“
Clear and Hassle-Free—Repair form steps are clear; picture upload is convenient, and seeing the status after submission makes me feel the issue has been addressed, eliminating the need for follow-up calls.
Comprehensive Functionality—One app handles both payment and real-time repair submission and tracking. This is the true smart community experience, removing the need to switch between multiple channels.
“
The internal review successfully validated the logical correctness and technical feasibility of the two core workflows, "Payment" and "Repair." Building on this, we initiated a new round of optimization and iteration, focused on professional aspects like experience fluidity and information design efficiency, to better handle high-frequency usage post-launch.
Iterations
Iteration 1: Optimizing Homepage Quick Access Layout
Issue
In the initial homepage layout, similar visual weight across multiple function entry points reduced the visibility of high-priority services like "Mobile Access" and "Visitor Invitation," potentially increasing user search time.
Additionally, the layout of the top information bar failed to fully utilize available space to display key information.
Solution
We reorganized the homepage hierarchy. First, we elevated four high-traffic functions—including “Mobile Door Unlock” and “Guest Invitation”—to prominent primary positions.
Second, consolidated remaining functions into secondary entries to minimize visual clutter.
Additionally, redesigned the top information bar to directly display pending fee summaries, significantly improving space utilization and key information accessibility.
Iteration 2: Message Center Categorization and Status Visualization
Issue
All messages appear mixed in a single list, preventing users from quickly filtering out unprocessed or high-priority notifications (e.g., complaint feedback). Critical information is easily buried.
Solution
We restructured. the message center architecture. First, messages are categorized into “Repairs,” “Complaints,” and “Certificates.”
At the same time, we implemented a read/unread status indicator, making unread messages stand out by graying out the read ones. This visual cue greatly improves information recognition and reading speed.
Summary & Impact
1. Establishing the Core Experience Paradigm for Smart Communities:
The project effectively established a service experience closed-loop focused on “seamless access (mobile access/visitor code), online payment, and repair requests.” By digitizing workflows, this approach directly addresses key pain points identified in user research—such as fragmented processes and information opacity—significantly enhancing service response efficiency and reliability while improving user experience.
2. Creating a User-Driven Design Validation Loop:
Through internal testing and feedback collection, we established a rapid iterative design validation process, ensuring the design solution consistently focuses on user needs and optimizes toward the goal of "user-friendly and easy-to-use."
3. Achieving Synergy between Owners and Property Management:
The design strategy positions property staff as key users, effectively addressing the issue of “low efficiency in manual coordination” through collaborative features like "Message Center Status Synchronization." This creates an online collaboration system recognized by both parties, thereby improving overall community operation efficiency.
4. Envisioning a Sustainable Future Ecosystem:
The design establishes a clear and scalable Smart Community Product Architecture. This foundational structure ensures that after solidifying core services and user trust, any future functional modules (e.g., value-added services like "community group buying") can inherit the unified interaction logic and experience quality, enabling the ecosystem to grow naturally and sustainably.