Opus 5.5 高阶网页设计工作流：从截图到 DESIGN.md
Opus 5.5 can make top-tier web design, as long as you 𝘀𝗵𝗼𝘄 𝗶𝘁 𝘁𝗼𝗽-𝘁𝗶𝗲𝗿 𝗱𝗲𝘀𝗶𝗴𝗻 𝗳𝗶…
提供了极具实操性的 AI 辅助设计工作流，将抽象的审美要求转化为具体的文件配置与代码指令，结构清晰且步骤可复制。
Opus 5.5 can make top-tier web design, as long as you 𝘀𝗵𝗼𝘄 𝗶𝘁 𝘁𝗼𝗽-𝘁𝗶𝗲𝗿 𝗱𝗲𝘀𝗶𝗴𝗻 𝗳𝗶𝗿𝘀𝘁.
只要你先展示顶级设计，Opus 5.5 就能做出顶级的网页设计。
If your pages still look AI-made at a glance, it probably hasn't seen the kind of design you like.
如果你的页面乍一看仍像 AI 生成的，那可能是它没见过你喜欢的这类设计。
𝗦𝘁𝗲𝗽 𝟭: pick 3 to 5 sites you like on Godly, Refero or One Page Love, drag the screenshots straight into Claude Code, and have it tell you what makes each one look good.
步骤 1：在 Godly、Refero 或 One Page Love 上挑选 3 到 5 个你喜欢的网站，将截图直接拖入 Claude Code，让它告诉你每个网站好在哪里。
𝗦𝘁𝗲𝗽 𝟮: turn the parts you pick into a DESIGN.md and import it into CLAUDE.md. Every page after that follows it.
步骤 2：将你选中的部分整理成 DESIGN.md 并导入 CLAUDE.md。此后每个页面都遵循该规范。
𝗦𝘁𝗲𝗽 𝟯: install two design skills: → taste-skill (90k+ stars): use it while building, so its pages stop looking like templates npx skills add Leonxlnx/taste-skill --skill design-taste-frontend → Impeccable (70k+ stars): finish each page with /impeccable polish Run npx impeccable install in your project root, then /impeccable init in Claude Code
步骤 3：安装两个设计技能： → taste-skill（90k+ 星）：在构建时使用它，让页面不再看起来像模板 npx skills add Leonxlnx/taste-skill --skill design-taste-frontend → Impeccable（70k+ 星）：用 /impeccable polish 完成每个页面的打磨 在项目根目录运行 npx impeccable install，然后在 Claude Code 中运行 /impeccable init
Before you ship, send it the full post quoted below and let its subagents check everything once more.
在发布之前，将下面引用的完整帖子发送给它，让其子代理再次检查所有内容。
When you send the screenshots, add this 👇
当你发送截图时，加上这段 👇
"These are screenshots of sites I like. Don't touch any code yet: 1. For each one, tell me what it does well: layout, typography, color, spacing, white space. 2. List what they have in common, ask me which parts I want, and wait for my answer before going on. 3. Write a DESIGN.md in the project root based on what I pick, with real values: font sizes, weights, color codes, spacing, corner radius. Mark anything you can't tell from the screenshots as an estimate. Don't make it up. Keep it short, one screen at most. 4. Import DESIGN.md into the root CLAUDE.md with an @ line, not inside backticks. Then add a rule: after every page you finish, run /impeccable polish."
"这些是我喜欢的网站截图。暂时不要碰任何代码： 1. 对每个网站，告诉我它在哪些方面做得好：布局、排版、颜色、间距、留白。 2. 列出它们的共同点，问我你想要哪些部分，并在继续之前等待我的回答。 3. 根据我选择的内容，在项目根目录下编写一个 DESIGN.md，包含具体数值：字体大小、字重、颜色代码、间距、圆角半径。将无法从截图中确定的内容标记为估算值。不要捏造数据。保持简短，最多一屏。 4. 使用 @ 行（而非反引号内）将 DESIGN.md 导入根目录的 CLAUDE.md。然后添加一条规则：在你完成每个页面后，运行 /impeccable polish。"
更进一步：量化金融体系
看懂新闻只是起点——沿量化金融路径，把它变成能交付的工程能力