I'll walk you through the first one slowly, then the rest go fast.
Before you start (2 minutes, one time)
You need one thing: a free Claude account. Go to claude.ai, sign up with email or Google, and you're in a chat box. That chat box is all you need for skills 1, 2, 4 and 5.
How to use a prompt from this guide
Click the copy button on the grey box → paste it into Claude → where it says [like this], put your own thing in (or attach your file) → hit enter. That's the whole loop. Every skill below is that same loop with different words.
1 — Screenshot → working app
What it does: you give Claude a picture of any app or website screen, and it builds you a real, clickable version you own.
When I use it: I see a nice pricing page or dashboard layout, and instead of describing it to someone, I just rebuild it.
Step A — ask for it
Take a screenshot of any interface — a website, an app screen, even a photo of a sketch on paper. Open Claude, attach the image (paperclip icon), paste this, hit enter:
Here's a screenshot of a UI. Rebuild it as ONE self-contained HTML file — working buttons, clean modern CSS, responsive. Output only the HTML, then tell me how to open it.
Claude writes a wall of code. Don't read it.
Step B — turn the code into a real file
- Click the copy button at the top of that code block
- Open Notepad (Windows) or TextEdit (Mac) and paste it
- Save it as
test.html— the.htmlpart is what matters- TextEdit on Mac: Format → Make Plain Text first, or it saves wrong
- Find the file and double-click it
It opens in your browser. That's your app — not a picture. You can click the buttons. Send the file back to Claude and say "make the header dark" and it'll change it.
When it goes wrong
You saved it as .txt. Rename it so it ends in .html.
Say: Closer to the screenshot please. Match the spacing, colors and font sizes exactly. It gets better every round. Mine took three tries the first time.
Say continue — it picks up where it left off.
2 — Any website → clean code you own
What it does: takes a page you like and hands you a stripped-down, editable version.
When I use it: I find a landing page with a structure that works, and I want it as a starting template instead of staring at a blank screen.
Step A — ask for it
Copy the page address. (Or open it, select everything with Ctrl+A / Cmd+A, and copy that.) Then:
Here's a web page: [paste the URL or the page text here] Rebuild it as one clean, self-contained HTML file I can edit: inline the CSS, remove trackers and clutter, keep the structure and the copy. Output only the HTML.
Step B — same as before
Copy the code → Notepad → save as something.html → double-click. Now say replace all the text with copy for [your thing] and you have your own page.
When it goes wrong
Don't paste the address. Open the page, select everything, copy, and paste the actual text in.
Expected — the images live on their server, not yours. Ask: replace the images with plain colored placeholder boxes.
3 — Auto-caption a video
What it does: you drop in a raw video, you get it back with captions burned on.
This is the one where Claude Code earns its keep. In the free chat, Claude can only tell you the commands to run. In Claude Code, it runs them, sees the errors, and fixes them itself. Big difference when something breaks — and something will break.
Write me a script that takes a video file, transcribes it with Whisper, and burns clean, styled captions onto it using ffmpeg. I'm on [Windows / Mac] and I've never used a terminal before. Give me the exact commands to install everything and run it, and tell me what each command does in one line.
Then follow its instructions one line at a time.
When it goes wrong
It will. Mine did.
Paste the exact error back to Claude and say I got this error, what now? That's the whole debugging technique. It works better than you'd think.
Tell Claude which step failed and what it said. Don't start over.
This breaks these tools constantly. Move the video to a simple folder like C:\videos\ and rename it test.mp4. I lost an hour to this exact thing.
4 — Notes on autopilot
What it does: any article, PDF, or report becomes something you'll actually read.
When I use it: every time someone sends me a 3,000-word thing and I need the point in 30 seconds.
Attach the PDF, or paste the article text, then:
Here's an article. Give me: a 3-line summary, the 5 key takeaways as bullets, and any action items. Skimmable. No fluff.
Level it up
- Three at once: attach three articles and add
what's the through-line between these?— this is where it stops being a summarizer and starts being useful - Make it stick: add
now quiz me on it with 5 questions, one at a time - Keep your voice: add
write it the way I'd explain it to a friend, not like a report
When it goes wrong
The text didn't come through. Check that your paste included the article body and not just a cookie banner.
Add hard limit: 100 words total. Give it a number and it obeys.
5 — A real app in an afternoon
What it does: an actual working tool, not a demo. Same day.
When I use it: any time I catch myself doing the same annoying thing manually twice.
I want to build [describe your idea in one plain sentence] as a small web app. Act as my engineer: 1) ask me 3 clarifying questions, 2) propose the simplest stack, 3) build it file by file with tests, 4) tell me exactly how to run it. Start now.
Then answer its three questions honestly. This step is the whole trick. People skip it, get something generic, and decide AI doesn't work.
Ideas that actually work as a first build
- a tip calculator that splits by how much each person drank
- a page that turns your reading list into a printable checklist
- a countdown to a date that you can send someone as a link
- a form that turns client answers into a formatted brief
The one rule
Keep version one tiny. Ship something that does one thing. Then add one feature. Every person I've watched fail at this asked for their whole dream app in the first message and got a mess back.
When it goes wrong
Say I'm a beginner. Combine everything into ONE html file I can just double-click.
Open the page, right-click → Inspect → Console tab, copy the red text, paste it to Claude. That red text is the answer.
The technique underneath all five
You may have noticed the prompts have a shape:
Here's my thing → do exactly this → give it to me in this format.
That's it. That's the skill. When a prompt of your own doesn't work, it's almost always missing the third part — you told it what to do but not what you wanted back.
And when the first answer is wrong, don't rewrite the prompt from scratch. Just tell it what's wrong. Too long. Closer to the screenshot. I'm a beginner, simpler. Three rounds of that beats one perfect prompt.