SyncingBoard
Stateless, in-place synchronization bridging Figma and Penpot directly to Miro canvases.
Live Product & Repository: Try SyncingBoard for free at syncingboard.com or inspect the open-source codebase on GitHub.
The Architectural Vision
SyncingBoard is an open-source, stateless sync engine designed to solve a persistent friction point in digital product development: the drift between design tools and collaborative whiteboards.
When product, design, and engineering teams collaborate across timezones, Miro serves as the source of truth for stakeholder alignment, flow documentation, and async walkthroughs. However, keeping Miro updated as UI designs iterate in Figma or Penpot traditionally requires manual re-exports, duplicate image uploads, or browser-freezing live embeds.
SyncingBoard eliminates this friction by providing in-place canvas synchronization driven by a privacy-first, serverless relay infrastructure.
Core Architectural Pillars
In-Place Replacement
Tags native Miro item metadata to update image URLs in-place. Board layout coordinates, frame positions, and attached comment threads remain 100% intact.
Multi-Source Engine
Pulls rendered frame batches from Figma REST APIs, Penpot browser companion plugins, and FigJam mirror adapters seamlessly.
Zero-Storage Privacy
Stateless relay architecture. Session keys and tokens expire automatically via 5-minute Redis TTLs. Zero canvas images or user data stored in databases.
Real-Time WebSockets
Token-cached Ably WebSocket channels enable instant, sub-second pairing between design tools and Miro without HTTP polling lag.
Explore the Technical Architecture
Dive deeper into the specific engineering decisions behind SyncingBoard:
- In-Place Engine: How Miro metadata tagging preserves board structure and comment threads.
- Multi-Source Integrations: How Figma REST API batching, Penpot Companion DOM capture, and FigJam adapters operate.
- Serverless Relay Architecture: Breakdown of the Vercel + Ably + Upstash Redis stateless infrastructure.
- Case Study: Penpot Integration: Technical deep dive on Penpot page automation, DOM mounting constraints, and core team API feedback.
SyncingBoard was built under The Studio of Two methodology - pairing human design intent with AI developer agents to ship production software.