详情

首页手游攻略 Codex 前端为什么像模板?用 taste-skill 先做 Design Read

Codex 前端为什么像模板?用 taste-skill 先做 Design Read

佚名 2026-07-16 14:00:02

Codex 生成前端不好看,很多时候不是 CSS 能力问题,而是它太早开始写代码。taste-skill v2 把第一步压回到 Design Read:先判断页面属于哪类、面向谁、该靠近哪种视觉语言,再决定布局和组件。这个动作小,但能拦住一大半模板味。

Taste Skill 文档展示 v2 会读取 brief、判断受众、风格和约束后再生成界面

Design Read 该读什么

你给 Codex 的信息越像设计 brief,页面越不容易跑偏。至少说清页面类型、使用人群、业务阶段和气质。例如“给开发者看的开源工具官网”和“给婚礼摄影工作室看的作品集”,都可能叫 landing page,但字体、留白、图片比例、动效强度完全不同。

taste-skill 的 SKILL.md 里把这些信号拆得很细:page kind、vibe words、reference signals、audience、brand assets、quiet constraints。翻成实际操作,就是让 Codex 先承认自己在服务谁,再决定视觉手法。受众是采购团队,就别做过度实验;受众是创意作品集,页面可以更有节奏。

taste-skill SKILL.md 页面展示 Brief Inference 和 Design Read 相关规则

怎么把它写进 Codex 提示词

可以这样发任务:使用 design-taste-frontend。先输出一行 Design Read,再重做首页首屏。受众是准备试用 API 的独立开发者,视觉要像清爽的开发者工具,不要 AI 紫色渐变,不要三I张等宽功能卡。保留现有 logo 和文案。

这段话里有两个控制点。一个是“先输出 Design Read”,强迫 Codex 先说判断;另一个是明确禁止默认套路。taste-skill 已经在规则里写了常见 AI 前端套路,你在任务里再补项目边界,效果会更稳。

Taste Skill 文档 Anti-slop bans 区域展示需要避开的 AI 前端默认套路

读题错了怎么改

如果 Codex 把 B2B 工具读成潮流品牌页,不要急着让它继续写。直接改 Design Read:把页面改读为技术买家看的 SaaS 落地页,风格靠近克制的开发者工具,动效只保留 hover 和轻滚动。然后再让它重跑布局。

前端审美不是一句“高级点”能解决的。taste-skill 的好处是让错误暴露在第一步。读题对了,后面的字体、空间、动效和组件才有一致方向。

点击查看更多
推荐专题
热门阅读