@PrajwalTomar_: https://x.com/PrajwalTomar_/status/2072659398733013116

X AI KOLs Timeline 工具

摘要

描述了一个工作流,结合FireVibe进行AI生成的设计和原生代码生成,然后使用Claude Code构建后端逻辑,实现无需手动编写UI代码的快速iOS应用开发。

https://t.co/jfRApzBw2k
查看原文
查看缓存全文

缓存时间: 2026/07/02 14:23

Claude Code 在发布 iOS 应用上简直无敌了。这是真正管用的工作流。

Claude Code 加上这个新的秘密工具,就是我们机构一直在用的设计工作流……输出结果跟我之前发布过的任何东西完全不在一个档次。

我已经说了好几个月了:如果你的应用看起来像 AI 生成的垃圾,那不是 Claude Code 的问题,那是工作流的问题。

大多数开发者都陷在同一个循环里:用 AI 发布功能,后端没问题,逻辑很扎实,但界面看起来跟其他所有“vibe coded”应用一模一样。用户在大约两秒钟内就会决定它是否足够真实可信,甚至值不值得付费。

过去的解决办法是雇一个设计师,等几周的 Figma 文件,然后看着开发人员重新用代码实现那些设计。等上线的时候,你已经失去动力,还烧掉了本不需要烧的钱。

现在整个过程都是可选的。

在这个教程中,我构建了 TripGlide,一个旅行预订应用概念。几分钟内搞定了完整的设计系统和每一个屏幕。通过 Claude Code 发布原生代码,无需手动重写一行。

这周我还带了几位一对一咨询客户走了一遍这个完整的流程,效果足够好,所以我决定把整个过程写下来。

这就是我现在在用的工作流。每一个用 AI 发布产品的开发者都需要理解它是如何运作的。

以下是完整拆解。

一次提示,一个完整的多屏应用,然后一键导出原生代码。

这个技术栈到底是什么

两个工具,各司其职。

FireVibe 是设计引擎。这是没人注意的那一半,而这恰恰决定了你的应用在真实用户面前能否存活。从一条提示出发,它能给你:

→ 完整的多屏应用,而不是一个孤零零的屏幕 → 统一的设计系统,让每个屏幕都感觉像是同一个产品 → AI 生成的图像,没有任何占位符 → 原生代码:SwiftUI、Jetpack Compose、Flutter、React Native、React → 可以直接放进 Xcode、Claude Code 或 Cursor 继续构建的代码 → 聊天式编辑,且在所有屏幕间保持一致 → 如果你的团队还在用 Figma,还支持导出 Figma

输出结果可以直接上架 App Store。不是概念,不是还需要重建的模型。就是实际的屏幕和实际的原生代码,大约三分钟,免费计划,无需信用卡。

Claude Code 是构建引擎。一旦你有了一个可以上架 App Store 的前端,就把原生代码交给 Claude Code,在上面构建真正的产品。逻辑、数据、认证、功能——这些让漂亮外壳变成真正产品的东西。Claude Code 就是让那个漂亮外壳变成真正产品的地方。

这就是解锁的关键:在设计里开始,在构建里完成,交付你设计出来的同一个成品。

右边终端里打开 Claude Code,左边浏览器里打开 FireVibe。

为什么你的 AI 应用卖不出去

让我直说吧,大多数开发者不想听的话。

你的应用失败不是因为代码有问题,而是因为它看起来像是 AI 做的,而人们不会为看起来那样东西付费。

想想用户第一次打开应用时发生了什么。他们不读你的代码,不羡慕你的数据库结构。他们在一秒内凭直觉做决定:这看起来像一个有诚意的团队做的真实产品,还是一个周末的 AI 实验?

大多数 AI 构建的应用都通不过那半秒测试。字体是默认的,颜色是每个人都在用的紫色渐变,间距稍微不对,图标不统一。每个屏幕都像是拼凑出来的不同应用。

这些都不是代码问题,而是设计问题。在过去一年里,这是 AI 做不好的部分,也是让付费应用和被忽略应用区别开来的部分。

而这个差距正是这个工作流要弥合的。

工作流

大多数人是先构建应用,最后再拼上设计。现在这个顺序反了。

设计才是护城河,所以设计是起点。我将用一个叫 TripGlide 的旅行应用作为例子,因为旅行应用是完美的测试案例。这类产品中,设计本身就是产品。没有人会通过看起来廉价的东西预订旅程。

第一步 - 在 FireVibe 中设计完整应用

从 FireVibe 开始。把应用描述为一个完整的产品,而不是一系列功能列表。

对于 TripGlide,我用了类似这样的描述:

设计一款名为 TripGlide 的旅行预订应用:一本恰好让你能预订的高端数字旅行杂志。每个屏幕都应该感觉精心策划、令人向往,就像翻阅一本高级旅行杂志,同时预订流程毫不费力。

这是一个完整的产品。先设计这些核心屏幕,并包含真实版本所需的辅助屏幕(引导页、搜索和筛选结果、已保存的行程、个人资料和预订)。

首页/发现:按区域(地中海、东南亚、巴塔哥尼亚)分组的目的地。顶部有一个大型主打推荐,然后区域标题下的编辑卡片以水平滚动轨道排列。每张卡片:全幅照片、目的地名称、一行唤起情感的标语、一行低调的元数据(“7 个旅行团 · 起价 $1,200”)。低调的搜索入口和一个微妙的收藏夹图标。

目的地详情:顶部可滑动的照片画廊,配有干净的分页指示器。下面:简短编辑导语、关键事实行(最佳季节、语言、货币、行程长度)、照片网格、以及带星级评分汇总、评分分布条和单个评价卡片(头像、姓名、日期、评分、文字)的评价区域。最后以一个优雅的“探索旅行团“按钮结尾。

