TDesign - Free open source enterprise-level design system produced by Tencent, supporting front-end UI component library supports both Vue 2 and Vue 3

TDesign - Free open source enterprise-level design system produced by Tencent, supporting front-end UI component library supports both Vue 2 and Vue 3

Goose Factory's freshly-released enterprise-level design system supports Vue 2, Vue 3 and React, with elegant design and rich business components, which is worthy of in-depth study.

About TDesign

TDesign is a product R&D solution officially produced by Tencent. It is an enterprise-level design system precipitated by Tencent's business teams in the service business process. It brings together many of Tencent's excellent component library capabilities and design and development experience.

Similar to  Ali's Ant Design , in addition to providing an out-of-the-box front-end development UI component library , it is also equipped with design guidelines and design resources to help the R&D team focus on business, allowing designers and front-end engineers to elegantly and efficiently integrate design and design. R&D is freed from repetitive work, and services are built quickly.

tdesign official website

Technical Features of TDesign

  • Comes with a general and comprehensive design guide, and provides design resources such as source files of common design tools such as Sketch / Figma / XD
  • Developed desktop and mobile UI component libraries based on design guidelines, including common basic UI components, and provided Vue 2 / Vue 3 / React / Angular / Flutter implementation versions of multiple technology stacks (some technology stacks were not online at the time of publication)
  • Built-in icon library, support custom themes, and built-in two sets of color values, light and dark, easy to switch
  • Officially provides the middle and background admin solution TDesign Starter, beautiful and elegant, suitable for mobile phones, out of the box

tdesign design guidelines

Get started

From the official website of TDesign, you can feel the summary of the design experience from Tencent for many years. It has strong versatility and can help product managers, designers, developers and other roles to efficiently complete the design and development of enterprise-level products.

TDesign's front-end UI component library contains multiple technology stack implementation versions. Even if we use different technology architectures or technology stacks in our project, we can also develop through the TDesign universal design component library. advantages in front-end applications.

tdesign component documentation

The current domestic UI design style is flat. Although TDesign's official website has made a lot of 3D-style promotional animations, the UI is still flat, but it has a strong "Tencent style" and is highly recognizable. The interaction effect is a little bit biased towards Google's Material Design , but it is much simpler, not as complicated as the latter, and quite comfortable to use. Of course, according to the individual needs of different products, TDesign supports the extension of the design style, and summarizes the design style into Design Token, thus forming a set of semantic design specifications within the enterprise, that is to say, it is very convenient to customize the theme.

I have to say that TDesign's documentation is quite well done. The component navigation has graphical thumbnails. The documentation of each component is divided into three parts: "Code Examples", "api" and "Design Guidelines". Great experience. It is said in the circle that you need to look for Alibaba's technology to start a business, and Tencent's products are really not covered.

tdesign component documentation

Middle and background framework TDesign Starter

In the front-end development work, a large part of the UI component library is used for the management background, which is commonly known as the admin framework . TDesign has also produced its own middle and background framework, TDesign Starter, with a very international name.

tdesign middle and background frame

Powerful theme customization, out-of-the-box CLI tools and adaptation to mobile phone screens, rich page cases, TDesign Starter's mid- and back-end system is highly completed, whether it is external appearance or internal code, it hangs a lot of admin frameworks.

tdesign middle and background frame

Recommendations

Although TDesign is backed by big manufacturers, and it seems to have a high degree of completion, it is very good, but as a freshly released, socially oriented open source project, TDesign is still very young, and the currently online Vue 2 version component library is still in beta version. I also saw some comments about performance problems. If you encounter a problem and do not have enough ability to solve it, it is recommended to use TDesign as a study and research first, and wait for it to be used in production projects.

Free Open Source Instructions

TDesign is a free and open source enterprise-level design system officially produced by Tencent. The source code of the UI component library is open based on the MIT open source license , and can be used by any individual and company for free, including commercial use.

Original link: https://www.thosefree.com/tdesign

Guess you like

Origin blog.csdn.net/weixin_45583710/article/details/122686652