fronted-design
Skill140 starsChanged 8 months agoMITView on GitHub
当需要设计或实现高质量前端页面/组件（Web UI、美化、落地页、控制台）时使用。
In this repository43 other files it gives its agents.
- AGENTS.mdAGENTS.md
- docs/agents.mdAGENTS.md
- .cursor/rules/vibe-learn-craft.mdcCursor rule
- .cursor/rules/xrk-core-code.mdcCursor rule
- .cursor/rules/xrk-dev-requirements.mdcCursor rule
- .cursor/rules/xrk-infrastructure.mdcCursor rule
- .cursor/rules/xrk-project.mdcCursor rule
- .cursor/rules/xrk-third-party-plugins.mdcCursor rule
- accessibility-complianceSkill
- design-system-patternsSkill
- immersive-short-videoSkill
- interaction-designSkill
- mobile-android-designSkill
- mobile-ios-designSkill
- react-native-designSkill
- responsive-designSkill
- ui-ux-pro-maxSkill
- visual-design-foundationsSkill
- web-component-designSkill
- xrk-agent-runtimeSkill
- xrk-ai-workflowSkill
- xrk-app-devSkill
- xrk-authSkill
- xrk-coding-styleSkill
- xrk-configSkill
- xrk-crawlSkill
- xrk-dockerSkill
- xrk-docsSkill
- xrk-github-researchSkill
- xrk-http-apiSkill
- xrk-infrastructureSkill
- xrk-llmSkill
- xrk-mcpSkill
- xrk-node-runtimeSkill
- xrk-pluginsSkill
- xrk-project-overviewSkill
- xrk-rendererSkill
- xrk-runtime-utilSkill
- xrk-subserverSkill
- xrk-system-coreSkill
- xrk-taskerSkill
- xrk-v3-apiSkill
- xrk-www-compatSkill
The file
Files
权威入口
.cursor/skills/fronted-design/SKILL.md- 可配合：
.cursor/skills/visual-design-foundations/SKILL.md - 可配合：
.cursor/skills/interaction-design/SKILL.md
适用场景
- 从需求到页面落地的 UI 实现任务。
- 需要提升现有界面的视觉层级与一致性。
- 需要在不改业务逻辑前提下优化体验。
非适用场景
- 不用于替代业务接口设计或数据库建模。
- 不用于无依据的大改风格（需与品牌/产品目标一致）。
执行步骤
- 明确页面目标、核心用户任务与成功标准。
- 设计结构层级：布局、信息密度、主要操作路径。
- 定义视觉规则：颜色、字体、间距、状态反馈。
- 补全交互细节：hover/focus/loading/empty/error。
- 交付前检查响应式、可访问性与性能边界。
常见陷阱
- 只改样式不改信息层级，导致可用性仍差。
- 动效过多影响主任务与页面性能。
- 忽略空态与错误态，导致体验断层。
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.