大半夜，朋友圈被谷歌新模型Nano Banana的逆天效果刷屏了！
这一年已经对全网喊着“新模型太强了！“，”XXX要失业了！”见怪不怪了。但这次还是被震惊到了 ！
先看效果吧！我随手拍了一张照片，让它帮我把衣服换成昨天加入到购物车的T恤。 效果如下：
接着我想，这不够酷。作为AI时代创业者，把模型随手做成产品是基本素养。
于是，我用了不到两个小时的时间，做出了下面这个产品。--无限虚拟衣柜，让你不买衣服，也能从此穿衣自由。
我经常买了很多衣服，可能只穿过一两次。 甚至很多时候，想要的只是那张穿着新衣服的好看照片。
那不如让“拥有照片”，就等于“拥有衣服”。这样一来，衣柜可以无限大，而且还特别省钱！
这个小网站用起来非常简单，傻瓜式操作，就三步：上传自己照片、上传衣服照片，点击按钮生成！
我们来看看效果：
如果你对这背后怎么实现的感兴趣，下面是写给你的“技术彩蛋”。生财独家附上prompt全文，大家有需要的可以自取。
圈友对Claude Code肯定不陌生了，得益于小排老师，生财可能是全中国会Claude code会员数最多的社群了 ！
核心流程就两步：
1. 告诉Claude Code我要干嘛：
Prompt for Claude Code
请创建一个极简风格的AI换装网站，要求如下：
设计风格
视觉风格：Instagram极简美学，大量留白，柔和的中性色调（米白、浅灰、深灰）
布局：单页应用，垂直流布局，所有功能在一个页面内完成
字体：使用现代无衬线字体（如Inter或SF Pro Display）
交互：微动效，平滑过渡，拖拽上传支持
核心功能流程
人物上传区：页面顶部，用户拖拽或点击上传人物照片，上传后显示缩略图
衣服选择区：中间部分，支持上传多件衣服图片，以优雅的网格展示
一键换装：点击衣服图片即可预览换装效果
结果展示：底部大图展示换装后的效果
技术实现
使用React + Tailwind CSS
所有状态管理用React hooks
图片上传使用HTML5 File API
模型调用部分：暂时用Mock数据模拟，创建一个mockTransform函数，输入人物图和衣服图，返回一个延时后的合成图片（可以暂时返回原图或占位图）
预留接口位置，标注// TODO: 替换为Google Nano Banana API调用
具体UI要求
上传区域：虚线边框的圆角矩形，hover时有轻微放大效果
图片预览：带阴影的卡片式设计，圆角
按钮：扁平设计，柔和的阴影，充足的padding
加载状态：优雅的骨架屏或脉冲动画
响应式：移动端友好，但优先考虑桌面体验
文案
主标题："AI Wardrobe" 或类似简洁的名称
副标题："Transform your style in one click"
所有提示文案保持极简，使用图标代替文字where possible
代码组织
- 主组件App.jsx
- 子组件：
- ImageUploader（可复用的上传组件）
- ClothesGallery（衣服展示网格）
- ResultDisplay（结果展示）
- utils/mockApi.js（模拟API调用）
请确保代码清晰、可维护，并在关键位置添加注释说明后续如何接入真实API。整体追求"少即是多"的设计理念，让用户专注于核心的换装体验。
2、对接模型的API
现在请你接入nano-banana/edit模型，
接口文档如下：https://fal.ai/models/fal-ai/nano-banana/edit/api
我的key是：******** （换成你自己的）
当然，在实际对话中，还会涉及到需要验收claude code做的结果，对于样式、交互不满意我会讲清需求进行优化，篇幅关系不一一展开啦～ 但是全程自然语言就行。
- 看懂了不代表会了 ，快去自己试一试吧！
Comments on "cc+NanoBanana，2小时用AI解决电商上新模特拍照难题，附全流程教程" :