- From: Maneesh via GitHub <sysbot+gh@w3.org>
- Date: Fri, 17 Jul 2020 14:51:35 +0000
- To: public-design-tokens-log@w3.org
Hi everyone, I really like the idea that @oscarotero proposed. Something that I think is worth defining and perhaps naming is that some of this specification will detail a fixed set of options, and the rest will detail how those options are composed. I think this is where the discussion around variable and css custom properties are heading as well. I find this very similar to the distinction Brad Frost makes in [Atomic Web Design](https://bradfrost.com/blog/post/atomic-web-design/) between atoms and molecules. Atoms are basic building blocks. In our use case, the defined options or definitions: ```css colors { primary: rgba(233 2 0 0.3); secondary: #333; } sizes { small: 14px; medium: 20px; } font-families { heading: Hoefler Text; display: Inter; } ``` While molecules are groups of atoms combined together. In our case, the compositions which could use the previously defined options: ```css typography { main { font-family: $font-families.display; font-size: $sizes.medium; color: $colors.primary; } } ``` I think this distinction is worth noting and naming because generating new compositions do not necessarily require new definitions, or we may choose that definitions are not required at all: ```css typography { main { font-family: Inter; font-size: 20px; color: rgba(233 2 0 0.3); } } ``` Though I think there are advantages beyond [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) that definitions/options/variables solve; - They allow an aspect of a Design System to be fixed and versioned. You could generate new compositions without adding to the definitions. - They allow for Human and Machine readable audits of what is in the system - They open a way for tools to report which definitions are used and which are not - Definitions could be shareable (if the syntax is fixed) so that an existing composition could inherit a from new definitions easily - Overrides from the definitions would need to be explicit -- GitHub Notification of comment by ManeeshChiba Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/1#issuecomment-660150355 using your GitHub account
Received on Friday, 17 July 2020 14:51:37 UTC