用AI 20分钟搭建定制健身应用，告别电子表格拼凑

从电子表格拼凑到定制软件的机会

几乎每家小微企业的后台流程都乱成一团：电子表格、Notion 页面、Google Drive 文件夹、发票工具，还有各种零散的软件订阅，全都拼凑在一起才能勉强跑通一个业务流程。过去企业只能反过来迁就工具，调整自己的运营方式；而现在，借助 AI 编程工具，我们可以反过来——根据企业的实际运作方式，专门为其定制软件。

B站UP主 Kyle Skelly 以「在线私人教练」为例，演示了如何用一条提示词、约 20 分钟时间，搭建出一套一体化管理系统。他强调，具体行业其实不重要，这套流程几乎适用于所有后台流程混乱的企业。对企业主而言是降本增效，对设计师和开发者而言则是一门可复制的服务生意。

第一步：把混乱的口述整理成高质量提示词

开发的起点不是写代码，而是「对话」。作者习惯打开 ChatGPT 或 Claude，直接口述自己想实现的所有需求：一个能统筹在线私教业务的一站式平台、一个显示当月进账的仪表盘、一个存放非公开 YouTube 链接的健身视频库、能把视频分配给特定客户的能力等等。

这个口述过程「其实挺乱的」，充满行话和跳跃。但关键在于，让 AI 把这些零散描述转化成两样东西：一段结构化的提示词，以及一份详细的分步行动计划。如果手头已有客户规格文档，也可以直接喂给模型。这一步的本质，是把模糊的业务需求「翻译」成机器可执行的规格。

20分钟生成可运行原型

拿到提示词后，搭建方式有多种选择：可以留在 ChatGPT 里用 Codex，也可以用云端的 Claude Code。作者这次选择后者，套餐为每月 100 美元，但他明确指出每月 20 美元的套餐同样能完成，只是可能要多等几次 5 小时额度重置。

实操上，他把提示词贴入后，要求先用纯 HTML 生成原型，方便快速调整流程和设计，数据先用占位符代替，模型选择保持高设置。Claude 运行约 20 分钟后，一条提示词就产出了完整的仪表盘、客户列表（含目标与训练计划）、动作库、训练计划编排、客户进度追踪，以及收入与付款概况页。

这套原型把电子表格、Notion、发票追踪器该干的活基本都覆盖了——而这次工作只消耗了 5 小时使用限额的 8%，意味着后续还有大量优化空间。

借助 Mobbin MCP 快速重构界面

原型功能齐全，但界面往往还需要打磨。作者介绍了本期赞助商 Mobbin 的用法：它收录了全球顶尖公司超过 62 万个界面、12 万个流程的设计模式。

通过 MCP（Model Context Protocol），可以在 Claude、Codex 等工具里点开自定义连接器，输入 mobbin 直接接入智能体。这样不用离开开发环境，就能让智能体调用 Mobbin 素材库搜索仪表盘设计灵感。作者演示了搜索「简洁干净、配色雅致」的仪表盘，找到了来自 xAI、Fireflies、Copilot 等产品的设计，随后直接指令模型「把 Copilot 的风格应用到我们的应用里」，界面随即完成改版，还支持深色模式切换。

这种「设计灵感检索 + AI 应用」的工作流，把过去需要设计师反复对稿的环节压缩到了对话之内。

MCP（Model Context Protocol）是 Anthropic 于2024年底提出的开放协议，旨在标准化 AI 模型与外部数据源、工具之间的连接方式。可以把它理解为「AI 的 USB 接口」：只要服务提供商实现了 MCP 服务器，任何支持 MCP 的 AI 客户端（如 Claude Desktop、Cursor 等）就能通过统一的协议调用该服务，无需为每个工具单独开发插件或 API 集成。Mobbin 的 MCP 接入正是这一机制的典型应用——它让 Claude 在生成或修改代码时，能直接检索 Mobbin 的设计案例库，将「设计参考」这个过去需要人工跨工具搬运的环节，变成了智能体可以自主完成的操作步骤。随着越来越多的 SaaS 工具推出 MCP 支持，「在对话中调用外部专业数据库」将成为 AI 辅助开发工作流的标配能力。

像协作一样迭代：导入 CSV 与真实数据

真实业务应用的价值不在原型多漂亮，而在实际运行效果。作者展示了修改的便捷性：想在客户页面加一个「导入 CSV」按钮，只需一句话告诉智能体即可。功能加好后，拖入 CSV 文件会自动匹配列，检查无误就能把现有客户批量导入门户。

他还分享了自己最爱的用法：处理自己的应用时，直接把 CSV 拖进 Claude 或 Codex，然后说「把这些用户加进来，不确定的地方随时问我」。他预判，这种「靠智能体与软件交互」的方式会越来越普遍，而人类需要的只是一个把这些能力串起来的界面。

从本地原型到生产部署

此时应用仅在本地运行，要真正上线还需几步。作者的方案是让智能体给出一份部署路线图：代码放到 GitHub、部署在 Cloudflare、用 Supabase 做数据库与身份验证、接入 Stripe 处理支付。云端工具几乎会全程手把手带你完成这些连接。

他也提到混合模式：可以保留本地托管，把它打包成一个 macOS 应用直接在电脑上使用——他自己管理收入的内部软件就是这么做的，甚至加了个「魔兽世界风格的经验条」。不过他特别提醒：如果这样用，务必让 AI 确认你输入的数据不会在重新构建或临时存储时被清空，最好把所有输入数据都存下来做备份。这是 AI 生成应用中最容易被忽视、却最致命的坑。

文中提到的部署组合——GitHub + Cloudflare + Supabase + Stripe——代表了当前流行的「现代全栈」托管方案。GitHub 负责代码版本管理与协作；Cloudflare Pages/Workers 提供边缘网络部署，免费套餐即可覆盖小微企业的流量需求；Supabase 是基于 PostgreSQL 的开源后端即服务（BaaS），内置身份验证、数据库、存储和实时功能，免去自建后端的复杂度；Stripe 则是业界最主流的在线支付基础设施，支持订阅、一次性收款等多种模式，并提供完整的 Webhook 机制。这套组合的核心优势是每个环节都有 AI 工具可以调用的完整文档与 SDK，极大降低了智能体在辅助部署时出错的概率。对于首次将 AI 生成应用推向生产的创业者，值得注意的是：Supabase 的行级安全（Row Level Security）策略需要手动配置，若省略这一步可能导致数据越权访问的安全隐患。

这套工作流的价值与边界

这条演示串起了一个清晰的范式：口述需求 → AI 生成提示词与计划 → 20 分钟出可运行原型 → Mobbin 检索设计灵感重构 → 对话式迭代加功能 → 智能体辅助部署上线。它降低的不只是编码门槛，更是「为特定业务量身定制软件」的整体成本。

但也需清醒看待边界：客户进度追踪等功能作者自己都承认「对大多数私教来说可能太复杂」；数据持久化风险、上线后的安全与合规、长期维护等问题，仍需专业判断。AI 让「20 分钟做出原型」成为现实，但从原型到可靠生产系统之间，那段路依然需要人的经验来铺。对企业主和设计师来说，真正的机会在于用这套流程快速验证想法，再逐步打磨成能收费的产品。