开始前需要准备什么?
开始前只需确定三个信息:应用给谁使用、用户要完成什么任务、结果需要在哪些页面中呈现。不需要先写技术方案,也不需要准备设计稿。
一句话示例:为经常出差的销售人员创建移动端行程管理应用,支持添加航班、酒店和客户拜访,并在首页按时间展示当天安排。
如何使用 Start Fast 生成应用原型
- 描述应用目标。 在首页输入目标用户、核心任务和主要页面。描述越具体,第一次生成的结构越接近预期。
- 登录并开始创建。 点击“开始创建”。系统创建项目后会进入项目页面,并开始生成需求和原型文件。
- 查看生成进度。 对话区域会显示当前处理阶段;文件区域用于查看需求文档、待办和原型页面。项目进入页面后也会主动同步文件列表。
- 预览原型页面。 在文件树中选择
prototype目录下的 HTML 页面。预览区域会加载对应页面,可在移动端和 Web 模式之间切换。 - 用对话调整结果。 说明要修改的页面、元素和目标效果。例如:“将首页统计卡改成两列,保留橙色强调色,并为无数据状态增加操作按钮。”
- 导出并继续开发。 确认页面流程后导出项目。下载包可在 VS Code、Cursor 或其他开发工具中打开,再接入真实接口和业务数据。
生成结果包含什么?
一个项目通常由三类内容组成:需求与说明文档、可交互原型页面、用于继续开发的项目文件。实际文件会根据应用描述和生成进度变化。
- 需求文档:记录目标、功能范围和实现待办。
- 原型页面:位于
prototype/目录,可直接预览各页面的布局和交互。 - 项目结构:用于导出和继续实现的 React + Vite 文件。
常见问题
页面生成后为什么没有立即显示?
先检查文件树是否已经出现 prototype 页面,再选择具体 HTML 文件。网络波动时可以重新加载文件列表;不需要等待旧的 WebSocket 消息才能查看服务端已有文件。
第一次结果和想法差距较大怎么办?
不要只说“更好看”或“再优化一下”。指出页面、目标用户、需要保留的内容和希望改变的具体结构。下一篇教程提供一套可复制的描述模板。
原型是否等于可直接上线的产品?
原型主要用于确认页面结构、流程和视觉方向。上线前仍需接入真实数据、身份认证、错误处理、监控和安全检查。