How 58 Home Service Revamped Its Design System to Deliver a Unified Brand Experience

Evolution of the Design System

In the era of diversified internet products, design systems have shifted from a simple resource library for design‑development collaboration to a vehicle for transmitting brand value. A consistent brand experience is essential across varied products.

Three Development Stages

1.0 : Product‑centered design achieving a smooth production‑sale loop.

2.0 : Consumer‑centered design focusing on user experience.

3.0 : Human‑centric design that embeds sensory brand sentiment and community.

Based on the 3.0 direction, the underlying framework incorporates human‑centric factors and links product, design, and development efficiently, resulting in the front‑end presentation.

Core Design Principles

Clean & Bright : Updated brand colors and auxiliary palette for a comfortable environment.

Light : Use of moderate gradients to evoke warmth.

Professional : Consistent brand endorsement across online and offline touchpoints.

Efficient : Reduce friction, improve clarity and operability.

Affinity : Incorporate a smile symbol to convey friendly service.

Slow Life : Emphasize quality of life rather than a mere tool.

Overall Architecture

The application architecture serves as the foundation for visual consistency, employing a universal structure to maintain system coherence and ease of use.

Grid System

A 4dp/4pt base grid is defined to ensure flexible yet consistent layout.

Text Guidelines

Typography hierarchy—size, weight, line‑height—creates clear information hierarchy for various scenarios.

Spacing & Corner Parameters

Spacing categories adapt to different page elements, working with the grid system; corner radii are standardized to avoid sharp edges and reinforce brand friendliness.

These principles culminate in a component library that reflects the brand’s emotional values while supporting efficient product experiences.