00:00

Show and tell for better code

You wouldn't text your intern and have them put up a PR with no context. Why are you expecting different from your AI Agents?

Login with account

Show and tell

Tell a story about your new feature. Show mockups or talk through code. Scope for an AI Agent like scoping for a colleague.

Supports all agents

No need to bring your own API keys or pay for our own agent to implement. Use Codex, Claude Code, Gemini like you normally do.

Organize dependencies

Have a great idea that needs to wait on the first one? No worries, just set up a dependency between the different parts of your project.

Customize spec format

Use our optimized specification format or bring you own. We'll use whatever format you prefer on your future specs.

Quick record

Use our menu bar utility to quickly record and demonstrate what's going sideways. Stay in the flow of testing while building new specs.

Native Markdown

No vendor lockin. You specs are written as regular markdown with image files right on your local disk. Commit them to git to share with your team.

Specs That Work

Record your screen and your voice to create a detailed specification of what you want built. Written by Scaffold and ready to use.

Header Redesign Specification

Problem Statement

The current header section is too verbose and uses excessive purple styling that doesn't align with our brand guidelines.Users are reporting visual fatigue and the messaging lacks focus.

Current Implementation

You can find the current implementation in app/(root)/page.tsx. Modify it there.
<header className="bg-gradient-to-r from-purple-600 to-purple-800">
  <div className="container mx-auto px-4 py-8">
    <h1 className="text-4xl font-bold text-white mb-4">
      Welcome to Our Revolutionary Platform That Changes Everything
    </h1>
    <p className="text-purple-100 text-lg leading-relaxed">
      Experience the future of productivity with our cutting-edge solution 
      that transforms the way you work, collaborate, and succeed in today's 
      fast-paced digital landscape.
    </p>
  </div>
</header>

Proposed Solution

Based on user feedback during screen recording:

  • "This purple is way too aggressive - maybe something more neutral?"
  • "The headline is trying to say everything at once - just tell me what this actually does"
Redesigned header mockup

Cropped screenshot showing current header

Design Requirements

  • Remove all purple gradients and replace with neutral colors
  • Reduce headline from 4xl to 3xl for better readability
  • Limit description to one concise sentence
Goal Recognition

Identified the core issue: 'too verbose and too purple' based on your voice description.

Code Context

Automatically extracted the current header implementation for reference.

Recording quotes

Subjective style feedback directly from your recording. Hybrid of transcript and full prose.

Visual Reference

A picture is worth a thousand words. Thankfully they cost less than 1k tokens.

The Story

I use LLMs every day for coding. They're great at the straightforward stuff: interaction mockups, unit tests, boilerplate. But when there's ambiguity in what I'm asking for, there's a decent chance the code is going to miss the mark.

I usually have a detailed mental model of how I want something implemented. But trying to capture all of that in a text prompt either feels impossible or it takes longer than just writing the code myself. I end up writing too terse of a prompt and almost always have to do a deep refactor.

AI Agents may be a pretty good Junior engineer. But still - you wouldn't text your intern a vague description and expect them to nail it on the first try. You'd sit down together, sketch things out, point at examples in the codebase, walk through the edge cases. AI agents benefit from this same context because of how much RL finetuning rewards them for only doing what you tell them.

That's why I built Scaffold. It lets you show and tell what you want. Click record once, point to things in your app, talk through UI edge cases, and it will write you a detailed Markdown spec you can pass to your favorite agent.

Author

Pierce Freeman

Founder, MonkeySee

Who is Scaffold for?

You work with AI Agents regularly

You use AI tools like Cursor, Claude, or Codex to help build features. You want to give them better context so they can deliver better results on the first try.

You have complex features to build

Your features require careful planning, multiple edge cases, and specific UI/UX considerations. There are cross-feature dependencies that you'd like to lay out.

You enjoy rubber ducking

You enjoy talking through your ideas with a friend or coworker. It helps you clarify your thoughts and find edge cases you might have missed.

Private Beta

1

Sign up for the waitlist

We're capacity constrained but eager to get you into the beta asap. We are looking for a diversity of coding experience from vibe-code-only to learned-assembly-for-fun.

2

Get unlimited free specs

While we're in beta, use our app to generate unlimited free specs. Explore different ways of prompting your coding agents to figure out what works best with your project.

3

Give feedback

Weigh in on how things are working, bugs you find, or general feedback. We'll help you use Scaffold better & help you with your vibe coding projects along the way.

FAQ

Scaffold takes just a few minutes to set up. Simply download the app, grant the necessary permissions (microphone, screen recording, and accessibility), and you're ready to start creating specifications.

Voice to text tools transcribe your words verbatim: every tangent, every mistake, etc. Scaffold relies on your voice narrations but the visual richness of actually stepping through designs, code, and bugs gives our Agent way more context. Because of this context, your specs are generally way more detailed and precise than your verbatim musings. This helps Agents do better work.

Scaffold generates markdown specifications that can be read by all current coding agents. We test extensively with Codex, Claude Code, Gemini, and Cursor. There's no lock in. If you ever want to delete the app, you can still take your specs with you.

Just like recording a screen recording or loom video, we only pay attention to what you're actively walking through. These are uploaded to let some more beefy models write your spec. We also obviously use end-to-end encryption, encrypt on disk, etc. But the real security comes from the fact that we don't index your code in the first place.

Pierce Freeman (@piercefreeman on Twitter or at pierce.dev). I train models and build web apps; this is my first native desktop one in many moons. You can find me building things that make developers' lives easier.