Tencent’s open-source enterprise-level design system, TDesign

Tencent’s open-source enterprise-level design system, TDesign

2022-09-05 0 712
Resource Number 38220 Last Updated 2025-02-24
¥ 0HKD Upgrade VIP
Download Now Matters needing attention
Can't download? Please contact customer service to submit a link error!
Value-added Service: Installation Guide Environment Configuration Secondary Development Template Modification Source Code Installation

In this issue, we recommend a Tencent open source enterprise-level design system – TDesign.

Tencent’s open-source enterprise-level design system, TDesign插图

TDesign is an enterprise-level design system precipitated by Tencent’s business teams in the process of serving the business.

TDesign has a unified design value, a consistent design language and visual style, to help users form a continuous and unified experience perception. On top of this, TDesign provides out-of-the-box libraries of UI components, design guidelines, and related design assets to free design and R&D from repetitive work in an elegant and efficient way, while making it easy for everyone to build on TDesign to better meet business needs.

TDesign Origins

In the past, many teams within Tencent have built different design systems and component library products to meet their own business requirements and improve R&D efficiency. These systems are maintained independently and separately from each other. And as the scale of the internal business continues to expand, this fragmentation is becoming more and more serious.

In order to cope with this situation, Tencent has established an internal Open Source Collaboration Committee, which refers to the organization of the open source community and brings together different technical teams of similar projects to build open source together. In this context, TDesign came into being to build a complete and easy-to-use design system and component library products in an open-source and collaborative way within Tencent.

Tencent’s open-source enterprise-level design system, TDesign插图1

Features

complete

It supports the development of Vue 2, Vue 3, React and mobile Vue 3 and WeChat Mini Programs, and other technology stacks such as Augurar and Flutter are under development
Provide a rich variety of design resources, including Figma, Adobe XD, Sketch, and more, to free designers from repetitive work
Auxiliary design tools such as Sketch design plug-in are provided, and they can also be used in common design tools on the market, such as Tencent CoDesign, Instant Design, Pixso, and Ink Knife

 

Tencent’s open-source enterprise-level design system, TDesign插图2

unanimous

Having a unified design value and visual style helps products maintain a consistent product experience throughout the cross-device design and development process
The API definition and implementation of each technology stack product are consistent, which is more advantageous when building unified/multi-terminal coverage/cross-technology stack front-end applications

Tencent’s open-source enterprise-level design system, TDesign插图3

Use

Refine the design experience of different businesses and scenarios, and provide general design guidelines to lower the threshold for use
Users can extend their design styles through Design Tokens
The Starter Kit is provided to help users get started quickly

Tencent’s open-source enterprise-level design system, TDesign插图4

warehouse

TDesign is a multi-repo, TDesign has the following code repository:

Primary and generic warehouses

TDesign Main Repository and Documentation: https://github.com/Tencent/tdesign
TDesign Public Icon: https://github.com/Tencent/tdesign-icons
TDesign Public Style: https://github.com/Tencent/tdesign-common

Desktop component library

Vue 2.x Technology Stack: https://github.com/Tencent/tdesign-vue
Vue 3.x Technology Stack: https://github.com/Tencent/tdesign-vue-next
React 16.x Technology Stack: https://github.com/Tencent/tdesign-react
Angular 10-based implementation: tdesign-angular is coming soon

Mobile component library

Vue 3.x Technology Stack: https://github.com/Tencent/tdesign-mobile-vue
WeChat Mini Program: https://github.com/Tencent/tdesign-miniprogram
React 16.x tech stack: tdesign-mobile-react tech stack
flutter 1.17.0: tdesign-flutter is coming soon

Starter and surroundings

Scaffolding for TDesign Solutions: https://github.com/Tencent/tdesign-starter-cli
Tdesign-VUE-based solution: https://github.com/Tencent/tdesign-vue-starter
Solution based on tdesign-vue-next: https://github.com/Tencent/tdesign-vue-next-starter

Tencent’s open-source enterprise-level design system, TDesign插图5

You can read more on your own.

资源下载此资源为免费资源立即下载
Telegram:@John_Software

Disclaimer: This article is published by a third party and represents the views of the author only and has nothing to do with this website. This site does not make any guarantee or commitment to the authenticity, completeness and timeliness of this article and all or part of its content, please readers for reference only, and please verify the relevant content. The publication or republication of articles by this website for the purpose of conveying more information does not mean that it endorses its views or confirms its description, nor does it mean that this website is responsible for its authenticity.

Ictcoder Free Source Code Tencent’s open-source enterprise-level design system, TDesign https://ictcoder.com/tencents-open-source-enterprise-level-design-system-tdesign/

Share free open-source source code

Q&A
  • 1. Automatic: After making an online payment, click the (Download) link to download the source code; 2. Manual: Contact the seller or the official to check if the template is consistent. Then, place an order and make payment online. The seller ships the goods, and both parties inspect and confirm that there are no issues. ICTcoder will then settle the payment for the seller. Note: Please ensure to place your order and make payment through ICTcoder. If you do not place your order and make payment through ICTcoder, and the seller sends fake source code or encounters any issues, ICTcoder will not assist in resolving them, nor can we guarantee your funds!
View details
  • 1. Default transaction cycle for source code: The seller manually ships the goods within 1-3 days. The amount paid by the user will be held in escrow by ICTcoder until 7 days after the transaction is completed and both parties confirm that there are no issues. ICTcoder will then settle with the seller. In case of any disputes, ICTcoder will have staff to assist in handling until the dispute is resolved or a refund is made! If the buyer places an order and makes payment not through ICTcoder, any issues and disputes have nothing to do with ICTcoder, and ICTcoder will not be responsible for any liabilities!
View details
  • 1. ICTcoder will permanently archive the transaction process between both parties and snapshots of the traded goods to ensure the authenticity, validity, and security of the transaction! 2. ICTcoder cannot guarantee services such as "permanent package updates" and "permanent technical support" after the merchant's commitment. Buyers are advised to identify these services on their own. If necessary, they can contact ICTcoder for assistance; 3. When both website demonstration and image demonstration exist in the source code, and the text descriptions of the website and images are inconsistent, the text description of the image shall prevail as the basis for dispute resolution (excluding special statements or agreements); 4. If there is no statement such as "no legal basis for refund" or similar content, any indication on the product that "once sold, no refunds will be supported" or other similar declarations shall be deemed invalid; 5. Before the buyer places an order and makes payment, the transaction details agreed upon by both parties via WhatsApp or email can also serve as the basis for dispute resolution (in case of any inconsistency between the agreement and the description of the conflict, the agreement shall prevail); 6. Since chat records and email records can serve as the basis for dispute resolution, both parties should only communicate with each other through the contact information left on the system when contacting each other, in order to prevent the other party from denying their own commitments. 7. Although the probability of disputes is low, it is essential to retain important information such as chat records, text messages, and email records, in case a dispute arises, so that ICTcoder can intervene quickly.
View details
  • 1. As a third-party intermediary platform, ICTcoder solely protects transaction security and the rights and interests of both buyers and sellers based on the transaction contract (product description, agreed content before the transaction); 2. For online trading projects not on the ICTcoder platform, any consequences are unrelated to this platform; regardless of the reason why the seller requests an offline transaction, please contact the administrator to report.
View details

Related Source code

ICTcoder Customer Service

24-hour online professional services