我在手机上用AI开发了一个电脑番茄钟应用(附详细教程)

自从我开始捣鼓AI编程以来

脑子里时不时就冒出来个小注意～

所以总想着快点打开电脑，来上一顿Vibe Coding

而这些琐碎的小想法，绝大多数源于我自己实际的需求。

就比如：

习惯性久坐，经常性走神...

实在惭愧，但这绝对也是很多人的痛点。

特别是如今的AI发展日新月异，需要关注的信息实在太多太多，并且需要学、做的事情也太多太多...

于是，番茄钟成了我的刚需。

而上周，我从自己微信上铺天盖地的文章推送中了解到：

字节，将自家的Trae SOLO直接整到了手机移动端～

Ps：事先声明：此文非广，放心食用

作为半个Trae重度使用者，我也在Trae上收到了官方通知：

于是借着周末，我也是好好体验了一把，并通过手机端开发了一个桌面端番茄钟MVP产品：Tomato Cub

俗称：番茄仔～

接下来，我将一一为大家剖析，并展示该如何使用这个手机端的Trae，来直接操控电脑进行项目开发（以我的番茄钟MVP为例）

关于如何联动使用

目前来看，Trae SOLO有Web、桌面端以及手机移动端这三端应用，并且三端都是互相打通的。

推荐使用手机端+桌面端的组合，手机端负责便捷，桌面端负责实际的动作和存储。

而手机端与桌面端应用链接起来也很容易，对于手机端，按照下面指示打开：

对于桌面端，则按照下面步骤：

随后两端自动配对，手机拥有了指挥电脑的能力～

关于开发时prompt怎么写

AI时代的产品开发，核心在于Prompt～

而在之前一篇关于扣子编程的文章里，我就有大致提到Prompt撰写的一个非常基本的原则，有需要的朋友可以跳转阅读：

手把手带你从0入门AI编程，实现你的第一个产品idea！（超详细讲解）

概括下来，就是：

表述清晰、不模糊、没有歧义

表述有歧义，这是AI Coding的大忌！

除了没有歧义外，我们还要做到尽可能专业、详细。

“没有歧义还可以接受，但专业还有详细，这可就有点为难我了，毕竟咱也不是有技术基础的种啊～”

小问题，我为大家准备了一个提示词模板：

我想开发一个[示例：桌面端番茄钟应用]，现在请你以苏格拉底式的提问帮助我梳理开发需求，具体要求如下：

1.每次只提问我一个问题，并且每个问题都要给出对应的选项供我选择；

2.最终形成一份符合SPEC原则的需求描述Prompt，可直接发送给AI用于开发；

关于SPEC原则，具体如下：

• Problem Statement（问题陈述）

• Proposed Solution（方案描述）

• Technical Constraints（技术约束）

• Non-goals（明确不做的事）

• Success Criteria（成功标准）

你可以将模版中具体的开发需求更换成自己的，然后发送给任何一个AI，比如DeepSeek、ChatGPT、Gemini等等，之后AI、会按照要求不断向你确认一些信息，直至最后得到一份专业、详细的Prompt～

当然，也可以直接发给Trae，因为Trae SOLO现在也上了语音对话功能，所以还可以边散步边直接口头跟Trae讨论，岂不快哉？

讨论结束后，Trae还能自动生成总结，这就非常实用了～

关于开发过程

讨论完后，下一步呢？乖乖回到电脑前手搓吗？

没必要，假如你现在在散步、在外面吃饭、在通勤，甚至只是单纯的不想打开电脑，都可以在手机端Trae上进行开发。

首先确保已将Trae切换至Code模式：

然后根据以下流程，通过手机端直接控制电脑新建一个项目文件，最后上一步讨论得到的Prompt发送出去：

随后我们可以看到任务界面会显示这个再执行的任务：

如果这时候我们回到电脑桌面端，也会看到这里同样显示着这个任务：

并且如果是在电脑端，我们还可以看到完整的开发流程：

就跟在AI IDE上一样，或者说这就是，毕竟Trae SOLO跟Trae本质上也是相通的：

其实整体观摩下来，这个开发需求并不算难，所以前面的界面搭建和功能实现都很快：

最难的其实是最后一步：

验证运行...

因为我用的是Mac，基于Mac电脑对系统级权限的保护，所以一些操作需要我们手动确认甚至是反复尝试，但如果是Windows用户，则大概率顺很多～

待一切生成完毕，我们就可以通过在终端输入相应的指令来启动项目：

我的指令具体如下：

cd "/Users/anfor/Documents/Tomato Cub"npm run dev

大家需要替换一下第一行的项目路径，并且第二行也不一定用的是npm，这个问一下AI就知道了～

但都说是App了？难道每次启动个应用还得用终端运行？

那是绝对不行的，所以现在我们需要继续让Trae来对这个项目进行封装，具体的Prompt如下：

请将 Tomato Cub 打包成 macOS 可双击运行的 .app，并使用我上传的的图标作为 App 图标。要求：1. 不要使用 Electron 默认图标，必须基于我提供的 webp 图标生成应用图标。2. 如果 webp 不能直接用于打包，请先转换为 png，再生成 macOS 所需的 .icns 文件。3. 请按照 macOS App 图标风格处理：将番茄钟图案放在圆角矩形图标画布中，保留适当内边距，不要直接把无框原图塞进 .icns。4. 请在打包配置中设置应用名称为 Tomato Cub，并指定生成后的 .icns 图标。5. 打包后应生成可在 Finder 中双击运行的 Tomato Cub.app，且 Finder / Dock 中显示该番茄钟图标。6. 完成后告诉我打包命令、生成的 .app 路径，以及图标文件放置位置。