Sketchcoded
Prompts make apps.Sketching makes your vision.
Draw the screens of the app you're imagining. Pin them to a board, tie their logic together with yarn, and write what each part should do in plain words. Click through your sketches like a prototype. A post-it on a frame leaves its design to your agent, so you draw only the pages you care about.
Sketchcoded doesn't build your site. It's the plan your agent builds from, updated live as you both work, so instead of trying to explain that the top-right corner has too much padding, you draw it.
Set up in one prompt.
Loading the setup prompt…
Ramble about your ideas with your agent. It sorts each one into the plan, on the screen it belongs to, and keeps your rules as a checklist that every build is checked against.
Design principles
Here are a few design principles I use myself, and every site made with Sketchcoded follows them by default:
- No cute slogans. LLMs love adding them; one kept trying to put “Ideas, connected” all over this site.
- Every frame has a label, so you can tell your agent exactly what you're working on. And every view has a button that copies a short prompt naming what you're looking at.
- No overlapping boxes. For some reason, LLMs love building sites out of piles of boxes. We explicitly don't.
- Works at every zoom, and at normal zoom the text is comfortable to read.
- The Back button never goes in circles. If I go A → B → C → B → C, the Back button on C takes me to B and then A, not around through C again.
- No tiny text boxes. I hate the tiny boxes on AI-made sites where you can't scroll up to edit a few lines above. Text you write gets a box that grows with it.
- Nothing moves because of a click. Picking a tab or an option never resizes the box around it or shifts the page.
Read about the rest of the design choices on GitHub.