Proto — AI skill for Claude Code
Prototo: the AI-native prototyping tool for designers.
How to install Proto
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open sherizan/proto and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Proto does
Prototo: the AI-native prototyping tool for designers. Describe a screen, see it render as a real native iOS app. No canvas, no IDE, no code. Works with Claude Code and Codex.
Alternatives in AI
- AIHawk — Open-source AI browser agent: describe any task in plain language and it autonomously browses, clicks, types a 30.3k ★
- Open Knowledge — Beautiful, AI-native markdown IDE and LLM wiki 3.7k ★
- Vibeproxy — Native macOS menu bar app to use your Claude Code & ChatGPT subscriptions with AI coding tools - no API keys n 3.3k ★
README
Prototo
██████╗ ██████╗ ██████╗ ████████╗ ██████╗ ████████╗ ██████╗
██╔══██╗██╔══██╗██╔═══██╗╚══██╔══╝██╔═══██╗╚══██╔══╝██╔═══██╗
██████╔╝██████╔╝██║ ██║ ██║ ██║ ██║ ██║ ██║ ██║
██╔═══╝ ██╔══██╗██║ ██║ ██║ ██║ ██║ ██║ ██║ ██║
██║ ██║ ██║╚██████╔╝ ██║ ╚██████╔╝ ██║ ╚██████╔╝
╚═╝ ╚═╝ ╚═╝ ╚═════╝ ╚═╝ ╚═════╝ ╚═╝ ╚═════╝
**Describe a screen. Watch your prototype run natively on iPhone.**
Prototo is the AI-native prototyping tool for designers. Designers describe what they want; native iOS UI appears in the Simulator, with Apple's real Liquid Glass on iOS 26+. No canvas. No IDE. No engineering.
[prototo.app](https://prototo.app) · [create-proto on npm](https://www.npmjs.com/package/create-proto) · [@sherizan/proto-cli on npm](https://www.npmjs.com/package/@sherizan/proto-cli)
[](https://www.npmjs.com/package/create-proto) [](https://www.npmjs.com/package/@sherizan/proto-cli) [](LICENSE)
Demo
[](https://youtu.be/_srHicLflms)
Quick start
npm create proto@latest myapp
That's it. The iOS Simulator opens with a Welcome screen. In another terminal:
cd myapp && claude
Then describe what you want. Example:
> add a liquid glass bottom tab bar with Home, Explore, Library, Profile tabs
Claude Code generates `app/_layout.tsx` using Apple's native `UITabBar` (via `expo-router/unstable-native-tabs`). Metro hot-reloads. The Simulator updates instantly with a real refractive Liquid Glass tab bar and SF Symbol icons — no engineering needed.
Note: the npm package is `create-proto` (and the CLI bin is `proto`) for historical reasons.
Related Skills
Quilt
AI-native infinite-canvas design tool: describe an app, get multi-screen HTML designs on an infinite canvas, c
AgentPilot
LLM-powered macOS computer control. AgentPilot lets AI agents see your screen, move the mouse, type text, pres
Gentle Agent State
See which AI coding agent needs you — right in your tmux tab bar. A colored dot per window (working/blocked/id
Klaudimero
Self-hosted AI assistant service and native iOS/macOS app powered by Claude Code — streaming chat, scheduled j
Herdeck
Control panel for AI coding agents running under herdr — on a hardware Stream Deck (Ulanzi D200 or Elgato), a
Paseo Canvas
Live-render, share and send-to-chat everything your AI agents build — a Paseo plugin
Related Agents
Decision Journal Exporter
Exports a cycle's design decisions to a read-only shared journal (Notion/Confluence) so PMs, designers, and st
49agents
49Agents bills itself as the first 2D agentic IDE — all agents, all terminals, all projects, all machines, one
Proto Builder
Upgrades ONE screen of the generated prototype skeleton to a higher-fidelity static HTML page. Give it the scr