gambaran-mcp
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@gambaran-mcpCreate a device mockup of my app screen in a Pixel 8 frame"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
gambaran-mcp — source
The MCP server published to npm as gambaran-mcp,
together with the rendering engine it is built on.
claude mcp add gambaran -- npx -y gambaran-mcpPath | What it is |
| The MCP server. Tool reference and examples in its own README. |
| The mockup engine — device catalog, layout geometry, motion, and the imperative Skia renderer. Shared with the Gambaran app. |
| The 26 device frames. |
| The generator that produces those frames, and their provenance |
Build
npm install
npm run buildRequires Node 20 or newer. The build writes packages/mcp/dist, which is what
the npm package ships.
Related MCP server: remotion-vision-mcp
Where development happens
This repository is exported from the Gambaran monorepo, which also holds the app itself. The paths above are preserved exactly as they sit upstream, so the sources here are byte-identical to the ones the published package is built from. Issues and pull requests are welcome here.
Licence
MIT © Aizz Tech Solutions. The device frames are original work generated by
tools/frame-renderer; see tools/frame-renderer/NOTICE for how they are
produced and why they are redistributable.
This server cannot be deployed
Maintenance
Related MCP Connectors
Create app-store screenshots, social graphics, promo videos, and animated device mockups.
Generate designed, localized App Store screenshot sets from your raw app captures.
Drive real devices from your AI Coding tool. Embed a client SDK (Unity, Godot, Flutter, iOS/macOS, Android, React Native, Web) in your app, then capture screenshots, traverse the UI tree, inject taps and key events, and run automated test tasks on the physical device over a secure relay.
Control real Android and iOS devices with LLM agents — tap, swipe, type, automate flows.
Related MCP Servers
- AlicenseAqualityDmaintenanceTurns text prompts into premium iOS UI mockups (PNG + HTML). Powered by Claude + a Playwright headless renderer. Two backends: local claude CLI (uses your Claude Code subscription) or the Anthropic API.44MIT
- FlicenseNot gradedqualityCmaintenanceEnables agentic vision loops for Remotion by providing tools to discover projects, list compositions, take screenshots, and render storyboards, returning images for model evaluation.-
- FlicenseAqualityBmaintenanceEnables AI coding agents to test and automate Android apps rendering UI in OpenGL/Vulkan/Metal surfaces via screenshot-based vision tools for tapping, swiping, long-pressing, and recording, without accessibility tree dependency.92-
- AlicenseNot gradedqualityCmaintenancestdio bridge to the hosted ScreenMocks MCP server: design and export localized App Store / Play Store screenshots — device frames, 3D mockups, text, per-locale overrides across 48 locales, and a measured layout report the agent can verify its design against.MIT