Into Design Systems Weekly — Issue #19
Hey Friends, here are our weekly favorites from the #DesignSystem🪐space:
Advanced Figma tips & tricks 2022 — uxdesign.cc
As you all loved Advanced Figma Tips & Tricks Part 1, here is part 2! As usual, Figma did not fail to impress and come out with some fantastic new features and hidden gems hiding in plain sight (and…
Designing Hazel’s Accessible Color System (Part 1) — medium.com
There’s no shortage of articles and videos about designing UI color palettes. You can even use a tool such as Material Design’s Color Tool to create an exhaustive set of harmonious colors. But when…
How to use Figma components to save time and reduce front-end complexity — craft.faire.com
Design components are deceptive. On the front-end, they need to be flexible and easy to use. On the back end, that can lead to a rat’s nest of complexity: a systems designer needs to account for…
Design token thinking — bootcamp.uxdesign.cc
Everybody’s talking about design tokens — how to name them, how to organize them, how to use them, but design tokens aren’t just something that you can easily retrofit into your existing wardrobe…
Video from Into Design Systems #2, 2021
Expectations and responsibilities for design system teams — rishat.us
Part of starting a design system team is hiring. Design system is essentially a platform team, and such team needs people with special skills to be successful. When they get on board, they need a clear set of expectations and a launchpad for their career at the company. The tool
How should you name your colors in a Design System? — uxdesign.cc
Colors are the foundation of any Design System, but naming colors can be a struggle even for experienced Designers. Over six years ago, I created my first Design System and made a color palette to…
Supernova: use design tokens in code, with Figma as a source of truth — Benoit Rajalu — Front-end developer in Nantes — www.benrajalu.net
Design tokens are powerful, but if they remain on Figma they are not doing their job right. Supernova helps us build a solid delivery pipeline to put them ibn our codebase.
Figma: Grid System — www.figma.com
No more searching for the right grid to match your frame size!!! Functions to simplify your grids problems: ✅ Save grid templates with min and max sizes. ✅ Apply auto grids to frames -the plugin detects the frame’s sizes and applies the right grid that you saved as a template. ✅ Show all grid…