Into Design Systems Weekly — Issue #20
Hey Friends, here are our weekly favorites from the #DesignSystem🪐 space:
Atomic 2.0. Revisiting the Atomic Design Method for Design Systems — medium.com
Atomic Design is a great methodology for both design and development that was pioneered by Brad Frost. I’ve found that the hierarchy of elements is often interpreted differently from person to person…
Typography in Design Tokens for Figma and Code — www.marcandrew.me
In this post I share what I’ve learned working on the typography system for Cabana (a design system for Figma built on design tokens).
Live Workshop: Building token-based Design Systems in Figma — Part 2 — intodesignsystems.gumroad.com
Learn how to create and apply Design Tokens in Figma. With Figma Tokens you will be able to easily customize and maintain your Design System and create Themes (e.g Light & Dark Themes) within minutes. Live hands-on workshop designing token-based design systems in Figma utilizing the plugin “Figma Tokens”.
🗓 Date: May, 22nd 2022
⏰ Time: 4PM — 8PM CET
⏱Duration: 4 hours
🙋🏽♂️Workshop facilitator: Jan Six, Creator of Figma Tokens Plugin & Sr. Product Designer at GitHub
Limited spots: 30
Figma Tokens: Component Tokens & Themes Example — www.figma.com
Learn how to build a theme-able or multi-brand design system using Figma Tokens with component specific tokens and multiple semantic layers. Included in this file: One component with component based design tokens2 semantic/theme layers (light/dark mode)A core token layer with option tokensA work…
Build a Design System for an existing product in 4 sprints — uxdesign.cc
The design system is the source of truth for designers and developers, is a live and centralised document where you can find all the necessary styles and components to build a new screen for the…
Putting the system back in our design system — ux.shopify.com
At Shopify we’re designing at scale. There’s currently 2.5 million lines of code in Typescript just for UX within Shopify’s software. That’s not without its challenges. We’ve been finding our design…
Slot Components — How to create them in Figma — blog.prototypr.io
Creating a design in Figma is one thing. The second one is to make it efficient to use. If you want to work faster with your components and UI library, if you’re going to guide other people using…
Design tokens: how we use and automate them at Parimatch Tech — medium.com
Design tokens solve product problems, but they also create them. Here’s our experience at Parimatch Tech: how we use tokens and why we created the Token Master plugin. Design tokens store style…
Wanda Design System — design.wonderflow.ai
Wanda is Wonderflow’s design system
A Ui color palette based on accessibility — medium.com
I want to start off by mentioning that the realization of this has been possible thanks to the joined efforts with the marketing department at TrustYou. And I wanted to give a special thank you to my…
Visual regression testing in Figma — uxdesign.cc
How can we actually manage design systems at scale? Have you ever made (what you thought was) a tiny change and ended up accidentally breaking some other part of your design library? As a developer…
The Future of Design Systems — May 23–25
A Collaboration Matrix — For Design Systems At Scale with Volkswagen
Sandra Schaus, Lead UX Expert Volkswagen Group Services | Consulting
Thorsten Jankowski, User Experience Lead Group IT, Volkswagen AG
Matthias Fritsch, Design System Lead, MAN Truck & Bus SE
From Design Systems to DesignOps: Establishing DesignOps at your org
Michelle Chin — Principal DesignOps Manager, Citrix
How to create a Multibrand Design System for existing products
Kristina Grönboldt — Freelance Design System Lead
Full line-up & tickets:
The Future of Design Systems — Online Conference — May 23–25 2022 — intodesignsystems.com
The Future of Design Systems — 3 days live conference. 12+ speakers, 500+ Design System Friends. Topics: Multibrand Design Systems, Design Tokens, DesignOps. Limited Tickets