Claude Design：5分钟做出1600+个 Lander组合
Peter主理人 · · 阅读 文中的优惠、促销码和活动是发布时的信息，现在可能已经失效。
上一篇文章介绍 eCom Listicle 打法的时候，提到了Claude Design。
今天，通过一个 Coupon 案例，教你如何实现轻松的A/B测试。
首先，我给它一个方向：比如做一个 Coupon 类的Social Lander——用户进来看到本地优惠信息，通过社交裂变互动（分享解锁、邀请好友、拼团等）获取优惠码。
结果超出预期。它很快给了我10种不同的社交裂变方式，每种自动适配了12个GEO。
10种社交裂变方式
同一个Coupon Lander，Claude Design 给出了10种完全不同的互动引导方式：
-
Share to Unlock — 分享到社交平台后解锁优惠码。最经典的裂变方式。
-
Refer a Friend — 好友通过你的链接加入后双方获益。双向激励，信任传播。
-
Group Save — 凑够人数一起享折扣。拼团心理，社交压力驱动。
-
Wishlist Builder — 选3个品类生成个性化优惠清单。策展感。
-
Live Coupon Feed — 实时滚动显示其他用户的领券动态。FOMO。
-
Daily Drop — 每天解锁一个新优惠，连续签到奖励。留存。
-
Mystery Vault — 3张隐藏卡片选一张揭示优惠。好奇心驱动。
-
7-Day Streak — 连续7天check-in解锁大额优惠。打卡成就感。
-
Trending Nearby — 显示附近热门优惠，实时更新。地理相关性。
-
Bundle Builder — 选3个品类组合解锁专属折扣。自主搭配。
每种方式的页面结构、互动逻辑、视觉设计完全不同。不是换颜色换按钮，是换整个用户引导流程。
什么是 Claude Design?
简单说一下：它是 Anthropic 最新推出的一个可视化设计模式，你用自然语言描述需求，它直接输出可运行的HTML页面。
不是截图，不是线框图——是打开浏览器就能看到的真实页面。
做上面10个变体的过程：
第一步：描述需求，出第一个版本
我告诉它做一个Coupon类的Social Lander，用户看到本地优惠，通过社交互动获取优惠码。很快给出第一个完整页面。
第二步：在页面上直接改
不满意的地方不用重新描述，直接点那个元素说间距大一点，这个按钮换成绿色。
它有实时调节旋钮，间距、颜色、布局拖一下就变。跟在Figma里操作差不多，但不需要你会Figma。
第三步：给参考截图，出变体
我截了一个竞品页面的截图丢给它，说参考这个风格做第二种变体。它读截图、理解布局、用同样的设计语言生成了新版本。
第四步：一句话出10个方向
跟它说基于同一个Offer，给我10种不同的社交裂变互动方式，它一次性给出了完整的变体列表，每个都是独立的HTML。
第五步：12个GEO本地化
这是最有意思的部分，从一个页面裂变出多个地区，经常跑offer的都懂得对AB测试有多大便利性。
12个GEO自动本地化
我给了它12个目标GEO：US、PH、TH、ID、BD、PK、MY、ZA、MZ、AO、MX、BR。
Claude Design自动为每个GEO适配了：
店铺名称：
US版显示 Amazon、Walmart、Target、Best Buy、Macy’s
PK版显示 Daraz、Telemart、iShopping、Yayvo
不是随便填的，是每个GEO真正的电商平台。
货币和折扣：US版显示-50%，PK版显示30%-。符号位置、数字格式都跟当地习惯一致。
语言：PK版自动切换成乌尔都语。RTL（从右到左）排版都自动处理好了——这个细节以前需要前端专门适配。
城市：US版Trending in New York right now，PK版Trending in Karachi right now。
支付方式和本地品牌：每个市场的本地支付和零售品牌都不一样，它全部自动配对了。
1600+种排列组合
10种社交裂变方式 × 12个GEO = 120个基础页面。
再叠加配色方案（3种）和CTA文案变体（3-4种），总组合超过1,600种。
以前这是不可能的工作量。现在是一次对话的事。
而且Claude Design输出的不是需要二次加工的设计稿——每个变体自带CSS和JS，不依赖外部框架。
为什么这种测试有意义
如果你把这项技能用在快速测试里，那意义就非常大。
我们在投放广告时，批量测试素材和offer比较多，对Prelander/Lander的改动或AB测试比较少。
如果你加入了这个方式，可以在一个Offer里同时测试10个甚至几十个Lander，而无需花费太多时间。
此 Coupon 案例里：
US用户对 Share to Unlock 接受度高，社交分享是习惯。
东南亚用户可能对 Group Save 更有感觉——拼团文化深入人心。
中东用户可能对 Trending Nearby 反应更好——地理相关性强。
你不知道哪种裂变方式在对应GEO表现最好，只有结合本地化、文案、CTA、颜色，通过排列组合的方式，先完成10个页面，让数据给你反馈，逐步找出表现最好的那一组。
自动部署和批量测试
部署：
当这些页面调整满意后，就可以进入自动打包上传阶段
推到GitHub → Cloudflare Pages自动部署 → 绑自定义域名。
它们提供免费、全球CDN、SSL自动配。每次改HTML只需要git push，自动更新。
Tracker对接：在HTML里嵌入JS追踪代码，或者调用API自动添加每批页面。
A/B测试：每个裂变方式在每个GEO跑独立的Ad Group，同预算同定向，3-5天看数据。
砍掉表现差的，留2-3个Winner，基于Winner做细节优化。
最后说一句
以前做一个 Prelander花半天，一个版本跑所有地区，数据不好只能怪Offer。
很多时候连改动都懒，SPY的页面直接上架测试。
现在可以在5分钟内实现：
10种裂变×12个GEO×3种配色×5种文案 ，自动部署上架的方案。
当你上手的那一刻，就会明白它对投放效率的提升有多大。
Peter的Affiliate之路