Showcase · 你会拿到

一句话 → 可交互的 UI 稿

本课主轴：落地页 · Dashboard · iPhone 原型 · Wireframe
用时：几分钟 / 每类产物
账号：本机 agent · 免 key · 免付费
1一句话描述你想要的界面 → 2你已经登录的 Claude Code / Cursor / Codex → 3四类产物任挑：hi-fi、dashboard、mobile、wireframe
indiemeter/landing-final.png Open ↗
Tile 1 · LandingTask 1 · SaaS 落地页
Hi-fi 落地页 · editorial 大标题 + 定价 + 反白 CTA
IndieMeter landing page sample from the course
1440 × 900desktop PNG
self-contained单文件 HTML
浏览器双击即开无 build step
indiemeter/dashboard-final.png Open ↗
Tile 2 · DashboardTask 1 · 后台 dashboard
后台 dashboard · MRR 折线 + 计划分布柱图 + 付款流水
IndieMeter dashboard sample from the course
1440 × 900desktop PNG
纯 inline SVG图表 · 不引外部库
同品牌 tokens颜色 / 字体一致
stillroom/prototype/*.html · mobile-prototype.png Open ↗
Tile 3 · Mobile PrototypeTask 2 · iPhone 可点击原型 · 4 屏真跳转
iPhone 可点击原型 · Welcome → Pick Vibe → Pick Duration → Play
Stillroom mobile prototype 4-screen composite
4 屏 · 1600 × 844拼接 PNG
真跳转<a href> 相对路径
CSS 呼吸动画Play 屏圆圈
stillroom/wireframe.png Open ↗
Tile 4 · WireframeTask 2 · Mid-fi 线框图
Mid-fi 线框图 · iOS frame 灰阶 + 元素层级 + 流转标注
Stillroom mid-fi wireframe with 4 iOS frames and annotations
1440 × 900desktop PNG
同层名 hi-fi方便对齐
流转 + hitboxocher 注释