I’ve been working in the design systems space for over a decade, for the past several years I’ve been dedicated to solving the problem of multi-dimensional theming. The ability to have several different factors influence the way some experience is finally expressed. My work has been published in an approach (and book) called Mise en Mode.
After getting introduced to the AT Protocol standard, I saw an opportunity to contribute my work such that theming could be shared as data. I have a blog post that goes into more of my thinking behind it.
More importantly for this group, I have a repo for the lexicon with the first PR looking for review. There’s also a documentation site for review as well, which includes a demo page showing the different combinations of scoped theming that could be achieved. I haven’t published the lexicon yet because I wanted to make sure I was heading in the right direction. Please let me know your thoughts.
Looking forward to your feedback and excited to contribute to the community!
Wow, this is very cool! The theming demo is :chefkiss:
I haven’t gone super deep into it, but it feels like our projects could complement each other nicely. Mine does not deal with how tokens are used, just with how they’re written and read.
Super excited to see some movement in the design tooling space in atproto
I’ve been perhaps too deep in this I was a part of the initial DTCG standard from 2020 and since then branched off into significant research and development into what eventually became the Mise en Mode approach.
I think our projects are related but different. In what I’m seeing in your project, it seems to serve the DTCG which would be helpful for teams who are adopting that standard. As shown in your token viewer, there are different sets of tokens depending on the domain, both in name and value. So as long as the app knows the purpose of all of the tokens being served, it’ll be able to use them properly. That’s where my project steps in.
In my project, the tokens being served are a part of the standard such that any site looking to express themselves can do so in the same way because the token names are always the same. For example, if you want to have your own background color for the “primary button”, you’d set the CSS string value for `aspects.color.action.primary.background` which results in a standard CSS custom property --color-action-primary-background that all sites would expect which choose to adopt the standard. This allows themes to be served across domains so that a look can be consistent wherever adopted. The way the values could be mapped in the document could use the DTCG, but because of the flexibility of the naming convention in the DTCG, I found it important to standardize it for consistency.
So, it’s one thing to serve the values. It’s another to provide the standard in which they might be used and further allow expressions to be nested for extended purposes.
I was a part of the initial DTCG standard from 2020 and since then branched off into significant research and development into what eventually became the Mise en Mode approach.