design system | BestHub

JD Tech Talk

Mar 10, 2025 · Frontend Development

C2D2C (Code‑to‑Design‑to‑Code) Mode for Unified Design and Development Assets in JD Cloud Frontend

The JD Cloud frontend team introduced a C2D2C workflow that converts component code into design tokens, generates synchronized Figma controls, and then transforms those designs back into code, aiming to eliminate version gaps, reduce designers' workload, and improve design‑to‑code fidelity across the Mobius design system.

C2D2CFrontendcode generation

0 likes · 9 min read

C2D2C (Code‑to‑Design‑to‑Code) Mode for Unified Design and Development Assets in JD Cloud Frontend

Ctrip Technology

Dec 19, 2024 · Frontend Development

Building an Enterprise‑Level Multi‑Brand, Multi‑Platform Design System at Ctrip

This article details Ctrip's approach to creating a scalable enterprise design system that supports multiple brands and platforms through modular design, theme configuration, cross‑platform component libraries, and automated workflows, ultimately improving design efficiency, consistency, and development productivity.

Frontendcomponent librarycross‑platform

0 likes · 16 min read

Beijing SF i-TECH City Technology Team

Nov 29, 2024 · Mobile Development

SF Design Mobile: Design System, Token Integration, and Component Library Overview

The article outlines the background, goals, construction process, and comprehensive showcase of SF Design Mobile, a cross‑platform component library built by SF Technology, emphasizing design principles, the integration of Design Tokens, component categories, public platform, application examples, current usage, feedback, and future plans.

Frontendcomponent librarydesign system

0 likes · 8 min read

SF Design Mobile: Design System, Token Integration, and Component Library Overview

NetEase Cloud Music Tech Team

Dec 28, 2023 · Frontend Development

Lossless Design-Frontend Collaboration: The Evolution of NetEase Cloud Music's Design Collaboration Practice

Since 2021, NetEase Cloud Music’s Design Platform has evolved its design‑frontend workflow through three stages—engineering phase 1.0, phase 2.0, and the AI‑driven intelligent phase—by introducing the C2D2C (Code‑to‑Design‑to‑Code) methodology, unified design systems, LLM‑enhanced code, and generative AI tools, cutting communication overhead and boosting designer and developer productivity by up to 200 %.

AI designC2D2CD2C

0 likes · 31 min read

Lossless Design-Frontend Collaboration: The Evolution of NetEase Cloud Music's Design Collaboration Practice

Rare Earth Juejin Tech Community

Dec 18, 2023 · Frontend Development

Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023

In this article the author, creator of the Vue3 mobile component library Varlet UI, shares the latest architectural changes, monorepo setup, design system, development tooling, testing, build outputs, documentation deployment, playground, and VSCode extensions, reflecting on lessons learned over the past two years.

FrontendMonorepoVue

0 likes · 12 min read

Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023

Architects Research Society

Oct 8, 2023 · Frontend Development

Building a Frontend Core Team and Foundations at Razorpay

This article describes how Razorpay formed a frontend core team, defined its responsibilities, tackled infrastructure and design inconsistencies, and built a monorepo‑based toolchain and design system to improve developer experience, scalability, and product quality across the organization.

CI/CDFrontendMonorepo

0 likes · 16 min read

Building a Frontend Core Team and Foundations at Razorpay

We-Design

Mar 30, 2023 · Frontend Development

How to Implement Design Tokens in Figma and Sketch for Seamless Dev Collaboration

This article explains how to map design tokens—style, component, template, and file tokens—to appropriate carriers in Figma and Sketch, covering token categories, multi‑mode and multi‑business handling, component token strategies, property naming conventions, handoff methods, and version management.

FigmaFrontendSketch

0 likes · 20 min read

How to Implement Design Tokens in Figma and Sketch for Seamless Dev Collaboration

Qunhe Technology User Experience Design

Nov 18, 2022 · Product Management

How to Streamline User Onboarding in SaaS: Design Patterns and Management Solutions

This article examines the challenges of user onboarding in a complex SaaS design tool and proposes a comprehensive solution that combines a structured design language, reusable design patterns, and a management backend to reduce development costs, improve consistency, and enable targeted, timely onboarding experiences.

SaaSUX designdesign system

0 likes · 12 min read

How to Streamline User Onboarding in SaaS: Design Patterns and Management Solutions

Qunhe Technology User Experience Design

Jul 22, 2022 · Fundamentals

How to Accelerate Your Growth as a Junior B2B Designer: Essential Skills and Strategies

This article consolidates the common doubts junior interaction designers encounter, outlines professional and career competencies, and provides a step‑by‑step guide on demand analysis, design system construction, user research, and practical tips for thriving in B2B design projects.

B2B designDesign ProcessUX fundamentals

0 likes · 15 min read

How to Accelerate Your Growth as a Junior B2B Designer: Essential Skills and Strategies

Qunhe Technology User Experience Design

Jun 2, 2022 · Product Management

How Systematic Design Solutions Boost Product Quality and Team Efficiency

This article explains how a systematic, pattern‑based design approach—abstracting from elements to components and codifying rules—can unify product experiences, reduce development cycles, and dramatically improve the efficiency and consistency of large, complex product teams.

Design Patternsdesign systemproduct design

0 likes · 9 min read

