Into Design Systems Weekly — Design Tokens, Dark Mode, Figma Component Properties & more.
Hey Friends, here are our weekly favorites from the #DesignSystems🪐space:
Component Visual Test Cases — medium.com
Testing isn’t just create an instance, change a label, swap some properties, resize an edge, “Done!” Seriously, ten seconds and you are convinced the next step is to release it? Instead, consider a…
Figma: How to create fluid Typography Scales with Design Tokens — Tutorial with Jan Six — www.youtube.com
🎬 Full workshop Recording: https://bit.ly/figmatokens-workshop
🪄 Plugin: https://www.figmatokens.com
Baseline #8 — Component Properties in Figma — by Joey Banks — joeyabanks.substack.com
…there’s a lot to learn!
Figma component properties — broken logic or new approach? — uxdesign.cc
However, the devil is always hidden in details. So after a few first interactions with new component properties, I see them more like a small improvement but at the same time a huge inconsistency…
Build your team a file automation plugin in Figma — medium.com
Customise my Figma plugin template to make a set of useful automations and links for you and your team. We don’t (yet) have the ability for custom templates in Figma, and as a workaround we have…
How to create Dark mode for your designs in Figma — uxdesign.cc
Currently, most platforms support Dark mode. And, when users switch the mode on their devices they usually expect that all applications will also work in it.
Building a Design System from scratch — blog.maximeheckel.com
A deep dive into my experience building my own design system that documents my process of defining tokens, creating efficient components, and shipping them as a package.
The “dark yellow problem” in design system color palettes — uxdesign.cc
The goal was simple: to define the main colors so that their relative luminances, as defined by WCAG, are close to each other. This way, when designers swap out one status color for another, they are…
Advanced Tutorial: Figma Design Tokens (Superpower) — www.youtube.com
Learn how to start using Figma on an advanced level by using Figma Tokens!Find the course files here:https://github.com/asaadmahmood/youtube_courses/tree/mas...
Brainly’s Approach to DesignOps and our Design Center of Excellence — medium.com
Keeping up with design trends and ensuring that a final product is appealing to our audience can be a challenging task, especially when our service is directed to students, mostly teenagers! That is…
Figma Plugin: A Selector: Find a select what you want — www.figma.com
A powerful tool for finding and selecting elements, you can flexibly cross select various elements by various attributes of the element. Supported languages: Chinese, English, Spanish.