STACK · 从 brief 到能跑的落地页/移动端界面
落地页设计包
先定视觉方向，再做页面结构，最后落成可运行的 HTML/React Native 界面。
来源 已通过安装 已通过任务 未实测4 个 Skill
FOR
适合谁
独立开发者、小团队、需要快速做产品页或移动端原型的人。
NOT FOR
不适合谁
需要成熟设计系统、多人协作交付、严格品牌规范的项目。
WHAT'S INSIDE
包含哪些 Skill
| Skill | 分类 | 8 周安装 |
|---|---|---|
| frontend-design（前端设计） 为新 UI 或现有界面改版提供有辨识度的视觉方向、排版和设计指导。 |
设计 | 196,008 |
| design-taste-frontend（前端设计审美） 为前端界面提供审美方向，改善排版、层级和视觉细节，减少模板感。 |
设计 | 242,577 |
| web-design-guidelines（Web 设计规范） 按 Web Interface Guidelines 审查 UI 代码，检查可访问性、交互和视觉规范。 |
设计 | 187,607 |
| design-mobile-apps（移动端界面设计） 用 AI 设计移动端界面，并落地成 React Native 代码。 |
设计 | 895,569 |
INSTALL
怎么装
先进入你要使用 Stack 的项目目录，再执行下面的命令。把 claude-code 换成 cursor / codex 即可装到对应 Agent。
npx临时运行 Node 包，不用先全局安装
skills addskills.sh 的安装命令
--skill只装这几个 Skill，不装整仓
--agent装到哪个 Agent 的项目目录
-y跳过确认提示
anthropics/skills
npx -y skills add anthropics/skills --skill frontend-design --agent claude-code -yleonxlnx/taste-skill
npx -y skills add leonxlnx/taste-skill --skill design-taste-frontend --agent claude-code -yvercel-labs/agent-skills
npx -y skills add vercel-labs/agent-skills --skill web-design-guidelines --agent claude-code -ydesigned-by-ai/skills
npx -y skills add designed-by-ai/skills --skill design-mobile-apps --agent claude-code -yNO TERMINAL?
不想敲命令，就把这段发给 Agent
请在我的当前项目安装这个 Stack：落地页设计包。
- anthropics/skills: frontend-design
- leonxlnx/taste-skill: design-taste-frontend
- vercel-labs/agent-skills: web-design-guidelines
- designed-by-ai/skills: design-mobile-apps
使用 npx skills add 安装到当前 Agent，安装前先确认 Node.js 22+。
安装后检查对应 Agent 的 skills 目录里是否存在 SKILL.md，并列出实际安装了哪些 Skill。
如果安装失败，不要声称成功，直接把错误信息发给我。命令会安装到项目的 Agent 目录，不修改全局环境。首次使用前请确认 Node.js 22+，并阅读每个 Skill 的 SKILL.md。这版 Stack 面向能运行命令行的开发者；纯 C 端一键安装还需要终端产品承接。
VERIFICATION
验货记录
来源 已通过安装 已通过任务 未实测
4 个 Skill 已在干净项目里通过 npx skills add 安装；尚未跑完整页面任务。
“来源核对”只代表 skill 的来源页和安装命令已检查；“安装测试”代表在干净项目里执行过安装；“任务实测”代表真的用这组 Skill 完成过一个任务。三者不是一回事。
环境要求
- Node.js 22+
- 支持 Skills 的 Agent
- 不需要额外 API Key
替代方案
只要视觉方向用 frontend-design；只要移动端落地用 design-mobile-apps。
NEXT
装完先跑一个最小任务，不要一次把整套流程压上去。Stack 只是起点，不是保证。