I have a few ideas for blog posts relating to #DesignSystems & #DesignTokens, but my personal website design is *extremely* crusty and old (still using XHTML!!), so I worry folks might be turned off by that and not read the posts.

Should I...

Benefit no. 1749 of #DesignSystems:
If your company is taken over by megalomaniac who decides on a whim to change the company's name and logo overnight, then it's just a matter of replacing a single SVG file and perhaps a few #DesignTokens and then letting the automated pipelines do their thing.

...features that are unique to that tool.

As we've seem in the vector world, both can coexist.

Perhaps users of, say, Figma or Tokens Studio will maintain a source version of their #DesignTokens in those tools' own formats. But, when it's time to send that token data off to other tools they'll "Export as DTCG..."

Nice summary by @donnie of some of the #DesignTokens formats that are currently out there: https://blog.damato.design/posts/spicy-specifications/

FWIW, an analogy the #DTCG editors have used in the past is vector graphics formats:

The #DTCG format aims to be to tokens what SVG is to vector graphics. Standardised, widely supported as an import/export format and (somewhat) human editable.

However, lots of design tools also have their own, proprietary formats - e.g. Illustrator has .ai files. These may have additional...

It was waaaay overdue, but I finally updated the Universal Design Tokens (UDT) website to explain what my current ambitions for it are: https://udt.design/

#DesignTokens #DesignSystems

It was waaaay overdue, but I finally updated the Universal Design Tokens (UDT) website to explain what my current ambitions for it are: https://udt.design/

#DesignTokens #DesignSystems

Personal life's super hectic at the moment, so I have (even) less time than usual to spend on stuff like the #DesignTokens Community Group (DTCG) spec (https://tr.designtokens.org/format/), Universal Design Tokens (https://github.com/universal-design-tokens/udt/) and massive backlog of things I want to blog or do talks about. So, of you're following or interested in any of those things, your patience is much appreciated!

Does anyone know of any design system token management tools that don't limit your allowed types?

So far ever single one I've tried only allow you to use Hex, RGB, HSL, etc. or some permutation of that.

But I want to be able to use OKLCH or say only store the hue or lightness. And to be clear I'm not just talking about colours I'm talking about all types of tokens. Also, let me make my own custom token types!

Are there any designer friendly tools like this?

#DesignSystems #DesignTokens

24 articles to read through for the next @DesignSysNew email newsletter.

Not signed up yet and want a curated email of the best articles, tutorials, examples, media, and links about Design Systems?

Be sure to sign-up:

https://news.design.systems

🙏🖤

#DesignSytems #WebDev #FrontEnd #DesignSystem #DesignTokens

It's kinda like Tailwind but uses Design Tokens pulled into Style Dictionary to:

- generate a list of utility classes (as shown).
- help generate documentation.
- Sass variables.
- CSS Custom Properties.
- Integrate with Tokens Studio.
- etc. etc.

🙏🖤

#DesignSystems #DesignTokens #CSS #WebDev #UtilityClasses

I'm fun at parties …

#DesignSystems #DesignTokens #CSS

The next Design Systems Open Space is up and this month's topic is the new design tokens format module: What is it? Who's it for? When should we adopt it? What's my name? Who am I?

Grab a free ticket to join us for a chat at 4:30pm on Zoom next Thursday.

#DesignSystems #DesignTokens

https://www.eventbrite.co.uk/e/design-systems-opens-space-7-design-tokens-format-module-tickets-535957221477

🔗 “Can I get an Encore? Spotify’s Design System, Three Years On”

#DesignSystem #DesignTokens

⚓️ https://nicolas-hoizey.com/links/2023/01/13/can-i-get-an-encore-spotify-s-design-system-three-years-on/

Doing research about color lightness stops. The USWDS uses a 0-100 scale, with 0 white and 100 black. They have recommendations on min and max luminance for a "lightness grade" from 5 to 90: https://designsystem.digital.gov/design-tokens/color/overview/ #DesignSystems #DesignTokens #Color #ColorTokens #USWDS

Design Tokens should be synced and used for every design decision you make. Not only UI. PowerPoint presentations, company‘s printer, flyers, ads, PDFs… #designsystems #designtokens

#DesignSystem #Naming is hard. I liked Ardena's simple guide for its focus on 1) states, 2) simple names, 3) logical order. https://backlight.dev/blog/naming-conventions-for-design-systems #DesignTokens #Components #Colors

How I name #DesignTokens and #Components

A brief, but hopefully effective, walk through my process of creating names for my components and all three levels of Design Tokens.

https://bootcamp.uxdesign.cc/my-way-for-naming-design-tokens-and-components-ce10cfa55e22

Design tokens! Why are they more than just variables? Here is a short summary of @jina's video, "WTF are Design Tokens?": https://medium.com/@amster/wtf-are-design-tokens-9706d5c99379 #Summary #DesignTokens #DesignSystems

"The struggle to keep the UI consistent, cross-browser compatible, and accessible is real. ... What we saw fairly early on was [two devs would build out features] and those features would end up on the same page. You could almost tell they were built by two different people. ... Ultimately it came down to leaving too much room for interpretation between design and implementation." https://youtu.be/wDBEc3dJJV8?t=295 #JonLevine #DesignTokens #DesignSystems #a11y

I think, over the upcoming Christmas holidays, I might see how far I can push tags and collections in #eleventy to create a little digital garden or memory palace with #eleventy.

First up would be to work on all of the #DesignTokens links I’ve collected, I reckon.

That way designtokens.info might actually get used 😭