How Systematic Design Solutions Boost Product Quality and Team Efficiency

Qunhe Technology User Experience Design

Apr 26, 2022 · Frontend Development

How Manycore Design Unified Our UI Components Across Teams

This article outlines the evolution of Manycore Design, the in‑house design system created by Qunhe, detailing its transition from third‑party libraries to a unified component library, the four‑year development process, and the ongoing efforts to expand its ecosystem and ensure consistent product standards.

FrontendProduct DevelopmentUI standardization

0 likes · 3 min read

How Manycore Design Unified Our UI Components Across Teams

TikTok Frontend Technology Team

Dec 15, 2021 · Frontend Development

Visual Interaction and Frontend Development: Enhancing User Experience and Development Efficiency

This article explores how visual interaction influences user experience and outlines strategies—such as design specifications, component libraries, design tokens, and D2C workflows—to improve consistency and efficiency in frontend development across product iterations.

Frontendcomponent librarydesign system

0 likes · 14 min read

Visual Interaction and Frontend Development: Enhancing User Experience and Development Efficiency

ByteFE

Jun 23, 2021 · Frontend Development

Building an Effective Frontend Team in a Startup

This article discusses the challenges faced by frontend developers in startup companies and offers practical solutions such as coding standards, design guidelines, component libraries, documentation, project infrastructure, collaboration processes, and team culture to improve professionalism, coordination, and productivity.

DocumentationFrontendcoding standards

0 likes · 15 min read

Building an Effective Frontend Team in a Startup

Qunhe Technology User Experience Design

Jun 9, 2021 · Frontend Development

A Complete UI Standard Design Process: From Requirement Analysis to Implementation Tracking

This guide outlines a comprehensive UI standard design process—from requirement analysis and interaction design to visual design, design system creation, and implementation tracking—providing UI, interaction, and experience designers with structured steps, evaluation criteria, and best‑practice principles to deliver business‑driven, high‑quality products.

Design ProcessUI designdesign review

0 likes · 13 min read

A Complete UI Standard Design Process: From Requirement Analysis to Implementation Tracking

AntTech

Jan 29, 2021 · Frontend Development

Invisible Design System: Ant Design’s Engineering Approach to Design Asset Management

This article introduces Ant Design’s Invisible Design System, explaining how design asset management and engineering rules (ETCG) are explored to create unified, hidden guidelines that improve component consistency, workflow efficiency, and collaboration, and outlines the open‑source plan, Kitchen tool, and community initiatives for frontend development.

Ant DesignDesign Opscomponent library

0 likes · 14 min read

Invisible Design System: Ant Design’s Engineering Approach to Design Asset Management

Qunhe Technology User Experience Design

Jan 27, 2021 · Frontend Development

Unlocking Design Tokens: Boost UI Consistency Across Platforms

This article explains how design tokens serve as the building blocks of a design system, enabling theme customization, cross‑platform consistency, and workflow efficiency for digital products by standardizing colors, spacing, typography, and other style values.

Frontendcross‑platformdesign system

0 likes · 7 min read

Unlocking Design Tokens: Boost UI Consistency Across Platforms

GrowingIO Tech Team

Jan 14, 2021 · Frontend Development

Master Frontend Tooling: Prettier, Stylelint, ESLint, and Git Hooks for Design Systems

This article explains how GrowingIO's Design System leverages a component library and introduces essential frontend development tools—including Prettier, stylelint, ESLint, Commitizen, commitlint, lint‑staged, and Husky—detailing their installation, configuration, usage, and integration into CI pipelines to ensure consistent, maintainable code.

CIFrontendcode formatting

0 likes · 13 min read

Master Frontend Tooling: Prettier, Stylelint, ESLint, and Git Hooks for Design Systems

Qunhe Technology User Experience Design

Oct 16, 2020 · Frontend Development

Why Design Systems Are Essential for Scalable SaaS Products

This article explains what a design system is, outlines its key advantages such as unified design, reduced design debt, and improved efficiency, describes its core components like visual language and component libraries, and showcases best‑practice examples from Google, Ant Design, and Shopify.

FrontendUI/UXcomponent library

0 likes · 9 min read

Why Design Systems Are Essential for Scalable SaaS Products

iQIYI Technical Product Team

May 22, 2020 · Mobile Development

Building a Mobile Component Library: Practices and Lessons from iQIYI

iQIYI’s mobile component library was built by first auditing 400+ pages to define design specs and business needs, then creating reusable “block‑card” components with a scalable granularity, a backend management platform, and a Sketch plugin, achieving 43% page coverage, 40% workflow efficiency gain and 25% UI consistency improvement while maintaining design flexibility.

Best PracticesFrontend Developmentcomponent library

0 likes · 12 min read

Building a Mobile Component Library: Practices and Lessons from iQIYI

Youku Technology

Jan 7, 2020 · Mobile Development

Comprehensive Design and Technical Summary of Full Dark Mode Support for the Youku App

The article delivers a detailed 117‑page, eleven‑chapter overview of Youku’s full Dark Mode implementation, explaining the motivation, battery and accessibility benefits, design methodology—including color token systems and contrast hierarchy—and the coordinated technical execution across iOS and Android platforms.

Androidaccessibilitydark mode

0 likes · 13 min read

Comprehensive Design and Technical Summary of Full Dark Mode Support for the Youku App