TDesign腾讯企业级设计体系

联合创作 · 2023-09-28 01:05

TDesign 是一款诞生于腾讯内部、拥有完整的设计价值观和视觉风格指南的企业级设计体系,同时提供了丰富的设计资源,在设计体系基础上产出基于 VueReact小程序等业界主流技术栈的组件库解决方案,适合用于构建设计统一/多端覆盖/跨技术栈的企业级前端应用。

产品特性

完整

  • 支持了 Vue 2Vue 3React 和移动端 Vue 3微信小程序 的开发,其他技术栈如 Augular、Flutter 正在开发中
  • TDesign 包含丰富可复用的设计组件资源,如色彩体系、文字系统、动效设计等,覆盖支持 Axure、Sketch、Figma、Adobe XD 等各大产品设计软件
  • 提供辅助设计工具如 Sketch 设计插件,也支持在腾讯 CoDesign、即时设计、Pixso、墨刀等市面常用设计工具中使用

一致

  • 拥有统一的设计价值观视觉风格,帮助产品在跨端设计和开发过程中保持一致的产品使用体验
  • 各技术栈产物 API 定义和实现保持一致,在构建统一/多端覆盖/跨技术栈的前端应用时更有优势

易用

  • 提炼不同业务、场景的设计经验,提供通用的设计指南以降低使用门槛
  • 支持使用者通过 Design Token 对设计风格进行扩展
  • 提供 Starter Kit 帮助使用者快速上手

文档

更多文档在 TDesign 官网

设计指南

TDesign 将腾讯内部多年设计经验提炼总结为专业的设计指南,提供的通用设计解决方案。

更多内容参考每个组件的指南部分,例如:Button

设计资源

为了实现开发与设计之间的高效协同,TDesign 中包含了丰富可复用的设计组件资源:

仓库

TDesign 是一个 multi-repo, TDesign 有如下仓库:

主仓库和通用仓库

仓库 描述 状态
tdesign TDesign 主仓库和文档
tdesign-icons TDesign 公共图标
tdesign-common TDesign 公共样式

桌面端组件库

仓库 描述 状态
tdesign-vue Vue 2.x 技术栈 Beta
tdesign-vue-next Vue 3.x 技术栈 Alpha
tdesign-react React 16.x 技术栈 Alpha
tdesign-angular 基于 Angular 10 实现 待上线

移动端组件库

仓库 描述 状态
tdesign-mobile-vue Vue 3.x 技术栈 Alpha
tdesign-miniprogram 微信小程序 Alpha
tdesign-mobile-react React 16.x 技术栈 待上线
tdesign-flutter 1.17.0 待上线
浏览 11
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报