Experiment · 2025
Showing my work deserved a better tool. So I built one.
PWA showcase tool for presenting web apps inside device frames with custom backgrounds and recordings.
Kind
Personal experiment
Stack
Next.js · Tailwind · Canvas API
Status
Live PWA
Year
2025
Why I built it
The itch
Clarity needed to be shown without anyone installing it or opening a raw localhost URL. Screenshots fell flat; screen recordings ran too long.
A PWA should look as good as a native app: device frame, custom background, a demo recorded in seconds.
Nothing did exactly that. So I built one.
What it does
Paste any public URL. Frame Studio loads it inside a device mockup: mobile, tablet, or wide tablet. Choose your background: clean white, grid, dots, or one of six gradient presets. Record a demo or export a still PNG. Copy a shareable link.
That's it. No setup. No account. Just paste and present.
Stack
Next.jsTailwindCanvas APIPWA
Screens
What it looks like
The meta moment
Frame Studio was built to showcase Clarity. Then I used Frame Studio to showcase Frame Studio. Then I used both to build my portfolio.
A tool that builds itself into the story of everything else I've made.