行程和预订:以纵向时间线展示每日行程,每行显示标题、活动、包含的餐饮和住宿。清晰显示价格、时长、团队规模和包含项目。然后是一个平静的多步骤预订流程(日期、旅客、附加项、审核、确认),并带有一个显示累计总额的持续摘要栏。

返回的结果不是一个屏幕,而是整个应用作为一个连贯的产品,具有真实的设计系统和真实的图像,而不是灰色方块。首页、目的地页面、行程——所有内容看起来都是由同一个团队制作的同一个应用。

这就是 TripGlide 不再像 AI 实验,而像是 App Store 排行榜上能找到的东西的地方。

在 FireVibe 中生成的完整 TripGlide 应用。统一、有品牌感、多屏。

第二步 - 聊天式编辑,并保持全局一致

这通常是其他工具会出问题的部分,也是大多数 AI 应用最终看起来不一致的原因。

通常你会修复一个屏幕,其他屏幕就偏离了。你改了首页的按钮,现在它和预订流程不匹配了。最终你不得不手动盯着每一个屏幕。

在这里,你只需要直接跟它说:

把强调色改成更深的陶土色。收紧目的地卡片的间距。在所有屏幕上使用相同的预订按钮样式。

编辑会立即应用到整个应用。修改一次,所有地方保持一致。这让独立开发者能够发布出看起来像是真正团队制作的产品,因为无论你怎么调整,设计始终是一个整体。

正在进行聊天式编辑,变更同时传播到多个屏幕。

第三步 - 把原生代码交给 Claude Code,然后发布

现在,你拿到了可以上架 App Store 的前端,然后在此基础上构建真正的产品。

FireVibe 导出原生代码。对于 iOS 应用,就是干净的 SwiftUI。你把代码直接放进 Claude Code,构建设计工具无法处理的部分:预订逻辑、数据库、用户账户、支付——那些漂亮屏幕背后的实际功能。

这是有效的分工。FireVibe 负责外观和感觉,Claude Code 负责功能和逻辑。你不需要让一个工具在两方面都出色。

构建完成后,像其他 iOS 应用一样通过 Xcode 发布。不需要重建,不需要从头重新创建设计代码。你设计的成品就是你提交的成品。这就是“App Store 就绪“的真正含义。

导出的 SwiftUI 在 Claude Code 中打开,后端逻辑正在其上层构建。

何时使用这个方案

这不适用于每个项目。以下是它适合的情况:

→ 你是独立开发者,正在向 App Store 发布真实应用,但没有设计师 → 你是机构或自由职业者,为客户构思应用,需要快速获得高保真、有品牌感的版本 → 你的构建已经工作了,但设计是阻止你上线的障碍 → 你是非技术创始人,能描述产品但无法设计或编码

如果你的应用纯粹是内部使用,团队之外没人会看到,你可以跳过设计打磨。

需要注意什么

在开始运行之前,有几个诚实的提醒。

品味仍然是你的。 这个工具能快速给你一个强大、统一的设计。但为你的品牌选择合适的感觉,以及知道什么时候不对劲,仍然是你的工作。AI 负责生产,你负责判断。

在真机上测试。 “App Store 就绪“意味着代码是真的且可发布,但你仍然需要在真实手机上打开它,逐一检查每个流程再提交。把输出当成一个强大的初版,而不是最终的质量检查。

了解免费计划的限制。 有一个真正的免费计划,无需信用卡,足以运行整个工作流并发布第一个应用。大量、持续的生产最终会需要付费版。从免费开始,找到你的界限在哪里。

最后的 20% 仍然重要。 这个工作流能在几分钟内带你到美丽、一致的应用的 80%。最后那 20%——让它感觉高级的微小细节——需要你的眼光。不要跳过它。那 20% 正是让人们付费的原因。

这实际上意味着什么

以下是我在真实项目上运行后的诚实评价。

我们刚刚亲眼目睹:地球上最好的构建模型在发布几天后被政府撤回,消失数周,然后悄悄重新上线。如果你的全部优势在于你用哪个模型构建,那么那个优势距离消失只有一次政策调整的距离。

构建应用不再是护城河了。它已经被商品化,甚至变得不稳定。当困难的部分变得免费和可替代时,它就不再是你赚钱的东西了。

设计现在是护城河。唯一剩下的、决定一个陌生人是否信任你的应用并愿意下载、保留和付费的东西。过去一年,这是 AI 做不到的部分。现在它能了。

理解这一点的开发者将能够发布看起来像是资金充足的初创公司制作的应用——一下午时间,免费计划。其他所有人将继续纳闷为什么他们能工作的应用零付费用户。

2026 年对及早行动的建设者来说将是绝对不公平的。

太长不看版

→ 构建现在已经被商品化,即便是最好的模型也不稳定。它不再是护城河。 → 设计现在是护城河。大多数 AI 应用卖不出去是因为它们看起来像是 AI 构建的。 → 第一步:在 FireVibe 中设计完整应用。一条提示,统一的设计系统,真实图像,原生代码。 → 第二步:聊天式编辑一次,变更在所有屏幕保持一致。 → 第三步:把原生代码交给 Claude Code,在上面构建真正的产品,然后通过 Xcode 发布。 → 输出结果可以直接上架 App Store。你设计的就是你发布的。 → 免费计划,无需信用卡,从提示到应用大约三分钟。在这里试试。

应用不再是难点了。让人为它付费才是。这曾经是一个设计问题,现在它被解决了。

冲吧。

相似文章