How 58 Local Dating App Revamped Its Visual Language to Boost User Engagement

Introduction

Facing intense competition in the social‑app market, 58 Local Dating sought a differentiated visual language to increase user stickiness and attract younger users through the broader 58 App traffic.

Positioning and Problems

58 Local Dating is an online platform combining stranger socializing, real‑time video matchmaking, matchmaking services, and PK battles, targeting the lower‑tier market. Its main features include three‑way video chat, text matching, matchmaking mediation, and PK battles. User demographics show a 2:1 male‑to‑female ratio, with 18‑25‑year‑olds as the primary target group.

Key issues identified were:

Lack of continuity with the main 58 brand, resulting in low transmission power and unclear positioning.

Outdated basic experience and fragmented components.

Confusing content hierarchy and weak pacing, hurting conversion.

Visual style leaning too feminine, mismatching the predominantly male audience.

The redesign focused on five core tabs: dating, matchmaking, feed, chat, and personal center.

Direction and Exploration

Designers gathered mood boards around three keywords—"real," "friendship," and "companionship"—and explored five dimensions: personas, event scenes, objects, style, and emotional traits. The chosen style emphasized minimal decoration, reduced color palette, light skeuomorphism, lively warmth, rounded corners, and a focus on dynamic content photos.

Visual Upgrade

Home Page Restructuring

The homepage was reorganized to clarify information hierarchy and improve user efficiency while balancing user needs and product operations.

Header Icon Optimization

The four primary header icons were redesigned with larger rounded corners, a slight 15° left tilt, and a color scheme aligned with the 58 App, adding auxiliary colors for a more vibrant brand feel.

Recommendation Area Integration

Noise was reduced by removing duplicate usernames and unnecessary age displays, focusing on photos, expanding portrait areas, adding PK status tags, and introducing subtle micro‑interactions to enhance realism.

Recommendation List Refinement

Consistent visual treatment highlighted honor medals and improved overall rhythm and unity.

Tab Bar Renewal

The tab bar adopted simplified icons with larger rounded corners and retained the 58 orange accent, reflecting a lively and friendly design language.

Other Page Enhancements

Live, feed, and message pages were aligned with the city‑platform components to reduce fragmentation. The personal center received a lightweight redesign, removing heavy color blocks, using card‑style function grouping, and emphasizing a clean, fresh atmosphere.

Conclusion

The visual language upgrade followed a divergent‑convergent process: brainstorming, style collage, mood‑board collection, keyword extraction, design principle definition, solution design, refinement, and selection. The goal was to uncover user needs, create a cohesive experience loop, and deliver a usable, emotionally resonant product that adds value.