We're sunsetting PodQuest on 2025-07-28. Thank you for your support!
Export Podcast Subscriptions
Episode 292: Using Tokens in Design Systems with Jan Six
2025/3/28
UI Breakfast: UI/UX Design and Product Strategy
J
Jan Six
Jan Six: 我在设计领域的工作经历，从机构到创业公司，再到GitHub，让我深刻理解了设计系统的重要性。在创业公司，我亲身经历了设计与工程团队协作的挑战，这促使我创建了Token Studio插件，旨在简化设计token在设计工具中的使用。我发现，设计token能够有效提高设计效率，并确保设计的一致性。在GitHub，作为设计系统的使用者，我体会到一个完善的设计系统能够带来的便利和效率提升，同时也认识到设计系统维护和推广的挑战。
我创建Token Studio的初衷是希望能够在设计工具中更方便地使用设计token，并根据不同的平台调整设计外观。最初的插件非常简单，但随着时间的推移，它不断发展壮大，并最终形成了一个由专业团队维护的平台。
Figma引入变量后，Token Studio插件的功能部分被替代，因此我们将其发展成面向更复杂需求的设计系统维护工具。我们的长期目标是创建一个通用的设计token格式，能够在不同设计工具之间无缝衔接，从而减少手动操作，提高效率。
设计系统可以从小处着手，逐步完善。设计token是构成设计系统的原子单元，可以定义颜色、字体、间距等各种设计决策。通过定义设计token，可以减少设计过程中的猜测，提高一致性。
在设计系统中，组件和token之间存在技术关联。token可以定义组件的样式属性，例如按钮的背景颜色。我们可以创建不同级别的token，例如全局token、组件级别token等。
设计系统的成功关键在于公司范围内的采用，否则会降低效率。在GitHub，我作为设计系统的使用者，体会到一个完善的设计系统能够带来的便利和效率提升，同时也认识到设计系统维护和推广的挑战。
对于没有设计系统的公司，我建议从小处着手，例如先定义调色板，再逐步完善组件库和文档。并尽可能自动化设计系统与代码的同步过程。好的设计系统文档应该易于访问，并能满足团队的需求。
Jane Portman: 作为节目的主持人，我主要负责引导访谈，并就设计系统相关话题与Jan Six进行深入探讨。我关注设计系统在实际应用中的问题和挑战，例如设计系统在不同团队中的采用率，以及如何改进设计系统以提高效率。
Deep Dive
Shownotes Transcript