Mosaic

Mosaic is the open paywall platform for native apps: design once, preview across Flutter, SwiftUI and Compose, and ship polished paywalls without WebViews or vendor lock-in.

Comment

Mosaic — The Open Paywall Platform for Native Apps

Mobile developers often build the same monetization interface three times: once in Flutter, once in SwiftUI, and once in Jetpack Compose. They must also handle product selection, localization, accessibility, restore flows, trial messaging, device differences, and repeated design changes. Existing paywall platforms make this faster, but they are generally closed systems that can tie the editor, renderer, billing provider, and customer data to one vendor.

Mosaic takes a different approach.

Mosaic is an open, local-first paywall platform that lets developers design a paywall once and render it natively across Flutter, iOS, and Android. A single versioned Mosaic document is interpreted by three first-party renderers:

  • Flutter widgets
  • SwiftUI views
  • Jetpack Compose components

Mosaic does not use a shared WebView. Each platform renders the paywall using its native UI framework, preserving native accessibility, text scaling, safe areas, right-to-left layouts, animations, and application design-system integration.

The current Build Week project includes a canvas-first Studio where developers can choose a template, inspect a hierarchical layer tree, select elements directly from the canvas, edit text inline, change contextual properties, reorder components, simulate commerce outcomes, and preview the same paywall across different devices and locales.

Studio also supports:

  • resizable and persisted workspace panels
  • contextual component inspectors
  • undo and redo
  • local autosave
  • JSON import and export
  • protocol validation
  • compatibility diagnostics
  • light and dark appearance previews
  • accessibility text scaling
  • right-to-left previews
  • mock products and purchase outcomes
  • live native previews through WebSockets

The editor is local-first, so developers can begin designing and testing without creating an account or connecting a backend. Workspace settings remain separate from the exported paywall document, making the document portable and suitable for version control.

Underneath Studio is a platform-neutral protocol that defines layout, components, localization, commerce references, actions, accessibility metadata, compatibility requirements, and fallback behavior. Shared fixtures and conformance tests help ensure that the same document behaves consistently in Flutter, SwiftUI, and Jetpack Compose.

Mosaic is also designed to remain billing-provider independent. Paywalls reference stable Mosaic products rather than embedding Apple, Google, or RevenueCat-specific concepts into the visual document. This creates a path for RevenueCat, StoreKit 2, Google Play Billing, and custom commerce providers to work through adapters without forcing developers to rebuild their paywalls or migrate their entire monetization stack.

How we used Codex and GPT-5.6

We built Mosaic using Codex with GPT-5.6 as an agentic engineering team.

A root Codex orchestrator coordinated specialized subagents for:

  • product scope
  • UX and information architecture
  • protocol design
  • dashboard development
  • Flutter
  • SwiftUI
  • Jetpack Compose
  • integration quality

Each agent received explicit file ownership, architectural constraints, testing requirements, and phase-specific acceptance criteria. This allowed us to work across several languages and platforms while preserving one shared product model.

Codex accelerated:

  • protocol and schema design
  • cross-platform SDK implementation
  • fixture and conformance-test creation
  • Studio architecture
  • accessibility reviews
  • UX iteration
  • code review
  • documentation
  • regression testing

One of the most valuable parts of the process was using GPT-5.6 to critique the product rather than only generate code. The first working Studio looked like an internal administration panel. Product and UX agents analyzed the workflow, compared it with professional editing tools, identified excessive cognitive load, and helped guide the redesign into the current full-screen, canvas-first workspace.

Human decisions remained central. We selected the product direction, approved the architecture, defined scope boundaries, reviewed every phase, and decided which agent recommendations to accept or reject.

Why it matters

Mosaic reduces the distance between:

“My app is ready”

and:

“My app has a polished, testable, native paywall.”

It gives independent developers and mobile teams the speed of a visual paywall builder while preserving native rendering, provider choice, extensibility, portability, and ownership.

The Build Week version focuses on the hardest foundation: one professional Studio, one open protocol, and three native renderers.

The longer-term vision is to expand Mosaic with remote publishing, product catalogs, placements, commerce adapters, analytics, experimentation, and optional self-hosted subscription infrastructure—without turning the initial developer experience into another complicated billing dashboard.

Built With

Share this project:

Updates