figma-plugin

2 posts

figma

Behind the plugin: Cards for Humanity | Figma Blog (opens in new tab)

Cards for Humanity is a Figma plugin and website that helps teams practice inclusive and accessible design through an online card game. Players combine character cards with needs, disabilities, or challenges, then discuss how to design products for that person. The Idean team found that the tool makes difficult conversations about inclusion more tangible and encourages empathy-driven design. ## How the Game Works - Players pair two card types: - A character card with a name, age, and personality trait. - A card describing a need, disability, or personal challenge. - Clicking a card reveals written considerations to reduce assumptions about different experiences. - Its open-ended format supports workshops, brainstorming, and informal accessibility discussions. - The game puts people at the center of the design process rather than treating accessibility as an afterthought. ## Designing an Inclusive Tool - The team began with internal research, asking colleagues whether they would share personal traits or disabilities. - They expanded the card content through feedback from the wider product community. - Making the tool itself accessible proved challenging, requiring continuous listening and iteration. - The audience became broader than expected, including lawyers, gamers, clinicians, and educators—not just designers and developers. - This reinforced the importance of plain language, avoiding jargon, and designing for audiences beyond the expected user group. ## Balancing Internal Work and Client Priorities - Agency teams must balance billable client work with internal projects that have less obvious short-term ROI. - Idean viewed inclusive design as directly connected to better products, stronger outcomes, and happier clients. - Team members contributed both allocated work time and personal effort because of their commitment to the project. - The tool became part of the agency’s client process, potentially extending its impact across the products those clients create. - The team argues that inclusion should be understood not only as a business benefit, but also as a social responsibility. ## Starting the Conversation - Cards for Humanity is not prescriptive; simply discussing the cards can open conversations about accessibility. - The tool helps teams move from abstract intentions to concrete questions about people’s needs. - Its central purpose is to build empathy and make inclusive design a regular part of product development. Teams can use the plugin or website as a practical starting point for discussing accessibility, inclusion, and the responsibility designers and developers have toward diverse users.

figma

Bridge design and development with the new Zeplin integration | Figma Blog (opens in new tab)

Figma and Zeplin introduced a redesigned native plugin to improve design-to-development handoff. The integration lets teams export Figma frames, components, colors, and text styles directly to Zeplin, where developers can generate specs, assets, and code snippets. Rebuilt for better performance and maintainability, it addresses issues with large files and high-resolution exports while opening the door to automatic component updates. ## A Growing Design-to-Development Workflow - Zeplin provides advanced handoff features and acts as a bridge between designers and developers. - The original Figma integration launched before Figma officially launched. - More than 300,000 Figma files were exported to Zeplin each month, with usage increasing by 30–40% during the shift to remote work. ## Rebuilt as a Native Plugin - The second-generation integration was rebuilt from the ground up as a native Figma plugin. - This creates a more seamless export experience for users. - It also makes the integration easier for Zeplin to maintain and extend with new features. - Performance problems affecting large Figma files, frames, and export resolutions were addressed. ## Exporting Designs and Generating Handoff Materials - Users can export: - Frames - Components - Color styles - Text styles - In Zeplin, product teams can automatically generate: - Accurate design specifications - Assets - Code snippets - Exported assets can also appear directly in Zeplin style guides. ## Future Possibilities - Figma’s web-based architecture offers advantages over integrations with other design tools. - Zeplin was exploring automatic synchronization, allowing changes to Figma components to be pushed to Zeplin without manual exports. - Users could install the plugin through the Figma Community, and Figma customers were offered three free months of Zeplin’s Organization plan. The new plugin is recommended for teams seeking a faster, more reliable handoff between Figma and development, especially when working with large files or shared design systems.