sherizan

Proto — AI skill for Claude Code

AI community

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)

[![create-proto on npm](https://img.shields.io/npm/v/create-proto?label=create-proto)](https://www.npmjs.com/package/create-proto) [![@sherizan/proto-cli on npm](https://img.shields.io/npm/v/@sherizan/proto-cli?label=%40sherizan%2Fproto-cli)](https://www.npmjs.com/package/@sherizan/proto-cli) [![License MIT](https://img.shields.io/badge/license-MIT-blue)](LICENSE)

Demo

[![Watch the demo on YouTube](https://img.youtube.com/vi/_srHicLflms/maxresdefault.jpg)](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.