ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

3分钟装好ai-design-skills:Claude Code与Cursor快速入门教程

3分钟装好ai-design-skills:Claude Code与Cursor快速入门教程 3分钟装好ai-design-skillsClaude Code与Cursor快速入门教程【免费下载链接】ai-design-skills项目地址: https://gitcode.com/gh_mirrors/ai/ai-design-skillsai-design-skills 是一个为 AI 编程工具Claude Code、Cursor、Codex、Windsurf 等提供落地页设计技能的开源项目。每个技能都是自包含的文件夹装上即用AI 会自动按专业设计系统生成高转化落地页涵盖文案策略、页面结构和视觉规范。本文带你 3 分钟完成安装。 它能做什么项目目前内置一个核心技能landing-page-design落地页设计包含两大部分策略与结构自动向你收集需求目标用户、主行动、转化指标再输出页面大纲、Hero 文案、转化文案、FAQ 与 SEO 建议视觉系统字体、字阶、间距、圆角、图标、动效等全套硬性规范保证 AI 生成的页面像设计师做的技能说明文件见 skills/landing-page-design/SKILL.md项目总览见 README.md。⏱️ 第一步Claude Code 一键安装在项目根目录执行以下 3 条命令把技能放进.claude/skills即可mkdir -p .claude/skills git clone https://gitcode.com/gh_mirrors/ai/ai-design-skills /tmp/ai-design-skills cp -r /tmp/ai-design-skills/skills/landing-page-design .claude/skills/装好后无需任何额外配置——直接用大白话提需求即可例如帮我做一个 SaaS 产品的落地页目标动作是注册试用。Claude Code 会自动应用该技能的完整设计流程。 第二步Cursor 快速配置规则文件Cursor 读取的是.cursor/rules目录下的规则文件只需把技能文件复制过去并改名为landing-page-design.mdmkdir -p .cursor/rules cp /tmp/ai-design-skills/skills/landing-page-design/SKILL.md .cursor/rules/landing-page-design.md也可以直接把 SKILL.md 的内容粘贴到Settings → Rules for AI中效果相同。️ 其他工具也支持工具放置路径CodexAGENTS.mdWindsurf.windsurfrulesCline.clinerulesClaude.ai无终端上传到 Project 或附在对话里说follow this核心思路都一样把 SKILL.md 放进工具的项目规则位置。 装好之后怎么用以落地页为例AI 会按固定顺序产出页面大纲 → Hero 文案 → 收益点 → 使用流程 → FAQ → SEO 建议 → 布局选型然后逐区块生成代码而不是整页重写方便你随时审阅和回退。几个实用提示✅ 信息不全也没关系AI 会做合理假设并说明不会卡住✅ 想要自己的品牌风格技能文件底部有集中的设计值区域字体、配色、间距、动效改这一处全技能自动跟随✅ 生成的是真实草稿文案没有 Lorem Ipsum 和假数据❓ 常见问题技能会覆盖我的框架配置吗会。规则明确技能规范与框架默认值冲突时以技能为准但你的明确指令永远优先。可以商用吗可以。项目采用 MIT 协议见 LICENSE可自由使用、修改、商用无需署名。小结步骤耗时Clone 仓库~1 分钟复制技能到.claude/skills或.cursor/rules~1 分钟用自然语言发起第一个需求~1 分钟3 分钟后你就拥有了一个自带资深落地页设计师的 AI 编码工具。【免费下载链接】ai-design-skills项目地址: https://gitcode.com/gh_mirrors/ai/ai-design-skills创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表