专栏首页TDesign腾讯开源企业级设计体系 TDesign
原创

腾讯开源企业级设计体系 TDesign

TDesign 是来自腾讯内部近 300 名设计师与开发者共同打造,经由 500+ 项目使用、验证和锤炼过的企业级设计体系, 秉承包容、多元、进化、连接的价值观,TDesign 期望与用户、行业及合作伙伴等一起打造具有竞争力的产品体验。

从设计出发,TDesign 提供了完整的设计语言、视觉风格指南和设计资源,以及基于 Vue2、Vue3、React (Vue3、React 目前仍在 Alpha 版本迭代中)等业界主流技术栈的组件,帮助开发者可以快速开发桌面端、移动端和小程序端等多个版本的应用程序。

如果你对于 TDesign 感兴趣,可以打开 TDesign 官网,体验 TDesign 。如果你对 TDesgin 诞生的历史感兴趣,不妨来看看 TDesign 诞生背后的故事。

一、腾讯开源协同,TDesign 成长的土壤


自 2019 年开始,腾讯正式宣布在内部推行开源协同,鼓励所有源代码对公司内部全部开放,共同协作。

也正是这样的开源协同的背景,使得腾讯的设计师和开发者们思考到:“有没有可能通过开源协同,解决过去腾讯内部团队分别维护设计体系,各设计体系之间质量参差不齐的问题”。出于这样的目的,在腾讯内部建立起了开源协同团队,来共同思考和研究这个问题,在 2020 年 2 月份,通过多次远程会议,确定了 TDesign 的产品目标和技术路线,并在全员的参与下共同投票选出 TDesign 的名字。

但 TDesign 应该是什么样的设计体系?

设计师们找到了答案:TDesign 应当是一个拥有包容、多元、进化、连接的价值观,期望为用户、行业及合作伙伴等打造具竞争力的品牌与产品体验的设计体系。

  • 包容,是为了让 TDesign 兼容并蓄,既能满足当下需求,也能应用于更广泛场景;
  • 多元,是 TDesign 应当能够赋能不同业务,探索无限可能;
  • 进化,是 TDesign 应当成为一个动态的设计体系,在“以用户价值为依归”的基础上,成长进化;
  • 连接,是 TDesign 需要用最大的努力去连接赋能,联动融通。

有了目标和价值观,TDesign 也真正开始进入落地的阶段。

二、从协同到开源,TDesign 成长的历程


在项目刚刚落地时,通过内部发起的贡献者招募,大批设计师和开发者带着原有业务组件的经验、成果和满腔的热血,在很短的时间内产出了大量的设计稿和组件,完成了项目的初始化建设。但因为对跨技术栈维护组件库的复杂度认识不够,各个框架中对同一组件的文档和 API 实现都有差异,用户使用组件库体验不一致的问题,一直困扰着 TDesign 团队。

为了解决协作的问题,TDesign 在进行第二期迭代时,通过一系列工具和工作流程来规范组件的开发过程,选择更加开源风格的异步 issue 讨论,开发了工具来自动生成各个框架的 API 定义和描述文档,引入 CI / CD 流程来降低人工参与的比率,从而减少因为人而犯错的可能。通过引入机器人的方式,来提升信息推送的效率,让每一个人都可以时刻知道什么事情是需要做的,什么事情是不需要做的。借助于这些更加“开源”风格的工具和协作方式,TDesign 的效率得以提升,让 TDesign 在进行二期开发时,比预期更快地完成任务。

借助于异步和聚焦的讨论方式,问题可以被更加深刻地讨论和思考,从而更容易得出一个符合预期的结论,在开发时能够以更高的效率完成组件的封装和代码的编写。也正是这样更加开源的方式,最终构建出了如今的 TDesign。

三、从设计到研发,TDesign 的特性有哪些?


作为一款企业级设计体系,TDesign 的特性可以总结为如下三点:

1.完整:完整的技术、设计资源,将设计与开发者从重复劳动中释放出来

TDesign 为开发者提供了多种主流开发技术栈的支持:TDesign 已经支持了 Vue2、Vue3、React 和移动端小程序的开发,其他技术栈如 Angular、Flutter 也有相应贡献团队正在开发。

为了实现开发与设计之间的高效协同,TDesign 中包含了丰富可复用的设计组件资源,如色彩体系、文字系统、动效设计、图标元素、布局结构等,覆盖支持 Axure、Sketch、Figma、Adobe Xd 等各大产品设计软件,将设计和开发者从重复劳动中释放出来。

除了常规设计资源,TDesign 还提供了辅助设计工具如 Sketch 设计插件,也支持在腾讯 CoDesign、即时设计、Pixso、墨刀等市面常用设计工具中使用 TDesign 设计物料。

