Tools 🛠
Makers • From Figma to site with one click. Fully responsive.
Makers is a Figma Plugin to help you build and publish sites directly in Figma. No code required.
Design for Devs
A framework for creating a predictable & harmonious spacing system for faster design-dev handoff
We already aware of the problem, when positioning elements vertically, the designer has to make decisions that never should be left to chance or be random. Too often, designers rely on vertical increments made possible in Photoshop by holding shift and arrows keys: “I use 5 or 10px, it depends.” This approach is acceptable horizontally, as columns are multiples of 10, but it doesn’t conform to any typographic reality.
Dev for Designers
Let's talk about Native HTML Tabs - daverupert.com
For the past year I’ve been on a team of folks inside Open UI dedicated to figuring out how get a native, accessible <tabs> element into HTML. We’re a team of people with varying backgrounds; spec authors, browser vendors, implementors, and normie practitioners like myself. Open UI is a community group so we can’t technically make HTML (for legal reasons), but we can present research to the W3C working groups. I see Open UI as an ad hoc research arm for the W3C with specific experience in design systems and common web componentry.
Design System 📐
Designing something new with the Atlassian Design System | by Deborah Lindberg
A lot of the time, we’re investigating what products are already doing and testing any system improvements in product screens that have already been designed by product designers. This means we spend a lot of time in Figma evaluating screens for Jira, Confluence, Bitbucket, Trello, etc. We haven’t had much opportunity to design something new with our design system and wanted to see what the experience was like, so we created a design activity for ourselves with the following goals: Test out our components and foundations to experience designing with them. 🧱 Build empathy for designers using the Atlassian Design System. 💙 Have some fun as a team and get creative! 💥
🤍Figma 🤍
Figma Handoff: Why Winning Teams Go Beyond the Inspect Panel | Zeplin Gazette
For many designers using Figma, the process of handing off designs to developers can be painful. Even with Figma’s live collaboration capabilities, the infamous friction between design and development is still a reality for many teams. Why is that? Can’t developers just dive into the Figma file and use the Inspect Panel to get everything they need to convert design to code? Well, not exactly. Over the years the Zeplin crew has talked to thousands of our designer and developer users. Based on what we’ve heard, the three main issues affecting cross-functional collaboration in a design tool like Figma are: • The need for clarity on exactly what to build • A lack of organization and structure • A disorienting workspace for non-designers Let’s look at each of these challenges — and how we see a way forward to a better design delivery process.