← Back to work
Finance · Alipay · 2020

Alipay Digital Community

Transforming residential services into a seamless, secure, and engaging digital experience, built inside Alipay as a lightweight Mini App.

Role
UX / UI · Design System
Platform
Alipay Mini App
Year
2020

Overview

A property service hub that lives where users already are.

The Digital Community project was built with Alipay as a lightweight Mini App for residential communities. The goal was to streamline daily operations while improving security and meeting real resident needs. Common tasks — gate access, visitor passes, bill payment, and maintenance — are handled directly inside Alipay, with no separate app to install. The target users are property managers and residents.

The Challenge

01

Limited functionality

The original interface only offered basic features like e-card info and a QR code, which limited user engagement.

02

Inconsistent visual language

Without standardized design guidelines, different service modules felt disconnected, reducing brand cohesion.

03

Complex navigation

Users struggled to locate key functions quickly, especially in urgent moments like visitor access or payment.

04

Low feature discoverability

Many community services were hidden or underused due to poor information hierarchy, such as HOA services.

My Role

01

Led prototype and final visual design through development handover.

02

Established a standardized design system, consistent color, typography, and an icon set to support scalable future updates.

03

Collaborated closely with product and engineering to ensure seamless integration with the Alipay platform.

The Solution

From a single-action entry to a business-matrix home screen.

Before

One hero button

The homepage centered on a single "Open Gate" action. Everything else, payments, repairs, visitor invites, was buried or hard to find.

After

Matrix + fixed access

"Open Gate" moves to a fixed bottom tab (Access Code), while the home screen surfaces a grid of services. High-frequency action stays instant; monetizable modules become visible.

  • Information architecture shift: from a single-action model to a business matrix, Payments, Repair Requests, Visitor Invites, and Temporary Parking sit as a grid, with Messages and a Community card above.
  • Revenue & operations journeys (property fees, parking, utilities, event sign-up) move from passive discovery to active distribution, improving the full funnel: exposure → click → payment.
  • Two-tap gate access is guaranteed regardless of how dense the home page becomes, the button is smaller but better suited to one-handed gesture use.

Redesigned Home

Home screen evolution — V1.0 to V2.0
Key pain points, How might we, and information architecture
Home screen redesign — before and after

Key Scenarios

01

Door Opening

Returning home, a resident scans a QR code to enter, no physical access card to lose, and more secure than fingerprint or facial recognition. It's the highest-frequency action, so it stays just two taps away.

Scenario 1 — QR code scan and gate access flow
02

Community Activity

The Community Activity section gives residents a quick path to discover and join community events, building day-to-day engagement and stronger user stickiness.

Scenario 2 — community event browsing, registration, and visitor invite flow
03

Housekeeping Request

The Housekeeping Request flow lets residents reach their property manager and submit repair or service tickets in a few taps, closing the loop on daily needs and improving service efficiency and resident trust.

Scenario 3 — contacting the property manager and submitting a repair request

More Screens

Full screen inventory of the redesigned Digital Community Mini App
Resident card flow — claim entry, member info, and property linking
Home, resident QR code, and gate-access success
Property payment and community event details
Profile, payment history, and overdue bills