> Markdown version of [/videos/1345-building-collaborative-open-source-tools-for-developers-and-designers-pablo-ruiz-muzquiz-from-penpot](https://www.wearedevelopers.com/videos/1345-building-collaborative-open-source-tools-for-developers-and-designers-pablo-ruiz-muzquiz-from-penpot). Every page supports `.md` or `Accept: text/markdown`. Links point to the HTML versions so they work for humans too. Agent guide: [/agents.md](https://www.wearedevelopers.com/agents.md). --- # Building Collaborative Open Source tools for Developers and Designers - Pablo Ruiz-Muzquiz from Penpot Pablo Ruiz-Muzquiz claims the design-to-code handoff is broken by a fundamental paradigm gap. Discover how Penpot leverages WebAssembly and declarative CSS rules to finally speak the developer's language. - **Speakers:** Pablo Ruiz-Muzquiz - **Event:** Coffee With Developers - **Published:** June 5, 2025 - **Duration:** 56:24 - **URL:** https://www.wearedevelopers.com/videos/1345-building-collaborative-open-source-tools-for-developers-and-designers-pablo-ruiz-muzquiz-from-penpot ## Summary Historically, the handoff between designers and developers has been constrained by a fundamental paradigm gap: design tools enforce imperative control, while code operates on declarative rules. Penpot bridges this divide as an open-source design and prototyping platform built to natively unify both worlds. By bringing declarative capabilities—such as CSS grid and flex layout concepts—directly into the design interface, it speaks the developer's language while delivering the polished, intuitive UX required by designers. This shared open-standard environment creates a genuine single source of truth, effectively eliminating the loss in translation that has long haunted cross-functional product teams. Beyond unifying workflows, Penpot continually pushes technical boundaries to ensure scalable performance. To handle complex canvases with tens of thousands of elements, the platform is transitioning its rendering engine from DOM and SVG to Canvas, WebAssembly, and Rust. On the business side, Penpot champions a unique "Open Nitrate" model. Unlike standard open-core structures, Penpot guarantees its most advanced and powerful feature set is fully open-source by default. The company monetizes by offering enterprise governance—charging organizations that need to control, centralize, or limit user freedoms regarding plugins, onboarding flows, and design systems. While the broader industry rushes toward generative AI, Penpot takes a highly critical, measured stance. Comparing complex UI/UX structures to a photon—needing to be understood simultaneously as both a visual artifact and structured code—the team rejects the "magical wand" of generative text-to-design, which often produces ambiguous, non-compliant code. Instead, Penpot embraces highly contextual machine learning for precise micro-interactions, such as organic component auto-completion and design system refactoring. By focusing on practical utility over hype, Penpot ultimately proves that a transparent, open-source platform can flawlessly align the distinct crafts of developers and designers. **Keywords:** penpot open source, declarative design paradigm, designer developer handoff, open nitrate business model, webassembly canvas rendering, rust for frontend performance, open source design contributions, generative ai limitations, contextual machine learning in design, real-time prototyping software, css layouts in design software, self-hosted design environments, enterprise software governance, ui component refactoring ## Chapters 1. **Introduction to an open source design prototyping tool** (00:01) — Real-time web collaboration platforms enable teams to build software together without losing critical context. 1. **Reconciling imperative and declarative software design paradigms** (02:08) — Conflicting mindsets between visual creatives and structural developers cause friction throughout agile product workflows. 1. **Bringing declarative engineering rules into interface design tools** (04:59) — Introducing native code concepts directly within prototyping environments provides a shared vocabulary for engineering teams. 1. **Encouraging browser workspace adoption among developers and designers** (07:25) — Integrating familiar code syntax alongside an open-source ethos overcomes workflow inertia inside browser environments. 1. **Unifying product developer and visual designer user behaviors** (12:12) — Shared tooling capabilities naturally blend specialized roles and eliminate strict operational boundaries across product teams. 1. **Expanding open source contributions from the creative design community** (13:40) — Delivering polished user experiences shows creative professionals the long-term project value of adopting open standards. 1. **Monetizing open source software using enterprise feature restrictions** (19:10) — Charging enterprises to restrict default application features avoids limiting core software capabilities for individual builders. 1. **Managing open source community technical contributions and architectures** (32:03) — Transitioning legacy browser graphics toward web-assembly systems improves rendering performance and encourages diverse external codebases. 1. **Analyzing the fundamental limitations of generative artificial intelligence** (41:04) — Relying on generic generative tools fails to capture the interactive logic required for functional software interfaces. 1. **Implementing context-aware machine learning capabilities for interaction design** (46:01) — Applying targeted data algorithms streamlines precise interface workflow tasks without removing human creative agency over outputs. 1. **Understanding venture capital influences on the technology hype cycle** (51:07) — Pouring massive financial resources into unproven predictive modeling artificially inflates market urgency without guaranteeing functional workplace solutions. ## Related Moments - [Evaluating AI tooling and design platforms for developers](https://www.wearedevelopers.com/videos/1340-wearedevelopers-live-performance-and-ai-social-media-decline-developer-events-and-more) (from "WeAreDevelopers LIVE - Performance and AI?, Social Media decline, Developer Events and more") - [Audience Q&A on tooling choices and AI application prototyping](https://www.wearedevelopers.com/videos/100195-xcode-development-redefained) (from "Xcode development redefAIned") - [Improving designer and developer collaboration with unified tooling](https://www.wearedevelopers.com/videos/1361-wearedevelopers-live-is-software-ever-truly-accessible) (from "WeAreDevelopers LIVE - Is Software Ever Truly Accessible?") - [Reviewing strategies for scaling collaborative user experience practices](https://www.wearedevelopers.com/videos/194-breaking-down-silos-between-design-and-development) (from "Breaking Down Silos Between Design and Development ") - [Balancing design freedom with framework accessibility restrictions](https://www.wearedevelopers.com/videos/1347-wearedevelopers-live-rendering-in-the-browser-the-state-of-css-and-accessibility-and-more) (from "WeAreDevelopers LIVE - Rendering in the Browser, The State of CSS and Accessibility and more") - [Transitioning from graphic design to large scale frontend architecture](https://www.wearedevelopers.com/videos/100153-microfrontends-lessons-learned-from-growing-a-design-system-and-shared-libraries-across-20-teams) (from "Microfrontends: Lessons Learned from Growing a Design System and Shared Libraries Across 20+ teams") ## Related Articles - [Declarative Design and a fresh take on collaboration with developers](https://www.wearedevelopers.com/magazine/595-declarative-design-and-a-fresh-take-on-collaboration-with-developers) - [Dev Digest 120 - Apple and peers](https://www.wearedevelopers.com/magazine/455-dev-digest-120-apple-and-peers) - [Dev Digest 129 - Now that's what I call private data!](https://www.wearedevelopers.com/magazine/468-dev-digest-129-now-that-s-what-i-call-private-data) - [WeAreDevelopers Dev Digest Issue 116 - The new search wars…](https://www.wearedevelopers.com/magazine/445-wearedevelopers-dev-digest-issue-116-the-new-search-wars) ## Related Jobs - [Senior Web Designer, Growth](https://www.wearedevelopers.com/jobs/ext/102722-senior-web-designer-growth) at **Intercom, Inc.** - [Tribe Lead - ( Software) Engineering Centre of Excllence](https://www.wearedevelopers.com/jobs/ext/1475530-tribe-lead-software-engineering-centre-of-excllence) at **SD Worx** - [Principal Product Manager, Agent Platform](https://www.wearedevelopers.com/jobs/ext/277541-principal-product-manager-agent-platform) at **GitHub** - [Senior Product UI Designer](https://www.wearedevelopers.com/jobs/ext/1998621-senior-product-ui-designer) at **Almedia** - [AI Software Engineer (Germany)](https://www.wearedevelopers.com/jobs/48317-ai-software-engineer-germany) at **Sunhat** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/639235-remote-senior-full-stack-engineer) at **Edge Impulse**