2.一致:一致的设计和开发体验

TDesign 将腾讯内部多年设计经验提炼总结为专业的设计指南,其所提供的通用设计解决方案,能够帮助产品经理、设计师、开发者等角色高效完成企业级产品的设计和研发,并保持设计语言和风格的一致,满足用户体验的要求。

基于 TDesign 的设计体系规范,TDesign 同时上线了组件库的桌面端和移动端,提供了多个技术栈实现版本。通过一系列协作流程和辅助工具,保证各技术栈组件 API 和实现产物一致。借助这些能力,使得项目即便使用了多种不同的技术架构或技术栈,开发者也可通过 TDesign 通用设计组件库进行开发,显著降低学习成本,在构建统一/多端覆盖/跨技术栈的前端应用时更具优势。

3. 易用:清晰的设计指南和开箱即用的解决方案

TDesign 设计体系在形成过程中,提炼了不同业务、场景的设计经验,提供了通用的设计指南以降低使用门槛。对于不同企业产品的品牌定制需求,TDesign 支持使用者对设计风格进行扩展,目前已经将设计样式梳理归纳为 Design Token,形成一套企业内部的语义化设计规范,方便后续进行统一的管理和使用扩展。

在主题配置方面,TDesign 提供了明亮和暗色两种模式,支持一键切换,提升用户的使用体验。后续,TDesign 还会推出针对于不同垂直领域的行业组件,覆盖更多的业务范围。产品团队可以借助内置的行业主题,快速配置对应需求,启动业务开发。

TDesign 同步上线了一款开箱即用的中后台框架 TDesign Starter Kit ,开发者可以通过它快速体验组件功能,也可以将它修改为项目基础脚手架工程,快速实现从 0 到 1 的产品开发上线。

四、从过去到未来,TDesign 还将做些什么?


通过开源,TDesign 期待持续打磨出更加完善易用的组件库,包括在国际化、无障碍和适老化方面有更成熟的解决方案,对更多的产品和使用者有帮助。

借助社区,TDesign 期待与更多产品设计师和开发者有专业交流,甚至是收获一个积极活跃的 TDesign 社区。

非常期待你对 TDesign 的持续关注和反馈意见。更欢迎同道中人的你参与 TDesign 的开源共建,与 TDesign 从开源到更加成熟的旅程中一起进步。

五、如何体验 TDesign ?


您有两种方式使用或体验 TDesign:

六、致谢


  • 感谢参与 TDesign 的近 300 名同学的支持,在 TDesign 从 0 到 1 的过程中贡献了宝贵的经验、代码、组件、文档、建议等等所有的付出,使 TDesign 得以起步,得以服务用户;
  • 感谢腾讯内部开源协同的文化和技术委员会的机制,让 TDesign 得以在企业内部孵化孕育,让 TDesign 凝聚满腔的热血;
  • 感谢开源的前行者,为 TDesign 的发展提供了理论和实践上的参考和各类开源工具的帮助;
  • 感谢 InfoQ、CSDN、开源中国、51CTO、人人都是产品经理、优设网 等平台以及 前端之巅、前端早读课、前端大全、web前端开发、前端新世界、前端大学、龙爪槐守望者等自媒体,让 TDesign 可以为更多人所知。
  • 感谢所有 TDesign 的使用者和关心者,你们是 TDesign 的启明灯,指引 TDesign 的前进方向,TDesign 与大家共成长。
