Claude Code 技巧:用 Opus 5.5 子代理检查并修复网站问题
Claude Code tip: before you ship a vibe-coded site, have Opus 5.5 send out 𝟱 𝘀𝘂𝗯…
结构清晰且具备实操价值,将复杂的代码审查拆解为具体的检查清单,并给出了可直接复用的提示词模板,对开发者有直接参考价值。
Claude Code tip: before you ship a vibe-coded site, have Opus 5.5 send out 𝟱 𝘀𝘂𝗯𝗮𝗴𝗲𝗻𝘁𝘀 to check 𝘁𝗵𝗲𝘀𝗲 𝟮𝟬 𝘁𝗵𝗶𝗻𝗴𝘀, then fix them all in one pass:
Claude Code 提示:在发布一个由 vibe coding(氛围编码)生成的网站之前,让 Opus 5.5 派出 𝟱 个子代理来检查以下 𝟮𝟬 项内容,然后一次性修复所有问题:
Consistent design → Write a DESIGN.md first, and make every color, font size, spacing and corner radius follow it → Keep the palette restrained and the type hierarchy clear → Make every button, card and input of the same kind look alike → Too flat? Add emphasis. Too crowded? Cut → Keep text readable on both dark and light backgrounds
保持一致的设计 → 先编写 DESIGN.md,确保每种颜色、字体大小、间距和圆角都遵循该规范 → 保持配色克制,层级清晰 → 确保同类按钮、卡片和输入框外观一致 → 太平淡?增加强调。太拥挤?删减 → 确保文本在深色和浅色背景下均可读
On mobile → No sideways scrolling, and nothing spilling off the screen → Add a mobile menu → Make buttons big enough to tap → Keep the layout intact when the text is enlarged
移动端适配 → 禁止横向滚动,内容不得溢出屏幕 → 添加移动端菜单 → 确保按钮足够大以便点击 → 文本放大时布局保持完整
Every state → Give loading, empty and error states a proper screen → Give every button feedback, with its own hover, pressed and disabled look → Show form errors right where they happen, plus submitting, success and failure messages → Add transitions to modals, dropdowns and tab switches
各种状态 → 为加载、空数据和错误状态提供专门的界面 → 为每个按钮提供反馈,包括悬停、按下和禁用状态的视觉效果 → 在表单出错位置直接显示错误信息,并展示提交中、成功和失败的消息 → 为模态框、下拉菜单和标签切换添加过渡动画
Use it like a real user → Click through the core flows, like sign-up and checkout, from start to finish → Find buttons that do nothing and links that are broken → Make sure the whole thing works with just a keyboard
像真实用户一样使用 → 从头到尾体验核心流程,如注册和结账 → 找出没有功能的按钮和失效的链接 → 确保仅使用键盘即可完成全部操作
Before launch → Say what you do in one line on the home page → Give each page one main button you want people to click → Give every page a title, a description and a favicon → Delete all placeholder text
上线前 → 在首页用一句话说明你的产品/服务是什么 → 每页设置一个希望用户点击的主要按钮 → 为每页设置标题、描述和网站图标(favicon) → 删除所有占位文本
For effort, follow Anthropic's cost guide from yesterday: medium is for well-scoped daily work. The default medium is enough for these 20 fixes; raise it for the harder ones. Thariq tested it: turning effort up mostly buys more verification and edge-case testing.
关于工作量,请参考 Anthropic 昨天的成本指南:medium(中等)适用于范围明确的日常工作。默认的 medium 级别足以完成这 20 项修复;对于更难的项可提高级别。Thariq 进行了测试:提高工作量主要能买到更多的验证和边缘情况测试。
Send this whole post to Claude Code. If you need to, add this line at the end 👇 "Send one subagent per group to check it without editing anything. Then fix everything yourself from their lists, so no two agents edit the same file. If a group is more complex, raise that subagent's effort. Show me the list of issues first, don't change anything until I confirm, and when you're done, give me before-and-after screenshots."
将整篇帖子发送给 Claude Code。如果需要,在末尾添加这一行 👇 “每组发送一个子代理进行检查,不要编辑任何内容。然后根据他们的列表自行修复所有问题,确保没有两个代理编辑同一个文件。如果某组更复杂,请提高该子代理的工作量。先向我展示问题列表,在我确认之前不要更改任何内容,完成后给我提供修改前后的截图。”
更进一步:量化金融体系
看懂新闻只是起点——沿量化金融路径,把它变成能交付的工程能力