图为 TDesign 的贡献者们

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 腾讯开源企业级设计体系 TDesign

    本文约3200字 预计阅读时间:8分钟 TDesign 是来自腾讯内部近 300 名设计师与开发者共同打造,经由 500+ 项目使用、验证和锤炼过的企业级设计体...

    腾源会
  • 腾讯开源企业级设计体系 TDesign

    TDesign 是来自腾讯内部近 300 名设计师与开发者共同打造,经由 500+ 项目使用、验证和锤炼过的企业级设计体系, 秉承包容、多元、进化、连接的价值观...

    腾讯大讲堂
  • TDesign 正式开源发布,腾讯设计云布局重要能力拼图!

    随着互联网的快速发展,产品规模和功能日益增加,开发场景变得愈发复杂,传统的设计研发模式已经不足以支撑业务的高速扩张。无论是互联网公司还是传统软件企业,大家都在寻...

    Ryanllian
  • 腾讯企业级设计体系TDesign对外开源,为产品体验设计提供新的解题之道

    12月23日,腾讯宣布企业级设计体系 TDesign 正式开源。 作为一款诞生于腾讯内部开源、经过超500项内部业务检验的企业级设计体系,TDesign 汇集了...

    腾讯开源
  • N 年沉淀,腾讯这套系统终于开源!

    大家好,我是鱼皮,前段时间给大家介绍了字节跳动开源的两套设计系统,分别是 Arco Design 和抖音 Semi Design。

    程序员鱼皮
  • “星·园计划”网络安全专场:安全专家齐聚苏州畅谈“等保2.0”

    投入数亿资源扶持全国30万中小企业的腾讯云“星·园计划”,同样关注企业在数字化转型之路上的安全建设。

    腾讯云 星园计划
  • 助力实用型高新人才培养 腾讯云召开1+X证书试点工作线上说明会

    3月31日,由腾讯云主办的“1+X职业技能等级证书试点工作线上说明会”在云端召开。未来,依托腾讯在云计算、界面设计等方面的技术优势和实践经验,腾讯云将以“云服务...

    鹅老师
  • 新基建下的云计算与开源社区新发展云论坛成功举办,腾讯云TStack助力行业生态体系建设

    点击上方“腾讯云TStack”关注我们,获取最in云端资讯和海量技术干货 2020年9月2日,新基建下的云计算与开源社区新发展云论坛在北京圆满闭幕。本场论坛由...

    腾讯云TStack
  • MEET教育科技峰会终身教育分论坛召开 大咖云集共建职业人才培养数字“立交桥”

    4月20日,腾讯教育第二届MEET教育科技创新峰会在北京举行。在终身教育专场上,广东省人力资源和社会保障厅二级巡视员刘正让,人力资源和社会保障部中国就业培训技...

    鹅老师
  • 腾讯云加速构建云原生数据仓库,助力企业数字化转型

    在企业数字化转型的当下,数据仓库的云端构建成为主流趋势,Gartner 预测,到2023年全球3/4的数据库都会跑在云上。

    腾讯云大数据
  • 腾讯云加速构建云原生数据仓库,助力企业数字化转型

    在企业数字化转型的当下,数据仓库的云端构建成为主流趋势,Gartner 预测,到2023年全球3/4的数据库都会跑在云上。 12月20日,腾讯2020 Tec...

    腾讯QQ大数据
  • 升级为私有全栈云的腾讯云TStack究竟强在了哪儿?

    戳蓝字“CSDN云计算”关注我们哦! 在刚刚结束的美国丹佛Open Infrastructure峰会上,腾讯云对全新升级为私有全栈云的TStack进行了详细的...

    腾讯云TStack
  • 聚焦新基建,腾讯云十余项自研技术应用集中亮相

    创立已有22年的腾讯,究竟积累了多少自研的技术? 从数据中心和网络建设,到数据库、存储、大数据等,伴随着业务的不断发展,腾讯在技术上也有了深厚的积淀。无论是...

    腾讯技术工程官方号
  • 从IaaS到SaaS,腾讯二十年自研技术云上集结

    导语 创立已有22年的腾讯,究竟积累了多少自研的技术? 从数据中心和网络建设,到数据库、存储、大数据等,伴随着业务的不断发展,腾讯在技术上也有了深厚的积淀。无...

    腾讯数据中心
  • 升级为私有全栈云的腾讯云TStack究竟强在了哪儿?

    在刚刚结束的美国丹佛Open Infrastructure峰会上,腾讯云对全新升级为私有全栈云的TStack进行了详细的介绍,引起峰会现场众多OpenStack...

    腾讯技术工程官方号
  • 小熊U租荣获AAA级企业信用等级认证|腾讯SaaS加速器·学员动态

    来源|腾讯SaaS加速器二期项目-小熊U租 ---- 近日,小熊U租(腾讯SaaS加速器二期学员)正式通过国家资信评估机构3A级资信等级认定。 AAA级为企业...

    腾讯SaaS加速器
  • 腾讯开源全景图再刷新:社区贡献领跑国内企业,获超过38万开发者关注

    11月4日,2021腾讯全球数字生态大会TechoDay技术峰会在武汉召开,腾讯首次披露了在5大技术领域的开源新进展,并回顾了腾讯开源的四大变化。 腾讯公司副总...

    腾源会
  • 腾讯开源全景图再刷新:社区贡献领跑国内企业,获超过38万开发者关注

    11月4日,2021腾讯全球数字生态大会TechoDay技术峰会在武汉召开,腾讯首次披露了在5大技术领域的开源新进展,并回顾了腾讯开源的四大变化。 腾讯公司副总...

    腾讯开源
  • 促进电竞行业高质量发展,腾讯课堂开展电子竞技职业技能等级认证服务

    近日,中国队EDG以3:2取得《英雄联盟》S11总决赛冠军,引爆了微博热搜和朋友圈。四年内,中国战队四进决赛,三次捧杯,不仅为中国电竞争得了荣誉,也推动了中国...

    鹅老师

扫码关注云+社区

领取腾讯云代金券